El objetivo de esta historia interactiva, en el que encarnamos el papel del jugador croata Robert Prosinecki, es tener el menor número de lesiones posibles, lo cual vendrá indicado por las decisiones que tomemos durante su desarrollo. Se trata de un juego cortito sin muchas pretensiones más que practicar con Harlowe, mi formato de historia preferido.
Tras el prólogo, el juego se divide en jornadas, 11 en total. Ni siquiera están todos los equipos de la liga 91-92, pero no quería que se hiciera excesivamente repetitivo. Cada jornada, a su vez, consta de dos partes, el previo al partido, en el que está la interacción en sí, y los partidos, donde veremos diversos mensajes que "narrarán"el acontecer de los mismos. Tras el derby con el Barça, el juego acabará y podremos ver qué lesiones hemos sufrido y si nuestro equipo ha ganado la liga.
En el aspecto técnico, no he encontrado muchos problemas. Si acaso el mayor quebradero de cabeza, si es que se le puede llamar así, fue ajustar las imágenes para que en dispositivos móviles se vieran por completo. Esto lo conseguí con el código:
img{
max-width: 100%
}
Se puede hacer mejor y de forma más completa pero me sirvió para salir del paso y, total, este juego tiene un recorrido cercano a cero así que no me molesté en buscar soluciones más elegantes.
Para el aspecto de 8 bits de las imágenes, usé la app para móviles: 8 bit photo lab, la cual tiene distintos filtros gratuitos, tan completos, que hace innecesaria la compra de la versión de pago para desbloquear los demás, si no buscas un look de 8 bits en concreto. Usé filtros a discreción sin tener una línea fija: desde Apple II hasta EGA, pues a según qué foto le sentaba mejor una u otra. Las imágenes, de más está decir, las saqué de Google.
Cabía la posibilidad de incluir música o efectos de sonido como los gritos de un grupo de aficionados durante los partidos, pero lo desestimé pues podría hacerse muy pesado. El código para ello era el siguiente:
<script>
var audio= document.createElement('audio');
audio.src=
'animando.mp3'; //animando.mp3 será el audio que queramos.
audio.loop = true;
audio.play();
</script>
Teniendo en cuenta que teníamos que pegarlo en el pasaje donde quisiéramos que se reprodujera y que el archivo mp3 debería estar en el mismo directorio que el archivo HTML del juego.
Otra de las nuevas características implementadas en este juego, es la aparición automática, con un efecto de máquina de escribir, de un texto determinado, teniendo en cuenta que después de 6 segundos saltaríamos a otro pasaje, lo cual se conseguía escribiendo lo siguiente en el pasaje en cuestión:
Para que funcione, tendremos que haber creado un pasaje con el nombre Typewriter y el siguiente código:(set: $timer to 6) //tiempo que queramos que dure la animación.
<!-- Asigna el texto que se mostrará -->
(set: $typewriterText to "Texto que queramos!")
<!-- Muestra (call) el pasaje Typewriter -->
(display: "Typewriter")
{
(live: 1s)[
(if: $timer is 0)[
(stop:)
(goto: "Comienzo")
]
(else: )[
(set: $timer to it - 1)
]
]
}
{<!-- Crea una variable para rastrear la posición dentro de la cadena $typewriter -->(set: $typewriterPos to 1)<!-- Crea un gancho para mantener el texto escrito -->|typewriterOutput>[]<!-- Asigna un retraso de 20ms por bucle -->(live: 20ms)[<!-- Añade el siguiente caracter al gancho -->(append: ?typewriterOutput)[(print: $typewriterText's $typewriterPos)]<!-- Actualiza la posición -->(set: $typewriterPos to it + 1)<!-- Si ha llegado al final, para -->(if: $typewriterPos is $typewriterText's length + 1)[(stop:)]]}
(either: "Chendo", "Sanchis", "Buitre")
