[7 Dias] Criando um jogo divertido com IA

Já se passou uma semana desde que começamos a criar um jogo web baseado em D&D5e com o Perplexity.AI.

Hoje, houve mais melhorias na arquitetura interna para construir um jogo ainda mais robusto do que o conteúdo em si.

★ Uso de canvas em camadas

Em vez de usar um único canvas, dividimos em três canvases (background, ui, character).

Dessa forma, em vez de redesenhar tudo, apenas as partes que precisam de atualização são redesenhadas e combinadas,

o que (segundo a IA) ajuda a melhorar o desempenho geral. ㅎㅎ

Aprendi algo novo também: se não houver save e restore no trabalho com canvas, os elementos se influenciam mutuamente,

então, para representar com precisão no canvas o que se deseja, deve-se usar save e restore.

★ Mudança para o método ESM

Anteriormente, todos os js eram carregados no html via <script>, mas à medida que o código era separado, o js aumentava...

Então, inicialmente, tentei usar o require.js, baseado em memórias do passado, mas a IA me ensinou uma técnica mais avançada.

Graças a isso, refatorei para o método ESM. Agora, não importa o quanto o código cresça,

Como mostrado acima, apenas o main.js declarado como module é referenciado no index.html. Parece bom.

Após melhorar a estrutura geral dessa maneira, foi possível adicionar os seguintes recursos.

★ Implementação da interação com as instalações

Ao entrar em uma instalação, as opções são exibidas na janela de diálogo e a interação é possível através de cliques (toques).

Este recurso será fundamental para a adição de vários sistemas no futuro. Houve muitos bugs e correções durante a adição, mas

agora está funcionando corretamente, então está OK.

Agora, as opções aparecem na janela de diálogo e funcionam corretamente ao clicar. A indicação de localização também está correta.

E em combate, o efeito é exibido de acordo com o resultado do ataque, como mostrado abaixo!

Se acertar, aparece "Hit!" e se ocorrer um crítico, aparece "Critical!". Isso também não funcionou ontem, hahaha...

Depois de organizar e melhorar a estrutura do código, sinto que os recursos implementados estão funcionando conforme o esperado.

Como todas as imagens são carregadas antes do início do jogo, uma tela de carregamento também foi implementada, como mostrado abaixo.

Digamos... agora parece mais um jogo de verdade.

A organização e a base parecem estar prontas, então vou começar a implementar a próxima etapa.

Primeiro, vou implementar um sistema de magia para classes de conjurador, ações adicionais para classes de ladrão e guerreiro, e

eventos acionados durante a exploração, não em combate; missões, descanso, comércio e cenários por meio de interações na cidade, etc...

Nossa... ainda há muito o que fazer!?

Ainda assim, com a ajuda da IA, seguiremos em frente com alegria.

Endereço de teste: https://ggoban.com/d2ng/

Endereço do GitHub: https://github.com/d2ng/