La primera vez que probé cuatro cartas en horizontal, algo no cuadraba. La página no tenía scroll, pero la mano sí se salía de su espacio. El juego parecía caber. Las cartas, no.
Ese tipo de detalle es el que termina definiendo una interfaz. Puedes tener una idea clara en una pantalla grande y descubrir que en el teléfono la partida cuenta otra historia.
Una carta no es una imagen pegada
En FLIP! las cartas se dibujan en tiempo real. No son sprites prerenderizados. El número, el palo y sus detalles se componen con el Card Framework, así que podemos cambiar cómo se ven según el espacio disponible.
El número tiene que leerse primero. El palo ayuda a reconocer la carta, pero no puede competir con él. Cuando la mano se compacta, conservamos el rango y retiramos adornos que ya no ayudan. En vertical, si vuelve a haber espacio, pueden aparecer de nuevo.
En local, la interfaz muestra la partida que está ocurriendo en ese juego. En multiplayer, además de dibujar las cartas, la pantalla tiene que reflejar la misma partida que ven los demás. La carta sigue siendo una carta; lo que cambia es todo lo que debe coordinarse detrás para que la mesa no se contradiga.
FLIP! mezcla concentración, agilidad y estrategia con un poco de suerte. Hay que seguir lo que ocurre, reconocer las opciones y decidir qué jugar. La UI ayuda a que todo eso se entienda sin convertirse en otro jugador que interrumpe.
El audio también necesitaba su lugar
El audio lo cambiamos dos veces. No fue solo escoger otros sonidos. Tuvimos que mover responsabilidades hasta que los efectos pudieran responder a lo que estaba ocurriendo en la partida sin quedar amarrados a cada pantalla.
Por eso trabajamos un Audio Framework desacoplado, con contexto compartido y piezas para organizar efectos y combinaciones. El audio es dinámico porque acompaña distintos momentos del juego. Nos tomó iterar para encontrar dónde debía vivir esa lógica y cómo probarla.
Cada héroe necesitaba una entrada propia
Después se me ocurrió que los héroes no tenían que presentarse todos igual. Empecé a construir un sistema y un editor para darles identidad y probar su entrada sin rehacer el flujo completo del juego.
Para experimentar con estas ideas fuimos armando laboratorios: Card Lab, Audio Lab, Motion Lab, Scene Editor y los editores de héroes. No eran pantallas por hacer pantallas. Cada herramienta tenía que ayudarme a probar una parte concreta y entender qué cambiaba cuando la movía.
Diseñar también es quitar
El reto fue equilibrar lectura y movimiento. Las cartas tienen que comunicar información. El sonido debe acompañar una acción. Los héroes aportan carácter. Y todo eso tiene que dejar espacio para que la persona juegue.
Para jugar, hay que concentrarse. Para diseñarlo, también.
Puedes probar FLIP! en flipgame.strevel.net.
En la última parte voy a hablar del reto que más se alargó. No fue dibujar una carta. Fue lograr que dos personas entraran a la misma sala y vieran la misma partida.