Journal 29
Hace un par de semanas, justo antes de las #JGA18, surgió en Twitter una conversación alrededor de un libro interactivo en crowdfunding en Kickstarter, el Journal 29 Revelation, segunda parte del Journal 29 publicado en 2017.
El libro-juego tiene una mecánica de resolución de los puzzles muy particular: cada página contiene un código QR con una dirección web donde se comprueba la solución o respuesta que hayamos pensado. Si acertamos, nos dará un código o palabra o pista que necesitaremos para resolver otros puzzles y, así, finalmente resolver el misterio planteado en el libro.
La mecánica es muy sencilla y da mucho juego para diseñar, además de libros interactivos, puzzles, pistas, códigos para Escape Rooms, BreakoutEdu o para otros proyectos gamificados. Como sé que hay gente interesada (y no miro para nadie, Clara), aquí os mando una versión en php. Es una versión preliminar sin pulir para ir abriendo boca. Podéis probarla aquí.
<?php
if( $_GET[«code»]) {
//En caso de coincidir el código, que en este caso es 12345, se cargan estos datos. Evidentemente, aquí ponemos el código correcto que hay que introducir
if ($_GET[«code»] == «12345») {
echo «<body style=’background: #000000;color:white;font-size:20px’>»;
echo «<center>»;
//Aquí podemos poner una imagen del proyecto en que se integre el puzzle, hay que subir la imagen al servidor y cambiar el nombre detrás del src=, tanto aquí como en la parte del html
echo «<img src=’escapecprgame.png’></img></br>»;
//Cambiamos el texto para incluir la pista que queremos dar. Podría ser también una imagen, un archivo…
echo «Well done!! </br> Utiliza el código 54321.»;
echo «</center></body>»;
//En caso de no coincidir el código, damos un mensaje de error y un botón de volver
} else {
echo «<body style=’background: #000000;color:white;font-size:20px’>»;
echo «<center>»;
echo «<img src=’escapecprgame.png’></img></br>»;
echo «El código es incorrecto. Vuelve a intentarlo.</br>»;
echo «<html><button type=’button’ onclick=’window.history.go(-1); return false;’>Volver</button>»;
echo «</center></body>»;
}exit();
}
?>
<html>
<body style=»background: #000000;color:white;font-size:20px»><center>
<img src=»escapecprgame.png»></img>
<form action = «<?php $_PHP_SELF ?>» method = «GET» autocomplete=»off»>
Inserte código: </br>
<input type = «text» style=»height:50px;width:100px;font-size:20px» name = «code» value=»» autofocus/></br>
<input type = «submit» value=»Comprobar» />
</form></center></body>
</html>
admin