Problema
El mazo Ritual Beast de Yu-Gi-Oh! tiene una regla incómoda: muchos de sus monstruos comparten una restricción de "una invocación especial por turno" por nombre, y es fácil perder la cuenta de a quién ya invocaste durante una partida rápida. Quería una ayuda visual, sin distracciones, que un jugador pudiera tener al lado mientras juega, tanto en el portátil como en el móvil, sin instalar nada pesado ni depender de conexión.
Solución
Diseñé una interfaz de una sola pantalla en HTML, CSS y JavaScript vanilla sobre Bootstrap: una rejilla con los 12 monstruos del arquetipo, cada uno con su carta y una casilla que marca con un check verde si ya se invocó especialmente este turno. Añadí un control aparte para las invocaciones normales, con contador y un botón "+1" para los efectos que conceden una invocación extra, más un botón de reinicio de turno. Después empaqueté exactamente el mismo código dentro de una app Android nativa con un WebView (Kotlin, AndroidX), incluyendo pantallas propias de carga y de error, de modo que la versión móvil funciona offline.
Resultado
El tracker existe en dos formatos desde una única base de código: una web que abre al instante y un APK Android instalable. La lógica de invocaciones vive en el cliente, así que no necesita servidor ni red. Fue mi primer proyecto end-to-end que cruza web y móvil, y consolidó un patrón que reutilizo: construir la UI una vez en web y envolverla nativamente cuando hace falta presencia en el teléfono.