Claude Game Dev Log: Lições e Stack de Desenvolvimento Agentico em Three.js

Fluxo de Trabalho de Desenvolvimento de Jogos com Agentes de IA

Um desenvolvedor web sem experiência em desenvolvimento de jogos vem construindo um jogo Three.js line rider chamado LUMINAL inteiramente usando Claude AI ao longo de duas semanas, sem escrever nenhum código diretamente. O desenvolvedor relata que com persistência e uma assinatura Claude 5x ou 20x, alguém poderia produzir um jogo de qualidade em alguns meses.

Práticas-Chave de Desenvolvimento

• Estratégia Git: Use worktrees do Git para evitar colisões, mantenha um branch develop e trabalhe exclusivamente em branches de funcionalidades. Encerre sessões da IA e inicie novas assim que uma funcionalidade for concluída.
• TypeScript & Testes: Implemente TypeScript cedo e escreva testes unitários cedo, incluindo testes em cada plano enquanto o contexto está disponível. Audite testes regularmente e não adie testes end-to-end.
• Consciência de Infraestrutura: Identifique quando pedir à Claude para realizar tarefas repetitivas e construa infraestrutura compartilhada antes que a garantia de qualidade se torne repetitiva.
• Integração de Ferramentas: Use o plugin Superpowers para desenvolvimento de habilidades e brainstorming, e uma assinatura Codex de $20 para revisão de código, construção de especificações e ajustes direcionados de UI (melhor que Claude para feedback de UI baseado em imagens).
• Configuração do Terminal: O terminal WARP é recomendado em vez de outras configurações.

Abordando Limitações da IA

A IA tem dificuldades com questões subjetivas como paletas de cores, níveis de bloom e design de som procedural. A solução: faça a Claude construir centenas de controles deslizantes e alternadores apenas para administradores para parâmetros como bloom, mapas de cores e sons procedurais, com funcionalidade de exportação/importação JSON para alimentar configurações de volta para a IA.

Utilização de Recursos

Use recursos existentes em vez de construir tudo do zero: 21st.dev, CodePen, Sketchfab e ativos da comunidade.

Sabedoria de Desenvolvimento

• Você pode construir mais rápido do que pode corrigir bugs. Adicionar muito muito rápido leva a semanas de polimento e testes em navegadores.
• Use o tempo de inatividade para planejar usando ferramentas como Workflowy, com 20-30 planos/pensamentos/correções de bugs para detalhar com ChatGPT/Codex enquanto espera pela Claude ou limites de uso.
• Foque em aprendizado e diversão em vez de monetização imediata.

Stack Tecnológica

• Núcleo: TypeScript, Three.js, Vite
• Backend: Firebase (Auth, RTDB, Firestore, Hosting, Cloud Functions)
• Servidor do Jogo: Node.js com biblioteca ws WebSocket
• Testes/Linting: Vitest + ESLint
• Netcode: Simulação lockstep determinística sincronizando apenas deltas de entrada através de um retransmissor WebSocket (Cloudflare Workers). Usa RNG com seed + detecção de dessincronização de hash de frame para estado consistente entre clientes. Precisa de mais trabalho em reconexão.

URL do Jogo: https://luminal.live/ (descrito como "ainda uma bagunça cheia de bugs")