Crie um RPG de navegador com um agente de IA em uma noite
Obtenha um jogo de navegador jogável em um único arquivo HTML sem conhecimento de código, usando um agente de IA gratuito.
- 1.Acesse o site do AgentHere e cadastre-se. No cadastro você recebe 1 000 000 tokens gratuitos, o que é suficiente para criar um protótipo de jogo sem vincular cartão.
Se o serviço não estiver disponível na sua região, use uma VPN ou outro chat de IA que suporte geração de código.
AgentHere ↗ - 2.Na seção «Meus agentes» escolha o modelo de assistente ou analista, depois abra o web chat. Envie o prompt para o agente criar a primeira versão do jogo.
Quanto mais preciso você descrever a mecânica, melhor será o resultado. Para o primeiro jogo, basta uma tela e ações básicas.
AgentHere ↗PromptCrie um RPG de texto simples baseado em navegador em um único arquivo index.html. Coloque todo o HTML, CSS e JavaScript dentro de um único arquivo. O jogador é um herói explorando uma floresta escura. Inclua uma tela inicial com um botão «Iniciar Jogo», um sistema de batalha simples com um Goblin (com botões «Atacar» e «Curar») e uma tela de Vitória/Derrota. Mantenha o código mínimo, mas jogável.
O que este prompt fazO prompt pede à IA para criar um RPG de texto simples em um único arquivo index.html com HTML, CSS e JavaScript embutidos. O jogo inclui uma tela inicial, batalha com um goblin (botões Atacar e Curar) e telas de vitória/derrota. - 3.Copie o código gerado pelo agente, crie um novo arquivo no seu computador chamado index.html e cole o código lá. Salve o arquivo.
Você pode pedir ao agente para dividir o código em blocos, se não couber em uma mensagem, ou simplesmente copiar todo o código do bloco com a extensão .html.
AgentHere ↗ - 4.Abra o arquivo index.html com um duplo clique em qualquer navegador. Verifique se o jogo inicia e se os botões funcionam.
Se o jogo não funcionar, copie o texto do erro do console do navegador (F12 -> Console) e envie para o agente corrigir.
Web Browser ↗ - 5.Volte ao chat com o agente e peça para adicionar uma mecânica específica ou melhoria. Atualize o código no seu arquivo.
Adicione um recurso por vez para não confundir o agente. Por exemplo, adicione som ou um placar de recordes.
AgentHere ↗PromptAdicione um item de poção de vida ao jogo. O jogador começa com 1 poção. Adicione um botão «Usar Poção» que restaura 30 HP e remove 1 poção do inventário. Atualize o HTML e o JavaScript adequadamente.
O que este prompt fazO prompt pede para adicionar uma poção de vida (1 unidade no início) e um botão «Usar Poção», que restaura 30 HP e remove a poção do inventário, atualizando o código. - 6.Quando o jogo estiver pronto, publique-o na internet para compartilhar o link. Cadastre-se no Surge, instale o utilitário e execute o comando de publicação na pasta do jogo.
Surge é um serviço gratuito para hospedagem de sites estáticos. Para instalar, execute no terminal `npm install --global surge`.
Surge ↗
- grátisAgentHere - cadastro gratuitoApós o cadastro, 1 000 000 tokens são creditados gratuitamente - isso é suficiente para criar o jogo e dezenas de iterações de correções; geração de imagens e músicas está incluída na conta.
- grátisVercel - hospedagem de landing pageO plano gratuito permite hospedar um site estático com o jogo e obter um link público sem pagamento.
Por que hoje
Serviços de IA mudam rápido - interfaces e limites gratuitos podem diferir do descrito.