Open Sea — Oceano WebGPU em tempo real
Um oceano WebGPU em tempo real renderizado com Three.js TSL: ondulação de Gerstner, detalhes de microssuperfície FBM, céu espectral, controles de estado do mar e hora do dia, e um modo de deriva sem intervenção. Este caso foi gerado pelo Kimi K3.
Uma demonstração autônoma de oceano em WebGPU, com controles de órbita, controles deslizantes de estado do mar e hora do dia, além de um modo de deriva.
Experimentar o Websites AgentCrie uma demonstração autônoma de oceano em tempo real chamada 'Open Sea' com WebGPU e Three.js TSL. Renderize ondulações de Gerstner com normais de microssuperfície FBM e um céu espectral que acompanhe a hora do dia. Inclua controles de câmera para arrastar e orbitar, rolar e aplicar zoom, um painel HUD com controles deslizantes de estado do mar e hora do dia, além de uma leitura de FPS em tempo real, e um modo de deriva que permita à câmera deslizar sozinha. Mantenha tudo em uma única página estática, sem etapa de compilação, mostre um elegante estado de inicialização enquanto o renderizador é iniciado e tenha uma degradação adequada quando WebGPU não estiver disponível.
Troque a calmaria da tarde por uma tempestade ao luar, com ondulação mais intensa, rastros de chuva e relâmpagos ocasionais.
Experimentar o Websites AgentCrie uma demonstração autônoma de oceano em tempo real chamada 'Open Sea — Night Storm' com WebGPU e Three.js TSL. Renderize ondulações de Gerstner com normais de microssuperfície FBM e um céu espectral que acompanhe a hora do dia. Inclua controles de câmera para arrastar e orbitar, rolar e aplicar zoom, um painel HUD com controles deslizantes de intensidade da tempestade e altura das ondas, além de uma leitura de FPS em tempo real, e um modo de deriva que permita à câmera deslizar sozinha. Mantenha tudo em uma única página estática, sem etapa de compilação, mostre um elegante estado de inicialização enquanto o renderizador é iniciado e tenha uma degradação adequada quando WebGPU não estiver disponível.
Coloque um pequeno veleiro sobre as ondas, que o espectador possa controlar pelo teclado enquanto ele navega na ondulação.
Experimentar o Websites AgentCrie uma demonstração autônoma de oceano em tempo real chamada 'Open Sea' com WebGPU e Three.js TSL. Renderize ondulações de Gerstner com normais de microssuperfície FBM e um céu espectral que acompanhe a hora do dia. Adicione um veleiro low-poly que flutue na ondulação com uma flutuabilidade simples e permita que o espectador o controle com WASD, enquanto a câmera pode acompanhar o barco ou orbitar livremente. Inclua controles de câmera para arrastar e orbitar, rolar e aplicar zoom, um painel HUD com controles deslizantes de estado do mar e hora do dia, além de uma leitura de FPS em tempo real, e um modo de deriva que permita à câmera deslizar sozinha. Mantenha tudo em uma única página estática, sem etapa de compilação, mostre um elegante estado de inicialização enquanto o renderizador é iniciado e tenha uma degradação adequada quando WebGPU não estiver disponível.
Detecte o suporte a WebGPU logo no início e disponibilize uma versão mais leve em WebGL2 para que a demonstração funcione em todos os navegadores modernos.
Experimentar o Websites AgentCrie uma demonstração autônoma de oceano em tempo real chamada 'Open Sea' que detecte o suporte a WebGPU na inicialização e use um renderizador WebGL2 mais leve quando WebGPU não estiver disponível, mantendo a mesma cena e os mesmos controles em ambos os caminhos. Renderize ondulações de Gerstner com normais de microssuperfície FBM e um céu espectral que acompanhe a hora do dia. Inclua controles de câmera para arrastar e orbitar, rolar e aplicar zoom, um painel HUD com controles deslizantes de estado do mar e hora do dia, além de uma leitura de FPS em tempo real, e um modo de deriva que permita à câmera deslizar sozinha. Mantenha tudo em uma única página estática, sem etapa de compilação, mostre um elegante estado de inicialização enquanto o renderizador é iniciado e faça o layout móvel recolher o HUD em um painel inferior, com órbita por toque.