Tutoriais

Assine via RSS

Guias práticos para criar jogos para web. Cada tutorial é independente e traz código pronto para copiar e colar.

Primeiros passos

Fundamentos do loop de jogo com Canvas 2D Crie um loop de jogo independente da taxa de quadros com requestAnimationFrame, delta time e passo de tempo fixo, além de sprites, colisões e uma câmera. Leia mais →

Fundamentos de WebGL para desenvolvedores de jogos Aprenda WebGL 2 puro desenhando seu primeiro triângulo com shaders GLSL, buffers, texturas e um loop de renderização. Leia mais →

Primeiros passos com WebGPU Configure um dispositivo WebGPU e o canvas, escreva shaders WGSL e renderize seu primeiro triângulo com a moderna API de GPU. Leia mais →

Física

Física para jogos para web Compare Rapier, Cannon-es, Ammo.js, Matter.js e outras opções com código real para escolher o mecanismo de física ideal para seu jogo. Leia mais →

Entrada e controles

Gerenciamento de entrada do jogo (teclado, mouse, toque e controle) Unifique teclado, mouse, toque e controle em um único objeto de estado de entrada que o loop do jogo lê a cada quadro. Leia mais →

API Gamepad para jogos para web Adicione suporte a controles com qualidade de console, incluindo mapeamento de botões, zonas mortas analógicas, vibração e multijogador local para até quatro jogadores. Leia mais →

Pointer Lock para jogos FPS Capture o mouse para obter uma visão suave em FPS e, em seguida, crie uma câmera com yaw/pitch, movimentação por WASD e mira bruta sem aceleração. Leia mais →

Gráficos e renderização

Canvas responsivo para jogos Dimensione seu canvas com nitidez em telas Retina usando devicePixelRatio, barras de enquadramento, escala inteira para pixel art e redimensionamento sem travamentos. Leia mais →

Renderização de pixel art Elimine o desfoque com escala inteira e suavização desativada e, depois, implemente animação de sprites, troca de paletas, mapas de tiles e tremor de tela. Leia mais →

Renderização de texto em jogos Desenhe textos nítidos com preenchimentos do Canvas, fontes bitmap e SDF, além de caixas de diálogo com efeito de máquina de escrever e números flutuantes de dano. Leia mais →

Áudio

API Web Audio para jogos Configure a API Web Audio para reproduzir sons em jogos com um gerenciador de áudio reutilizável, música em loop, panoramização espacial 3D e pool de sons. Leia mais →

Tone.js para áudio de jogos Gere efeitos sonoros e música reativa com os sintetizadores do Tone.js, dispensando arquivos de áudio e criando variações a cada reprodução. Leia mais →

Dados e armazenamento

Salvar e carregar com IndexedDB Armazene slots de salvamento, configurações e recursos binários no IndexedDB usando padrões assíncronos, salvamento automático e armazenamento persistente resistente à remoção. Leia mais →

Carregamento progressivo de recursos Carregue os recursos do jogo por níveis de prioridade, com barras de progresso reais, fila de simultaneidade e cache no IndexedDB para que os jogadores comecem rapidamente. Leia mais →

Desempenho e otimização

Publique um jogo para web que carregue rapidamente Uma lista prática que aborda limites de carregamento, compressão Brotli e Zstandard, texturas KTX2, divisão de código e cache. Leia mais →

Web Workers para a lógica do jogo Execute física, busca de caminhos A* e geração procedural em uma thread em segundo plano usando pools de workers, objetos transferíveis e OffscreenCanvas. Leia mais →

Ative threads Wasm (SharedArrayBuffer) Configure os cabeçalhos COOP e COEP que habilitam o isolamento entre origens para que SharedArrayBuffer e threads Wasm realmente funcionem. Leia mais →

Rede

Fundamentos de multijogador com WebSocket Configure um sistema multijogador em tempo real com reconexões, previsão no cliente, interpolação de snapshots e mensagens binárias por meio de um servidor autoritativo. Leia mais →

Dispositivos móveis e plataformas

Jogos para web compatíveis com dispositivos móveis Adicione controles por toque, joystick virtual, gerenciamento da viewport e da orientação e desempenho otimizado para bateria, garantindo uma ótima experiência em celulares. Leia mais →

PWA para jogos offline Torne seu jogo instalável e jogável offline com um manifesto, cache por service worker, avisos de atualização e sincronização da pontuação em segundo plano. Leia mais →

Service workers para cache de jogos Armazene os recursos do jogo em cache com estratégias cache-first, network-first e stale-while-revalidate, além de versionamento e solicitações de intervalo para áudio. Leia mais →

Boas práticas para incorporar jogos em iframes Incorpore seu jogo corretamente em iframes com as permissões adequadas, postMessage para a página principal, tela cheia, correções de foco e SDKs de plataformas. Leia mais →

VR/XR

Fundamentos de WebXR para jogos de realidade virtual Configure uma sessão de realidade virtual com WebXR, renderize para cada olho, leia os controles e adicione teletransporte e locomoção suave compatíveis com headsets controlados pelas mãos ou pelo olhar. Leia mais →

Análise e monitoramento

Análise de dados para jogos para web Crie um rastreador de eventos em lotes para sessões, funis de níveis, FPS, erros, testes A/B e privacidade condicionada ao consentimento. Leia mais →

Ferramentas e fluxo de trabalho

Ferramentas de IA agêntica para programação Compare Claude Code, Cursor e Copilot e aprenda fluxos de trabalho no modo de planejamento, etapas de aprovação e prompts que fazem os agentes editar e testar código real. Leia mais →