IA cria mundo 3D em apenas 97 KB que roda a 180 FPS no navegador sem game engine
O projeto Abyssal Garden utiliza WebGPU pura e geração procedural para construir um ecossistema marinho interativo completo dentro de um arquivo HTML minúsculo.
Em uma época em que jogos modernos e aplicações interativas exigem downloads de dezenas ou centenas de gigabytes, um experimento publicado na comunidade de desenvolvimento de software chamou a atenção ao caminhar na direção totalmente oposta. Trata-se do Abyssal Garden, um ambiente marinho tridimensional interativo, rico em detalhes visuais e com iluminação dinâmica, empacotado em um único arquivo HTML de apenas 97 KB e capaz de rodar a impressionantes 180 quadros por segundo diretamente no navegador.
O projeto foi concebido pelo desenvolvedor Maksymilian Dendura (conhecido na comunidade como Noniv) utilizando o Claude Code, o agente de inteligência artificial da Anthropic. O grande diferencial não está apenas no uso de modelos de linguagem para escrever código, mas nas restrições extremas impostas à máquina: construir um ecossistema visual denso sem depender de motores gráficos tradicionais, sem bibliotecas externas e sem carregar uma única textura ou modelo 3D pré-fabricado da internet.
O poder da geração procedural com WebGPU
Para colocar o projeto de pé com um tamanho menor que o de uma foto comum em baixa resolução, o desenvolvedor recorreu à WebGPU, a moderna interface de programação gráfica para a web que substitui o antigo padrão WebGL. Em vez de utilizar motores consagrados como Three.js ou Babylon.js — cujo uso foi expressamente vetado nas instruções fornecidas à IA —, todo o pipeline de renderização foi programado do zero por meio de shaders escritos em WGSL (WebGPU Shading Language).
No Abyssal Garden, nada é estático ou importado de pacotes externos. Cada elemento visível na tela nasce em tempo de execução por meio de fórmulas matemáticas e computação gráfica procedural diretamente na placa de vídeo:
- Vegetação e leito marinho: Mais de dois milhões de folhas de algas gigantes (kelp) balançam organicamente com o movimento das correntes, enquanto o relevo do fundo do mar e dezenas de milhares de rochas são esculpidos matematicamente na GPU.
- Vida marinha ativa: Cardumes inteiros de peixes e majestosas arraias-manta patrulham o cenário, todos animados por algoritmos de comportamento sem que nenhum arquivo de malha 3D (.obj ou .gltf) tenha sido baixado.
- Efeitos de luz volumétrica: Raios solares (god rays) filtram-se pela superfície ondulada do oceano, criando reflexos cáusticos animados que iluminam detalhes do relevo e os destroços de um navio naufragado no fundo do abismo.
- Áudio sintetizado em tempo real: A atmosfera sonora imersiva não utiliza nenhum arquivo de áudio gravado em MP3 ou WAV. O som ambiente das profundezas é sintetizado ao vivo pelo próprio navegador através da Web Audio API.
“A meta era clara: qualidade visual convincente, geração 100% procedural, estabilidade rígida de taxa de quadros e entrega em um arquivo HTML autocontido, sem depender de motores prontos.”
A engenharia por trás do prompt e o loop de validação por IA
A construção do projeto não seguiu o caminho ingênuo de pedir um jogo pronto em uma única linha de comando. O autor estruturou um prompt mestre detalhado contendo diretrizes estritas de arquitetura de software, álgebra linear, limites de desempenho e parâmetros de fidelidade gráfica.
Um dos pontos mais fascinantes do fluxo de trabalho foi a criação de um sistema de auto-auditoria visual. O processo contou com um subagente de IA dedicado a inspecionar capturas de tela renderizadas pela simulação durante um percurso de câmera de 60 segundos. Caso a IA identificasse falhas na composição das algas, problemas de iluminação ou oscilações indesejadas no tempo de quadro (frametime), novas instruções eram passadas ao gerador de código para corrigir os shaders.
Ao longo de aproximadamente três dias — intercalados para respeitar os limites de requisições da plataforma —, o código foi refinado para ganhar detecção de colisão tridimensional, controle de câmera suave e um menu de ajustes com níveis de qualidade visual (Baixo, Médio e Alto).
Desempenho extremo: dos 180 FPS na RTX 5070 Ti ao celular de entrada
Em testes realizados com uma placa de vídeo topo de linha para jogos, como a GeForce RTX 5070 Ti em resolução 1440p (2560 × 1440), a simulação marcou médias estáveis em torno de 180 FPS. A ausência de sobrecarga de bibliotecas pesadas e o uso de chamadas de desenho otimizadas via WebGPU garantem um fluxo contínuo de renderização.
Mesmo em máquinas modestas ou aparelhos móveis compatíveis com o padrão WebGPU moderno, a experiência se mantém funcional. Em perfis gráficos mais econômicos, até mesmo smartphones de entrada conseguem executar o cenário em taxas jogáveis, demonstrando a eficiência da computação puramente procedural quando comparada ao carregamento tradicional de texturas pesadas.
Como testar o Abyssal Garden no seu navegador
O projeto está disponível gratuitamente com código aberto sob a licença MIT. Qualquer usuário equipado com um navegador recente que suporte WebGPU nativa (como o Google Chrome, Microsoft Edge ou navegadores baseados em Chromium) pode explorar o cenário livremente com controles tradicionais de teclado e mouse:
- Navegação: Utilize as teclas W, A, S, D para nadar nas quatro direções horizontais.
- Profundidade: Controle a subida e a descida no oceano pelas teclas direcionais ou barra de espaço.
- Câmera: Movimente o mouse livremente para direcionar a visão submarina em 360 graus.
Para quem deseja conferir a demonstração funcionando em tempo real ou analisar a engenhosidade dos shaders e do código-fonte, os links oficiais do projeto estão disponíveis na web:
- Acesse a demonstração interativa direto no navegador: Abyssal Garden Live Demo
- Inspecione o repositório e o código-fonte no GitHub: Repositório Noniv/abyssal-garden
O experimento do Abyssal Garden resgata o espírito da clássica demoscene dos anos 1990 e 2000 — onde programadores competiam para criar mundos visuais espetaculares dentro de disquetes minúsculos —, provando que a combinação entre engenharia gráfica precisa e ferramentas modernas de inteligência artificial pode abrir caminhos inéditos para a leveza e a eficiência do software na web.
Nenhum comentário!
Seja o primeiro a compartilhar sua opinião ou fazer uma pergunta.