Lilibeth’s Parade: un postmortem y una guía para juegos físicos

El pasado Global Game Jam 2017 fue un buen jam para mí y para Yole, con quien participé. Los game jams son una ocasión propicia para ensayar nuevas ideas, esto es algo fundamental en el evento, y nosotros lo aplicamos sobre el concepto propio del videojuego.

Revelando el tema del GGJ 2017

El tema del GGJ 2017 fue Waves (ondas) pero decidimos tomar otro significado de la palabra, el verbo saludar (to wave). Así, nos inspiramos en el icónico saludo de la Reina Isabel de Inglaterra como mecánica principal de juego. Dos jugadores deben saludar en una forma específica, compitiendo entre ellos.

La Reina de Inglaterra saluda

Habíamos establecido previo al inicio del evento que íbamos a hacer un juego con Arduinos y un Raspberry Pi. Esto es un cambio sustancial con respecto a años anteriores. Ya con Yole había hecho un juego de mesa y un videojuego. Anteriormente, fui colaborador en su proyecto final como estudiante que combinó fotografía, escultura y tecnología, usando ambas tecnologías. Pero en esta ocasión la idea implicaba usar estos componentes a una escala que no habíamos intentado antes.

Ya llevábamos entonces la idea al evento: no solamente reemplazar la entrada, el control, sino también la salida, la pantalla. Teníamos la idea de hacer un juego «autocontenido», algo que pudiésemos mostrar como un modelo de cartón con partes movibles, que no mostrase partes de computadora obvias. No lo pudimos lograr del todo: el juego aún requiere una computadora con mayor capacidad que el Raspberry Pi, pero la idea está ahí y se puede abordar para otro proyecto.

Al finalizar el evento presentamos «Lilibeth’s Parade», un juego electrónico para dos jugadores. En un modelo de cartón de la torre del palacio de Westminster están dos carros, y cada jugador debe saludar como la Reina de Inglaterra para avanzar su carro, ganando el primero que llegue a la torre. A continuación un video del primer gameplay, y aquí el repositorio en GitHub del código tal cual lo entregamos.

Demostración de Lilibeth’s Parade

Nuestro juego causó mucha curiosidad al finalizar el jam. Fuimos prácticamente el único equipo que utilizó una combinación de computación y electrónica, y muchas de las preguntas iban orientadas hacia esa parte.

Creo que esta reacción valida nuestra idea de que hay oportunidades para hacer juegos que no impliquen interactuar con una pantalla o con un control usual de videojuegos (teclado, mouse o controlador).

Por esto, en el resto del artículo estaré explicando a manera introductoria cómo funciona «Lilibeth’s Parade» y el proceso de cómo llegamos hasta este concepto.

Computación física para todos

Algunos de ustedes estarán leyendo los términos Arduino o Raspberry Pi por primera vez, o probablemente no le vean sentido en un blog de desarrollo de videojuegos. A continuación daré una introducción a la computación física, y explicar un poco de dónde viene todo esto. Si estás familiarizado con el campo, puedes saltar a la siguiente sección.

La computación física es un campo en el que la computación y la electrónica se reencuentran. A través de tableros electrónicos programables se pueden hacer prototipos de circuitos electrónicos muy rápidamente. El tablero se conecta a la computadora a través de un cable USB y se programa con lenguaje C. Los programas se escriben, se compilan, y se descargan al tablero. Después de haber descargado el código, el tablero se puede desconectar de la computadora y sólo requiere electricidad para funcionar.

Estos tableros consumen muy poca energía comparado con una computadora, pudiendo funcionar por horas con una batería de 9 voltios. Son dispositivos relativamente sencillos y limitados, por lo que no corren un sistema operativo completo, pero esto los hace funcionar muchísimo más rápido que una computadora.

Los tableros disponen de conexiones para componentes electrónicos, llamados pines. Se pueden conectar componentes electrónicos a estos pines, y el tablero tiene la capacidad de «leer» y «escribir» voltajes a estos pines. Al leer un valor de un pin, se convierte un impulso eléctrico a un número que el código puede entender y procesar. Al escribir un valor se puede operar sobre un componente electrónico, por ejemplo, encender una luz, mover un motor. Los valores pueden ser literalmente ceros y unos (o bajo y alto voltaje), o puede ser un valor análogo.

La gran ventaja que tienen los tableros electrónicos es que existen muchos componentes electrónicos que se pueden conectar y usar instantáneamente. Los más complejos, como pantallas, servos, luces, traen librerías que permiten usarlos muy fácilmente; usualmente con una llamada para inicializar el componente, y otra llamada para llevarlo a algún estado. Otros componentes traducen alguna condición del ambiente en impulsos eléctricos, como sensores de luz, de distancia, temperatura, sonido, humedad, lo que amplía el campo de lo que puede hacer una computadora. Existen otros componentes que permiten al tablero comunicarse con otros dispositivos, a través de una red con cables o inalámbrica o a través de transmisión de radio.

La computación física así permite usar cómputos para una variedad de campos: desde las artes hasta cosas más prácticas, como botánica, o proyectos de automatización casera. Siendo este un sitio de videojuegos, nos orientaremos a cómo aplicar computación física para esto, pero que quede claro que existe muchísima gente trabajando en computación física que no está haciendo videojuegos (agarra la pista: mira lo que están haciendo en otros campos).

A continuación explicaremos tres componentes que utilizamos durante el jam, lo que dará la base para explicar el funcionamiento del juego al final del artículo.

Arduino

Una marca reconocida de tableros es Arduino, y es casi el nombre genérico que se ha adoptado en la comunidad para los tableros. Su diseño es open source, y otros fabricantes han desarrollado tableros «compatibles con Arduino», lo que te permite conectarlo y usarlo con la computadora casi de la misma manera. Existen muchos modelos, cada uno con formas y disposiciones de pines diferentes para necesidades diferentes. Algunos de ellos, como el Gemma de Adafruit, tienen forma de botón y están hechos para coserse en la ropa con un hilo conductor, combinando moda y electrónica.

Los tableros Arduino se conectan con la computadora a través de un cable USB. En la computadora instalas el ambiente de desarrollo de Arduino que tiene la capacidad de compilar el código que escribas y descargarlo al tablero. El cable también permite comunicarse con la computadora a través de la emulación de un puerto serial. Esto es necesario para que el Arduino pueda comunicarse con la computadora, y viceversa, aunque algunos tableros no tienen esta capacidad. Así, puedes hacer circuitos que lean algún dato del ambiente y lo puedan pasar a la computadora para un proceso más complejo.

Los tableros Arduino también cuentan con una gama amplia de accesorios que se suelen llamar shields (escudos). Los shields ofrecen funcionalidades al tablero que se complementan con una librería de código para hacerlos funcionar. Ejemplos: una pantalla con touch screen, conexión por cable ethernet, wi-fi, u ondas de radio, higrómetros, termómetros, sensores de distancia, etc. Uno mismo puede elaborar circuitos para conectar estos componentes, sólo que el shield ofrece la ventaja de ser un producto compacto, muy fácil de conectar al tablero.

Ejemplo del shield de pantalla touch conectado a un Arduino Uno. El Arduino corre un programa que permite dibujar.

Raspberry Pi

El Raspberry Pi es uno de los proyectos de educación en computación más exitosos de los últimos años. Se describe a sí mismo como la computadora del tamaño de una tarjeta de crédito de 35 USD.

Existen varios modelos del Pi, pero en general posee un procesador ARM como el de los dispositivos smarthphone, una tarjeta gráfica que tiene capacidad de mostrar video de alta resolución a una velocidad razonable, un puerto HDMI, puerto para sonido, puerto de red, wifi, y puertos USB. Posee también conexiones para dispositivos propios del Pi, como una pantalla touch y una cámara, y posee también un puerto con pines para conectar componentes electrónicos, llamado puerto GPIO. Los pines funcionan a un voltaje diferente del Arduino, los pines del Pi corren a 3 voltios, y los del Arduino a 5 voltios, cosa que hay que tener en cuenta a la hora de conectar

El Raspberry Pi no tiene disco duro, emplea un puerto para tarjetas microSD para almacenamiento. El Pi tiene la capacidad de correr el sistema operativo Linux, y la distribución más usual es una variantes de Debian llamada Raspbian. Esta distribución contiene casi todo lo necesario para escribir, compilar y correr código en el Pi, con una variedad de lenguajes de programación: Python, C++ y otros más didácticos.

Un Raspberry Pi en funcionamiento, conectado a una TV.

Leap Motion

Aparto el Leap Motion de la categoría que hemos estado hablando, pero igual debo hacerle mención pues es un componente esencial de «Lilibeth’s Parade». El Leap Motion es un dispositivo que es capaz de capturar y estructurar manos en tiempo real. El programador luego puede crear toda clase de gestos con una o dos manos, ya que lo que obtiene son vectores en el espacio. Por ejemplo, es posible saber la posición de los dedos con respecto a la mano, el vector normal de la palma, si es una mano derecha o una mano izquierda, entre otros datos. Para esto, el Leap Motion tiene dos cámaras infrarrojas de alcance limitado, y sintetizan una estructura 3D de la o las manos.

La gente que produce el Leap Motion ha especificado hasta ahora que el Raspberry Pi no tiene la suficiente potencia para correr su software, por lo que no es una plataforma oficialmente soportada.

Aplicación de ejemplo que muestra lo que ve el Leap Motion y una representación de la mano reconstruida

Cómo funciona Lilibeth’s Parade

Modelo

Lilibeth’s Parade emplea un modelo de cartón, con algunas partes hechas en madera balsa. El modelo se construyó a partir de una caja de cartón, la cual se modificó para hacer la base para la torre y el arco, que representa un puente hacia la torre. Los carros están hechos a partir de madera balsa, con una base que los conecta a los servos. Cuando los servos giran hacia cierto ángulo, la base mueve el carro hasta la posición deseada.

Time lapse de la construcción

La torre del palacio tiene huecos en su parte frontal, donde van montados los neopixels. Los neopixels son unos componentes LED hechos por Adafruit, muy convenientes para trabajar con el Arduino, que pueden mostrar una amplia gama de colores a partir del rojo, verde y azul. Estos se pueden conectar en serie, y cada uno posee cuatro pines, dos que le permiten conectarse a una fuente de electricidad, y los otros dos que reciben los datos para desplegar los colores. Se puede elaborar una cadena de neopixels, y al final se usa un solo pin del tablero para comunicarse con toda la cadena. Adafruit provee sin costo extra una librería que permite comunicarse con una cadena de neopixels a partir de llamadas simples.

La torre del palacio también tiene un hueco circular en el tope donde se monta la pantalla.

Estructura

La salida de Lilibeth’s Parade consiste en una PC conectada a dos tableros Arduino. Uno de los tablero tiene una pantalla conectada, y otro tablero establece la posición de los servos y el estado de las dos cadenas de neopixels. Ambos tableros reciben la información de la PC a la que están conectados. La PC también tiene conectado el Leap Motion. La PC corre un programa escrito en Processing que une todo esto. Consideramos utilizar un Raspberry Pi con una cámara, y un script escrito en Python, el cual mediante OpenCV tuviese la capacidad de reconocer una mano en tiempo real.

Processing es un lenguaje, una librería y un ambiente de código basados en Java, hecho con el fin específico de ofrecer un ambiente grato y didáctico para artistas. El programa se encarga también de leer el estado del Leap Motion, a través de una de las tantas librerías que hay para Processing que permiten usar dispositivos desde Processing.

Pantalla

Un tablero Arduino tiene un shield de pantalla, el cual muestra unas instrucciones a los jugadores. Este tablero contiene algunas imágenes, y el código es una máquina de estados que muestra estas imágenes dependiendo del estado del juego, el cual se comunica desde la PC con un número. Por ejemplo, un primer estado muestra dos manos claras, indicando que los jugadores deben poner su mano enfrente del juego para que la mano sea reconocida. Los siguientes dos estados muestran unas manos opacas, comunicándole al jugador que sus respectivas manos han sido reconocidas.

Algunos de estos estados tienen unas animaciones burdas hechas superponiendo imágenes en la pantalla. El Arduino tiene limitaciones con respecto a la velocidad como puede comunicar los cambios a la pantalla, y la velocidad para dibujar la imagen es de casi un segundo, por lo que no se puede hacer algo extremadamente sofisticado. La solución para esto fue emplear imágenes lo más pequeña posibles, para que se dibujasen rápidamente, y que se pudiese entender el significado de la animación al mismo tiempo.

Servos

Los servos son componentes muy sencillos. Pueden rotar a un ángulo específico ordenado por un tablero, y existe una librería que hace esto de manera simple. Al emplear servos, la dificultad consiste en poder traducir el ángulo al que se desea rotar el servo a la realidad, de manera que el modelo funcione bien. Calibrarlo, pues. Lleva tiempo poder calibrar el modelo de tal manera que la base de los carros no pegue con otras partes del modelo.

Servos al momento de la prueba

OpenCV

La entrada de Lilibeth’s Parade inicialmente consistió en un Raspberry Pi que tuviese instalado OpenCV, con un script de Python que controlase tanto esto como la comunicación con los Arduinos. OpenCV es una librería que ofrece un conjunto de rutinas conocidas para «mejorar» imágenes, ya sea tomadas de un archivo, de un video o de una cámara, facilitando la construcción de estructuras sobre las que se puede razonar en código. En el caso de este juego, nos propusimos hacer reconocimiento del color de la piel para detectar la forma de una mano.

La instalación de OpenCV en el Raspberry Pi requiere compilar código en C++, lo cual constituyó una gran inversión de tiempo para lo limitado del jam. El Raspberry Pi tiene la capacidad de compilar código, pero suele tomar mucho tiempo debido a la limitación de velocidad de procesamiento. El Raspberry Pi puede tomar horas en completar la compilación. Disponemos de un Raspberry Pi 3, el cual tiene 4 núcleos, los cuales se pueden utilizar simultáneamente. Esto lo intentamos, pero el Gigabyte de memoria RAM no fue suficiente, por lo que entró en swap, y además teniendo solo 8 GB en la memoria microSD que utilizamos toda la computadora se detuvo, por lo que tuvimos que reiniciar. Sin embargo, se logró compilar la librería y los bindings a Python.

Utilizamos la guía de Pyimagesearch para hacer la instalación, y fue sumamente efectiva, por lo que la recomiendo para cualquier proyecto que quieras hacer con OpenCV y Raspberry Pi.

Al final, la detección de piel depende mucho de las condiciones de iluminación del lugar, y era un cuanto inconstante con respecto al reconocimiento de la forma de la mano. Habiendo empleado casi 20 horas desde el inicio del evento, y sin haber trabajado hasta ese momento con el código del Arduino, concluimos que esta vía no nos iba a resultar en un juego a la hora de entregar.

Sin embargo, quedó como un ejercicio interesante, y una introducción al uso de OpenCV. El Raspberry Pi junto con la Raspberry Pi Camera posee suficiente desempeño para poder hacer reconocimiento visual en tiempo real. Con la posibilidad de poder obtener la imagen raw de la cámara, sin pasar por compresión JPEG, se tiene una velocidad de al menos 15FPS, lo que hace al reconocimiento factible.

OpenCV + Raspberry Pi + Raspberry Pi Camera

Leap Motion

El Leap Motion fue muy sencillo de configurar, y posee una variedad de software que permite explorar la percepción del dispositivo, y las estructuras de datos que forma a partir del reconocimiento de la mano. Processing facilita la instalación de una librería que sirve de binding al manejador del Leap Motion.

El programador lo que ve son vectores de la mano cuyo origen está en el centro del Leap Motion, por lo que se hace sencillo el razonamiento geométrico de lo que haya que hacer. En el caso específico del juego, detectamos el rango de rotación de la muñeca (máximo y mínimo), y la forma de avanzar en el juego es moviendo la mano de tal manera que la rotación pase por el medio de ese rango. Así que tiene sentido moverla lo menos posible, aunque el gesto de hacerlo es gracioso.

Uno de los particularidades de la librería es que deja al programador con la responsabilidad de identificar la mano que reconoce. Esto quiere decir, la librería ofrece información sobre lo que reconoce en cada frame del sketch de Processing, y sólo es válida para ese frame. Uno puede identificar una mano a través de los frames debido a que tiene un número identificador que es el mismo mientras el Leap Motion reconozca la mano. Cuando la mano sale de la vista del Leap Motion y entra nuevamente, en el frame aparece una mano con un identificador diferente.

No nos dio tiempo de estabilizar el reconocimiento de las manos, por lo que tuvimos que pedirles a los jugadores que no sacaran la mano una vez comenzaran a jugar. De continuar con el proyecto este debería ser una de las primeras tareas a completar.

Coda

«Lilibeth’s Parade» fue un proyecto surgido de la necesidad de hacer algo diferente a un videojuego tradicional, en un ambiente como el de un game jam que está tan orientado al desarrollo de videojuegos. Existen otros eventos llamados hackathones, que tienen una filosofía similar, pero la mayoría de estos eventos suelen ser de naturaleza competitiva. La filosofía de colaboración y experimentación del Global Game Jam es uno de los aspectos más importantes y mejor defendidos desde sus inicios, y bajo ese espíritu esta clase de ideas afloran. Para mi fue una excelente experiencia con computación física, y me anima a seguir explorando las posibilidades de este campo.