Games · Devlog #04 · projeto pessoal

Magic Word

Um RPG 2D completo no navegador

Um RPG 2D no navegador com os sistemas que fazem um RPG ser RPG: mundo em tilemap, NPCs, combate, inventário, equipamento, crafting, missões, casa do jogador e um save local com testes automatizados.

1 min de leitura por Edinaldo Sá

  • RPG
  • Phaser 3
  • TypeScript
  • Vite
  • Vitest
  • Crafting
Ilustração em pixel art: campo verde em tiles com uma casa de telhado vermelho, árvores, um lago, uma bigorna soltando faíscas, um baú, um NPC com um sinal de exclamação e um herói dentro de um círculo de runas.
Ilustração em pixel art feita para este post. Não é uma captura do jogo.

RPG de verdade, no navegador

RPG de navegador costuma ser raso: um mapa, um inimigo e nenhuma progressão. O Magic Word é a minha resposta a isso. Ele traz os sistemas que fazem um RPG ser RPG, como crafting, equipamento, missões e save, rodando direto no browser, sem download e sem conta.

São doze cenas implementadas. É um jogo, não uma demo de uma tela só.

Os sistemas

Montei o jogo como um inventário de sistemas. Cada um destes está implementado:

  • MundoMundo em tilemapCom personagem controlável.
  • NPCsNPCs e interaçãoGente para conversar no mapa.
  • CombateCombate em cena própriaA luta acontece numa cena dedicada.
  • ItensInventário e equipamentoO que você carrega e o que veste.
  • CraftingCraftingFabricar itens faz parte do jogo.
  • MissõesQuests com logUm diário para acompanhar as missões.
  • CasaCasa do jogadorCom customização do personagem.
  • FichaFicha de personagemCom progressão.

Completam o pacote o áudio contextual por cena e uma tela inicial com New game e Continue, controle de som e tela cheia.

Save testado

O save e o load são locais, e a persistência tem testes automatizados com Vitest. Em RPG, perder o progresso é o pior bug possível, então faz sentido que este seja o ponto coberto por teste.

  • Save e load local
  • Testes de persistência com Vitest
  • Continue na tela inicial

Stack moderna

A base é moderna e tipada:

  • Phaser 3.90 + phaser-jsx
  • TypeScript 5.9
  • Vite 8
  • Node 24
  • Vitest
  • ESLint · Prettier · Husky

O projeto tem build pronto, CI configurado e um script para rodar localmente no Windows. O código está sob licença MIT.

Ficha técnica

Status
1.0.0-alpha, jogo funcional
Plataforma
Navegador, sem download e sem conta
Escopo
12 cenas
Motor
Phaser 3.90 + TypeScript 5.9
Licença
MIT (código)

Gosta de Phaser, TypeScript ou de testar save de jogo? Me conta.

Me escreva