Crea una RPG de navegador con un agente de IA en una sola noche
Obtén un juego de navegador jugable en un solo archivo HTML sin saber programar, usando un agente de IA gratuito.
- 1.Abre el sitio de AgentHere y regístrate. Al registrarte recibes 1 000 000 tokens gratis, suficientes para crear un prototipo del juego sin vincular una tarjeta.
Si el servicio no está disponible en tu región, usa una VPN u otro chat de IA que soporte la generación de código.
AgentHere ↗ - 2.En la sección «Mis agentes» elige la plantilla de asistente o analista, luego abre el chat web. Envía al agente el prompt para crear la primera versión del juego.
Cuanto más preciso describas la mecánica, mejor será el resultado. Para el primer juego basta con una pantalla y acciones básicas.
AgentHere ↗PromptCrea una RPG de texto simple basada en navegador en un solo archivo index.html. Coloca todo el HTML, CSS y JavaScript dentro de un archivo. El jugador es un héroe que explora un bosque oscuro. Incluye una pantalla de inicio con un botón «Iniciar juego», un sistema de combate simple con un Goblin (con botones «Atacar» y «Curar») y una pantalla de Victoria/Derrota. Mantén el código mínimo pero jugable.
Qué hace este promptEl prompt pide a la IA crear una RPG de texto simple en un archivo index.html con HTML, CSS y JavaScript integrados. El juego incluye pantalla de inicio, combate con un goblin (botones Atacar y Curar) y pantallas de victoria/derrota. - 3.Copia el código generado por el agente, crea en tu computadora un nuevo archivo llamado index.html y pega el código ahí. Guarda el archivo.
Puedes pedir al agente que divida el código en bloques si no cabe en un mensaje, o simplemente copiar todo el código del bloque con extensión .html.
AgentHere ↗ - 4.Abre el archivo index.html con doble clic en cualquier navegador. Comprueba si el juego se inicia y si los botones funcionan.
Si el juego no funciona, copia el texto del error de la consola del navegador (F12 -> Console) y envíalo al agente para que lo corrija.
Web Browser ↗ - 5.Vuelve al chat con el agente y pide añadir una mecánica o mejora específica. Actualiza el código en tu archivo.
Añade una característica a la vez para que el agente no se confunda. Por ejemplo, añade sonido o una tabla de récords.
AgentHere ↗PromptAñade un objeto de poción de salud al juego. El jugador comienza con 1 poción. Añade un botón «Usar poción» que restaure 30 HP y quite 1 poción del inventario. Actualiza el HTML y JavaScript en consecuencia.
Qué hace este promptEl prompt pide añadir una poción de salud (1 unidad al inicio) y un botón «Usar poción» que restaura 30 HP y quita la poción del inventario, actualizando el código. - 6.Cuando el juego esté listo, publícalo en internet para compartir el enlace. Regístrate en Surge, instala la utilidad y ejecuta el comando de publicación en la carpeta del juego.
Surge es un servicio gratuito para alojar sitios estáticos. Para instalarlo ejecuta en la terminal `npm install --global surge`.
Surge ↗
- gratisAgentHere - registro gratuitoTras el registro recibes 1 000 000 tokens gratis - suficientes para crear el juego y decenas de iteraciones de correcciones; la generación de imágenes y música está incluida en la cuenta.
- gratisVercel - alojamiento de landingEl plan gratuito permite alojar un sitio estático con el juego y obtener un enlace público sin pagar.
Por qué hoy
Los servicios de IA cambian rápido - las interfaces y los límites gratuitos pueden diferir de lo descrito.