HippoWorks
CoolTheClimate es un sitio que representa un mundo regenerativo a través de dibujos animados, opciones ecológicas y activismo promocionado por HippoWork.
Nuestro cliente nos encargó crear desde cero un sitio web donde se quería agregar contenido para la concientización del cambio climático y sumar algunos juegos online. Para el mismo, se nos pidió crear un template personalizado basados en el diseño web que el cliente nos había enviado. Basados en los estándares actuales de Wordpress, implementamos el theme y creamos los juegos utilizando HTML5 y Javascript.
Juegos
Creamos una plugin de Wordpress para implementar cada uno de los juegos. Este plugin incluye toda la funcionalidad de los juegos, las librerias javascript, efectos, integraciones de sonidos y captura de gestos para pantallas táctiles. Tecnicamente combinamos jQuery, Bootstrap y librerías de javascript puro que desarrollamos exclusivamente para este proyecto, en cada juego utilizamos HTML5 combinando imágenes y toda la lógica del juego, las reglas y puntajes se implementó en una controlador de javascript.
Estos juegos están apuntados a cualquier edad, pero nos enfocamos un poco mas en que pueda ser utilizados por los niños.
Jigsaw: este es el juego del rompecabezas (puzzle) el cual consiste en tener distintos niveles de dificultad que el usuario pueda seleccionar. Cada vez que aumentamos el nivel de dificultad, se toma la misma imagen pero la divide en piezas más pequeñas. Al conectar cada pieza el usuario escuchará un sonido y al completar el juego podrá ver una animación con los personajes del sitio. Se implementaron mejoras y optimizaciones para los dispositivos móviles, especialmente para iphone.
Climate animals: juego donde tenemos que intentar conectar animales similares en base a las celdas adyacentes. Al comienzo el juego realiza una distribución random de los animales, luego a medida que vamos jugando tenemos menos margen de error. El juego termina cuando alcanzamos el puntaje objetivo o bien si no tenemos mas movimientos disponibles.
Memory Game (juego de la memoria): Es el típico juego de la memoria donde tenemos que ir descubriendo pares de imágenes e intentar conectar las coincidencias.
Uno de los desafíos en este desarrollo fue tener una buena compatibilidad en cada uno de los dispositivos logrando que cada juego pueda ser utilizado fluidamente tanto en una PC como en un smartphone.
Tambien integramos links a redes sociales y funcionalidades para compartir contenidos
Panel de administración
Como el cliente quería una interfaz de usuario simple para agregar y modificar los juegos, utilizamos Wordpress, creamos tipo de contenidos personalizados (custom post type) y plugins que permiten gestionar cada uno de los juego. También modificamos el panel del usuario para mostrar solo la configuración de la cuenta y el registro de puntajes histórico. Cada uno de los usuarios registrado es también asociado a una lista de newsletter que se implementó cumpliendo las normativas vigentes.
Cada una de las secciones del sitio, el menu, imagenes y texto se puede editar facilmente desde el panel de administracion.
