Crear un simulador de vida artificial en un solo archivo HTML

A quién le sirve. Curiosos que quieran ver cómo una IA programa algo visual y probarlo en el navegador sin instalar nada, más como experimento divertido o contenido que como herramienta de negocio.

Qué hicieron

Cuatro agentes Grok 4.20 (Beta) recibieron la misma petición: un solo archivo HTML que simule cientos de partículas de neón de seis colores, con una matriz de 6x6 de controles deslizantes de atracción y repulsión. Debía permitir crear partículas con un clic, aleatorizar, pausar, cambiar la velocidad y el número de partículas, y activar estelas y efectos oscuros. Cada agente generó el archivo completo por su cuenta. El usuario lo abrió y grabó la simulación en marcha.

Qué necesitas

• Acceso a Grok o al chat de IA que prefieras, siempre que sepa escribir código
• Un navegador web (Chrome, Safari, Firefox)
• Un editor de texto sencillo para guardar el código como archivo .html (el Bloc de notas o TextEdit en modo texto plano)
• Opcional: un grabador de pantalla para enseñar el resultado

Cómo hacerlo tú, paso a paso

1. Describe con detalle cómo quieres que se vea: cientos de partículas de neón de varios colores y controles deslizantes que marquen cuánto se atrae o se repele cada color con los demás.
2. Pide los botones que quieras: crear partículas con un clic, aleatorizar, pausar, cambiar la velocidad y activar estelas o efectos oscuros.
3. Pide que lo entregue todo en un solo archivo HTML que se abra sin instalar nada.
4. Copia el código que te dé y guárdalo en un archivo cuyo nombre termine en .html. Haz doble clic para abrirlo en el navegador.
5. Prueba los controles. Si algo falla o va lento, copia el problema tal cual en el chat y pide que lo corrija.
6. Pide los añadidos de uno en uno y vuelve a probar después de cada cambio.

Crea un simulador de vida artificial en un único archivo HTML, con partículas brillantes de [número] tipos y controles deslizantes para las fuerzas entre ellas, de modo que surjan comportamientos como agruparse u orbitar. Pruébalo en un navegador y corrige los problemas de rendimiento. Habrás terminado cuando los controles produzcan comportamientos claramente distintos y el archivo se abra sin instalar nada.

Consejos

• Empieza con pocas partículas y sube el número cuando todo funcione. Con demasiadas, el navegador se puede ralentizar.
• Insiste en que sea un solo archivo. Si no, la IA puede repartirlo en varios y se complica abrirlo.
• Pide lo mismo a dos IA distintas y compara. En el caso se lo pidieron a cuatro agentes a la vez.

Preguntas frecuentes

Fuentes

• @tetsuoai en X ↗

En el directorio desde el 10 de octubre de 2026.