Cómo Creamos Prism Break Con IA: Nombres, Barras de Cárcel y Saber Cuándo Empujar de Vuelta
La IA creó un juego completo de puzle de emparejar colores. El humano detectó las cosas que solo un humano notaría: un nombre que se esforzaba demasiado, una metáfora visual que parecía un bug y la ausencia completa de controles móviles.
Prism Break nos enseñó sobre juicio estético — que la IA puede crear un juego mecánicamente sólido más rápido de lo que esperarías, pero tiene puntos ciegos genuinos cuando se trata de cómo se ven y se sienten las cosas para un humano sentado frente a la pantalla.
Esta es la historia de un puzle match-3 que pasó por un mal nombre, una metáfora visual fea, un problema de rendimiento y un método de input faltante antes de convertirse en el juego que puedes jugar hoy. La IA lo creó. El humano detectó lo que ella no pudo ver.
¿Quieres jugar primero y luego leer la historia de cómo lo creamos?
▶ Juega Prism Break AhoraEl Problema del Nombre
Cuando le pedimos a la IA que creara un juego de puzle de emparejar colores, su primer movimiento fue nombrarlo. Ese es un instinto razonable — necesitas llamar a la cosa de alguna forma mientras la estás construyendo. El nombre que eligió fue "Synthwave Gems".
Vibe Arcade tiene una estética retro-futurista — colores neón, fondos oscuros, todo el rollo de recreativa de los 80 se encuentra con el navegador moderno. La IA claramente había interiorizado esto. "Synthwave Gems" era su intento de mantenerse en la marca: referencia a música retro, imaginería de gemas, el sentimiento general de pertenecer al sitio. Sonaba como si lo hubiera generado un algoritmo al que se le dijo "nombra cosas de forma retro-futurista". Que es exactamente lo que había pasado.
El feedback fue contundente: deja de forzar nombres para que encajen con el tema. Cualquier nombre que tenga sentido para la jugabilidad real funciona.
Volvió con "Prism Break". Mucho mejor. Evoca la mecánica central — luz, color, separar, romper. Suena como un juego que querrías jugar en lugar de una etiqueta de género que alguien plantó en una miniatura. El primer instinto de la IA fue consistencia de marca, cuando debería haber estado pensando en el jugador. Una vez le dijimos que pensara en el jugador, lo clavó.
La Primera Versión
La IA envió una rejilla 8x8 funcional de gemas coloridas. Clica una, clica una gema adyacente para intercambiar. Empareja tres o más y se rompen, las gemas restantes caen bajo gravedad, gemas nuevas caen en cascada desde arriba. Cada ola de cascada multiplica tu puntuación — un único intercambio bien colocado puede encadenar en miles de puntos.
Tres modos de juego llegaron desde el principio: un modo Cronometrado de 60 segundos, un modo de 30 Movimientos para planificación estratégica, y un Reto Diario que da a cada jugador el mismo tablero con semilla cada día. Las mecánicas eran sólidas y la puntuación se sentía bien. Pero la IA había tomado decisiones visuales e interactivas que necesitaban intervención.
El Desastre de las Barras de Cárcel
Los juegos match-3 necesitan gemas especiales — gemas creadas al emparejar cuatro o más en raya que tienen poderes extra cuando se emparejan otra vez. En Prism Break, emparejar cuatro crea una gema con rayas que despeja una fila o columna entera al activarse. La IA necesitaba una forma de mostrar qué dirección despejaría cada gema especial.
Su solución fue superponer barras de cárcel sobre las gemas. Líneas oscuras finas puestas sobre los gráficos de gema — barras horizontales para gemas que despejan fila, barras verticales para gemas que despejan columna. La lógica era sólida. Unas barras orientadas en la dirección del despeje comunicarían la mecánica claramente.
Se veía terrible.
Las gemas en Prism Break son formas brillantes, luminosas, coloridas. Poner líneas oscuras sobre ellas hacía que las gemas especiales parecieran tener un glitch de renderizado. Las barras competían con los colores de las gemas en lugar de complementarlos. Peor, hacían que las gemas especiales se vieran menos atractivas que las regulares — lo opuesto de lo que quieres. Las gemas especiales deberían verse poderosas. Estas se veían rotas.
El razonamiento de la IA era correcto pero su juicio estético estaba equivocado. Superponer elementos oscuros opacos sobre formas coloridas luminosas mata el atractivo visual. Un humano ve esto al instante. La IA no.
El Arreglo: Rayas Que Pertenecen
Le replicamos y discutimos alternativas. La solución que aterrizamos fueron patrones de rayas pintados dentro de las formas de las gemas mismas — no superpuestos encima, sino integrados en la identidad visual de la gema. Rayas horizontales para gemas que despejan su fila. Rayas verticales para gemas que despejan su columna. Las rayas siguen la silueta de la gema, así que se ven como una propiedad de la gema en lugar de algo pegado encima.
La diferencia fue dramática. Las gemas con rayas se ven como versiones potenciadas de las gemas regulares. Pulsan suavemente con un efecto de brillo, atrayendo el ojo sin competir con los colores base. La información direccional es igual de clara — puedes decir al instante en qué dirección disparará una gema especial — pero ahora las gemas se ven como algo que quieres activar en lugar de algo que salió mal.
La IA eligió un enfoque técnicamente válido que resultó verse mal. El humano lo detectó, y la discusión colaborativa produjo una mejor solución. La IA trajo la habilidad de implementación — pintando patrones SVG dentro de formas de gema, animando el brillo, acertando con el timing. El humano aportó el juicio de que barras oscuras sobre gemas brillantes es una opción estéticamente inviable.
Ajuste de Rendimiento
Con los indicadores visuales arreglados, nos volvimos al rendimiento. La IA había sido generosa con los efectos — ráfagas de partículas cuando las gemas se rompían, capas de brillo en cada gema, transiciones animadas en cascadas, números de puntuación flotantes, screen shake en grandes emparejamientos. Cada efecto se veía bien en aislamiento. Juntos, durante una cadena de cascada donde docenas de gemas se están rompiendo y cayendo simultáneamente, atascaban el framerate.
Esto llevó unas pasadas. El enfoque no fue eliminar los efectos por completo — la energía visual del juego es parte de lo que lo hace satisfactorio — sino averiguar qué efectos estaban aportando lo suficiente. Algunas capas de brillo se simplificaron. Los conteos de partículas se redujeron. Las duraciones de animación se apretaron para que los efectos se resolvieran más rápido y se superpusieran menos. El resultado final se ve casi tan bien como la versión al máximo pero corre suavemente durante cadenas de cascada largas en teléfonos de gama media.
El ajuste de rendimiento es un área donde la IA tiende a añadir en lugar de restar. Es buena generando efectos, menos buena evaluando si el coste acumulado vale la pena el pago visual. La IA puede ejecutar los arreglos una vez los identificas, pero necesita un humano mirando la pantalla para decir "esa cascada acaba de soltar frames — bájalo".
Adaptación Móvil
El modelo de interacción original era directo: clica una gema para seleccionarla, luego clica una gema adyacente para intercambiar. Esto funciona perfectamente en escritorio. Un cursor de ratón es preciso, los clics son intencionados, y el patrón de dos clics se siente natural con un dispositivo apuntador.
En móvil, se sentía torpe. Tocar una gema pequeña para seleccionarla, luego tocar la gema adyacente para intercambiar — la interacción de dos toques añadía fricción que los jugadores de escritorio nunca sentían. No estaba roto. Pero se sentía como un juego de escritorio siendo tolerado en móvil en lugar de un juego diseñado para tacto.
El feedback era simple: añade gestos de swipe. La IA implementó controles táctiles para que arrastrar una gema en cualquier dirección iniciara un intercambio. Un gesto en lugar de dos toques. El tablero de repente se sintió responsivo y directo de una forma que el patrón click-click no podía igualar en una pantalla táctil.
Este es otro caso donde la IA construyó algo que funcionaba pero no notó la brecha. "Funcional" y "bueno" no son lo mismo, y la diferencia era obvia la primera vez que un humano intentó jugarlo en un teléfono. La IA no coge un teléfono y juega su propio juego. El humano sí.
Lo Que Esto Nos Enseñó Sobre los Puntos Ciegos de la IA
Prism Break es el ejemplo más claro que tenemos del patrón de colaboración que define cómo creamos juegos. La IA creó un juego match-3 completo con puntuación en cascada, tres modos de juego, mecánicas de gema especial y efectos de partículas. Mecánicamente sólido desde la primera versión.
Pero cada problema que arreglamos era algo que un humano notó mirando la pantalla o sosteniendo un teléfono. El nombre sonaba algorítmico. Las barras de cárcel parecían un bug. Los efectos eran demasiado pesados. Los controles móviles eran un añadido tardío. Estos no son problemas de lógica. Son problemas de gusto, de sensación, de contexto. Requieren saber lo que es ser una persona usando la cosa que hiciste.
La IA envía rápido. El humano detecta las brechas. Ese es el bucle. La IA no se pone a la defensiva cuando le dices que las barras de cárcel se ven terribles — simplemente propone alternativas. El humano no tiene que construir el sistema de gemas con rayas desde cero — solo tiene que saber que las rayas dentro de la forma son mejores que las barras encima.
La conversación de nombres aún nos hace sonreír. "Synthwave Gems" es exactamente lo que una IA nombraría un juego en un sitio retro-futurista — técnicamente apropiado y completamente sin inspiración. "Prism Break" es lo que pasa cuando le dices a la IA que deje de intentar ajustarse al molde y empiece a pensar en lo que realmente es el juego. A veces la mejor dirección creativa que puedes darle a una IA es permiso para dejar de ser tan complaciente.
Juega Prism Break — prueba el modo Cronometrado para cascadas de reflejo rápido, o asume el Reto Diario y mira cómo se compara tu estrategia con la de todos los demás en el mismo tablero.
Lecturas relacionadas: ¿Qué es Vibe Coding? · Herramientas de Vibe Coding: Desde Chatbots hasta IDEs de IA · Cómo Creamos Neon Snake · Cómo Creamos Solitaire