Gênios Game - Programando com IA é como montar os Vingadores (e alguém precisa liderar o time)

🌌CodeVerse2026 - #04

🧑💻 Fala Galera Dev! 👋

Nesse artigo #04 do CodeVerse2026, vamos ver juntos como desenvolvi o Genius Game, um jogo de memória sequencial feito com HTML, CSS e JavaScript puro, sim javascript puro, para facilitar o entendimento da logica o jogo e não ficar inventando dificuldade em coisas que podem ser simples — e principalmente como foi usar IA (GitHub Copilot) no processo.

E pra deixar bem fácil de entender (vamos voltar a metodologia do CodeVersePython2025), vou explicar tudo usando uma analogia com o universo Marvel. 😄

Até porque eu sempre prefiro aprender coisas que chamem minha atenção e não seja aquelas aulas e textos metódicos igual vemos com muitos professores do encimo médio ou de faculdade que só sabem falar conceitos e linguagem técnica para mostrar que sabem muito.

🧩 O Genius Game em uma frase (pra situar)

Pensa no Genius como um “treino do Doutor Estranho”: o jogo mostra uma sequência de cards brilhando… e você precisa repetir na ordem certa. A cada rodada, o jogo aumenta a sequência e você vai ficando mais rápido e mais atento.

Os cards são de personagens que eu criei no ano passado, cada um deles representam uma linguagem de programação e vou utiliza-los durante todos os artigos do CodeVerse2026 e nos próximos, ano passado vocês só conheceram o avatar do python, mas esse ano vamos conhecer todos.

De um modo bem geral o jogo possui:

• 3 níveis de dificuldade (4, 9 ou 12 cards)
• sons e música
• pontuação e rodadas
• tela de game over
• e tudo responsivo (mobile, tablet e desktop)

🛠️ Antes do código: eu fiz um plano ou (PRD)

Antes de sair codando, eu criei um PRD (um documento com requisitos). Pensa no PRD como o projeto da armadura do Homem de Ferro: antes de construir, você define o que a armadura precisa ter, para assim passar ao JARVIS, para assim ele saber como te ajudar a criar.

Pegando uma definição mais formal, o Product Requirement Document (PRD), ou Documento de Requisitos do Produto, é um guia essencial criado pelo gerente de produto para descrever o objetivo, funcionalidades, funcionalidades e público-alvo de um produto ou funcionalidade a ser desenvolvida. Ele traduz necessidades de usuários e objetivos de negócios em especificações claras para equipes de engenharia, design e stakeholders, focando no "o quê" e "porquê" construir.

Nesse PRD eu escrevi: o que o jogo deve fazer, quais telas precisa ter, como funciona a pontuação, quais dificuldades existem e como o usuário joga.

Isso foi fundamental porque, quando eu fui usar IA, eu não fiquei “pedindo qualquer coisa”. Eu tinha um mapa, para que o copilot se embasasse e me entregasse exatamente o que eu queria. E para refinar esse documento adivinha o que foi que usei? Exatamente o ChatGpt, que foi me ajudando e guiando para que eu conseguisse gerar um documento completo.

Assim gerei um arquivo em formato markdown que coloquei dentro de uma pasta do projeto com o nome PRD.MD e em cima dele fui criando os prompts para ir criando e corrigindo toda a produção do game.

🤖 Copilot no projeto: o “Jarvis” que escreve, mas você decide!

Eu usei o GitHub Copilot como se fosse o Jarvis do Tony Stark. Só que tem um detalhe importante: O Jarvis pode sugerir e construir… mas quem decide o que vai pra armadura é o Tony, e assim que deve ser durante toda a sua trajetória de desenvolvedor.

No meu caso foi assim: eu pedia “cria a página inicial”, depois “cria a lógica da sequência”, depois “agora adiciona sons”, depois “cria a tela de resultado”… tudo passo a passo.

Um detalhe os sons eu baixei de um site gratuito: https://elevenlabs.io/pt/sound-effects/gaming

E entre uma etapa e outra, eu revisava, ajustava e corrigi. E vou te dizer, muitas das vezes não sai da forma como você imagina, precisando fazer correções manuais ou voltando um passo atras, explicar melhor o que deseja e pedir para cria novamente.

Ou seja: a IA ajudou muito na velocidade, mas eu fui o guia do projeto, assim como um líder de projeto, você tem a IA para gerar código e a cada entrega você deve validar, ver se esta de acordo com as suas especificações e aprovar ou rejeitar o código, agindo como um dev sênior, e mostra no código o erro, etc.

✅ A lógica do jogo foi tranquila...

A parte do JavaScript (sequência, verificação, pontuação) foi a mais “reta”. Tipo o Capitão América: não inventa moda, só faz o básico muito bem feito. e assim o copilot sempre me devolvia o que eu pedia de uma forma bem assertiva.

Claro que teve ajuste aqui e ali, mas nada absurdo.

😅 O maior vilão foi o CSS:

Parece até mentira, mas o CSS foi o verdadeiro Thanos. Muitas vezes eu pedia pro Copilot: “deixa o botão mais visível”, “centraliza isso”, “ajusta o layout no mobile”…

Ele até escrevia o código certo… mas existia um CSS antigo (ou alguma regra anterior) que estava “estalando os dedos” e apagando a mudança. rs

A sensação era: eu fazia a alteração… e nada mudava na tela.

Aí eu tive que fazer o que todo dev júnior aprende na marra:

• abrir o DevTools
• entender qual regra estava ganhando na cascata
• remover estilos antigos
• reorganizar classes
• e ajustar na mão

Resumindo: a IA ajudou, mas CSS exige olho humano. Sempre.

🧹 IA também cria “gambiarras” e código a mais (tipo o Deadpool: fala demais)

Outro ponto real: IA às vezes cria coisa que você não pediu ou ignora funções que voce nõ usa mais por algum motivo de evolução do projeto e esqueceu de apagar. Funções extras, estilos duplicados, variáveis que não usa, código morto…

É tipo o Deadpool: engraçado, rápido… mas passa do ponto e você precisa cortar o excesso. 😄 Então eu precisei revisar e limpar bastante: apagar trechos inúteis, simplificar funções e deixar o projeto enxuto.

Porque se você não faz isso, o código cresce e vira bagunça, e depois você mesmo sofre pra manter ou dar quaquer manutenção que seja. E aquela frase: "Quando escrevi o código apenas eu e Deus entediamos sobre, agora só Deus sabe" rs.

🧠 A grande lição que fica ao final desse projeto:

Usar IA pra programar é como montar uma equipe dos Vingadores., a IA pode ser:

• o Jarvis (ajudando com sugestões)
• o Homem de Ferro (acelerando construção)
• até o Hulk (resolvendo uma parte bruta rápido)

Mas se não tiver alguém guiando… vira caos.

O programador continua sendo o Nick Fury: quem define o objetivo, organiza o time e garante que o projeto chegue até o final. O olhar humano atualmente ainda é muito necessário no desenvolvimento de qualquer projeto. Não sei daqui há alguns anos ou até mesmo meses, pois a IA esta evoluindo tão rápido que fica difícil prevermos o quanto tempo o modo como codamos hoje vai permanecer. Mas uma coisa eu sei, por mais que a IA seja criativa ela foi treinada em cima de nós humanos e somos nós que definimos o caminho que ela pode trilar, então seja o decisor da sua vida e do seu código, sempre!

🎮 Onde ver o jogo e o código

Na semana passada eu publiquei um vídeo do Genius Game rodando aqui no LinkedIn. E pra quem quiser ver a implementação completa, o repositório está no GitHub:

🔗 https://github.com/Carlos-CGS/CGS/tree/main/games/GeniusGame

Se você curtiu esse projeto e quer acompanhar os próximos artigos do CodeVerse2026, me segue aqui no LinkedIn é por aqui que eu publico os vídeos e artigos quinzenais.

E se você quiser ver o código na prática, estudar a estrutura e até adaptar o projeto pra treinar, o repositório está no meu GitHub (link no meu perfil e também no repositório do Genius Game).

Use IA para ganhar velocidade, mas use sua cabeça para ganhar evolução, quem entende o código sempre fica à frente de quem só copia.

Seguimos no CodeVerse2026. Um projeto de cada vez. 🚀🧑💻Fala Galera Dev! 🧑💻✨