Tecnologías multimedia e interacción/Curso 2015-2016/Caso 6

CASO 6: Musictrón

En este caso se propone el diseño y creación de un videojuego, donde su principal dinámica estará basada en el audio. La aplicación desarrollada consiste en un juego de plataformas sobre Unity, que permite al usuario mezclar conocimientos de programación, a la vez que se integra con habilidades rítmicas sobre la canción que se escucha de fondo. Para desplazar al personaje principal por el tablero, el jugador deberá "programarle", indicando que movimientos debe realizar antes de poder darle al play. Una vez iniciado, el robot se irá moviendo por el tablero al ritmo de la música, por lo que el jugador deberá mezclar las capacidades de movimiento, con las de sincronización del ritmo. Para hacer más divertido el juego, algunas casillas también se mueven al ritmo de la música, por lo que la dificultad aumenta.

Control del personaje

El control del personaje se realiza mediante el panel derecho del juego. En él, el usuario puede elegir mediante un sistema de Drag & Drop las acciones que el robot va a realizar cuando se pulse el botón de inicio. Además, estas acciones se pueden separar en varias pestañas como se puede ver en la imagen, permitiendo realizar llamadas desde una pestaña a otra. La idea principal detrás de este sistema de movimientos, es la de inculcar la idea de programar de manera divertida y casi inapreciable, ya que se condicionan los movimientos a una serie de movimientos (o llamadas a función), y a llamadas a otros paneles (funciones más complejas). Las distintas acciones que puede realizar el muñeco son:

Avanzar: permite acceder a la siguiente casilla en línea recta, siempre que se encuentre al mismo nivel.
Girar: permite girar el muñeco hacia la derecha o hacia la izquierda en un ángulo de 90 grados. Esta acción no desplaza al muñeco de la casilla.
Saltar: avanza al muñeco una casilla en línea recta, siempre que haya una casilla, y esta esté una posición por encima o por debajo de la casilla actual.
Llamadas a procedimiento (P1, P2): permite ejecutar las acciones puestas en las pestañas P1 y P2 (simula la llamada a función).
Bombilla: enciende o apaga la celda actual, si esta lo permite.
Pause: el robot no realiza ninguna acción en el golpe de ritmo actual. Sirve para sincronizar el movimiento con los golpes de ritmo.

Sistema Drag & Drop

El control del personaje se realiza mediante un sistema de Drag & Drop (D&D en adelante). Se ha decidido realizarlo de este modo para incorporar una técnica multimedia que facilita la interacción con las aplicaciones. Desde la aparición de los Smartphone utilizar esta técnica se ha vuelto de uso obligatorio pero no deja de ser un avance en los métodos para interaccionar.

Para cualquier sistema D&D donde controles la posición final del objeto es necesario tener dos tipos de objetos:

Objeto Dragable, se puede arrastrar.
Objeto (zona) Dropable, se puede dejar un objeto.

Las zonas donde dejas el objeto son las responsables de obtener la información del objeto movido y actualizar la información de la aplicación.

En este caso el D&D implementado tiene dos casos para sus objetos dragables: duplicar los elementos originales, arrastrando una copia de ellos; y mover un objeto de la lista de acciones, arrastrando el propio objeto. Además para realizar una visualización que ayude al usuario a ver como va a quedar al soltar se lleva un objeto fantasma que ocupa la posición final del objeto que esta en movimiento en caso de que se soltase en ese instante, tal y como puede apreciarse en la imagen adjunta.

Mapa

Cada escenario de cada uno de los niveles está especificado en un fichero xml independiente. Esto, permite incorporar nuevos niveles de manera sencilla durante el desarrollo. El escenario, a su vez está compuesto por:

El tamaño de las celdas que va a definir el nivel.
La posición de las casillas, y sus propiedades especiales como el movimiento, si es casilla final, etc.
La posición original del robot.

Un ejemplo de este fichero puede verse en el siguiente cuadro:

<xml>
  <dimensions>
    <board length_x="10" length_z="10" scale="2"/>
    <block size="1" separation="0.1" />
    <cover size="0.1" />
    <robot height="2" />
  </dimensions>
  <board default_height="0" >
    <tile x="2" z="0" height="1" mvto="h" nsteps="2" />
    <tile x="2" z="1" height="1"/>
    <tile x="2" z="2" height="2" />
    <tile x="1" z="2" height="1" mvto="f" nsteps="1" />
    <tile x="0" z="2" height="2" />
    <tile x="0" z="1" height="1" />
    <tile x="0" z="0" height="2" attr="goal" mvto="v" nsteps="3"/>	
  </board>
  <robot>
    <position x="2" y="1" z="0" />
    <rotation x="0" y="-90" z="0" />
  </robot>
</xml>

Gestión y análisis de la música

Para realizar el juego dependiente de una canción de música se tiene en cuenta todo lo explicado en la sección de Música y el Sonido. En ella vemos que todo es una onda con una frecuencia, una amplitud o energía y una velocidad de propagación.

Nuestro análisis busca los puntos de la música donde hay un golpe de ritmo llamado beat. Esto se hace analizando la onda y bus donde se supera la media de energía de la última ventana. Es decir, hemos caracterizado un pulso como una subida de energía suficiente para destacar.

Además realizamos un análisis paralelo en cada banda de frecuencias, de modo que obtenemos diferentes características del sonido actual para modificar el juego.

La forma en que se modifica el juego es sencilla de explicar, se han creado unas casillas que se mueven en sincronía con la canción, este efecto se logra midiendo la distancia entre dos golpes de ritmo de la canción, ese tiempo establece la duración del movimiento de la casilla.

Por otro lado, utilizamos el análisis en bandas de frecuencia (que podría utilizarse para realizar un guitar-hero donde cada banda fuese una nota), para cambiar el fondo de manera gradual. El color cambia suavemente dado que la música suele ser continúa en cada banda, menos cuando se produce un golpe de ritmo, en ese momento cambia el color (por ejemplo, de verde a rojo).

Animación del muñeco: Blender

Para el personaje del juego hemos decido crear nuestro propio muñeco con Blender. Blender es un programa informático multi plataforma, dedicado especialmente al modelado, iluminación, renderizado, animación y creación de gráficos tridimensionales.

https://es.wikipedia.org/wiki/Blender

En el proceso se puede descomponer en tres pasos:

Modelado: Es el arte de crear una superficie(malla) que, imita la forma de un objeto del mundo real. Nuestro modelo se compone de un personaje humanoide, con un gorro y baston.

Rigging: Es el proceso en el que se crea el Rig del personase. El Rig es un esqueleto digital asociado a la malla. Al igual que un esqueleto real, este esta compuesto por huesos y articulaciones, que son utilizados en el proceso de animación a fin de colocar el personaje en la pose deseada. Nuestro Rig sigue la anatomía humana, teniendo dos huesos adicionales, uno para el bastón y otro para el gorro. Estos dos huesos están vinculados a la muñeca y cabeza del personaje, respectivamente.

Animación: Una animación se compone de una serie de fotogramas en los que la posición y rotación de los huesos cambia a fin de crear la ilusión de movimiento. Para facilitar este proceso, en Blender tan solo tenemos que especificar los fotogramas clave del movimiento. Para rellenar los fotogramas intermedios la herramienta utiliza interpolación. Nuestro personaje tiene definidas tres animaciones que son, reposo, andar, saltar.

Conclusiones

El proyecto desarrollado ha permitido trabajar con distintas herramientas interactivas, como se propuso al inicio del proyecto. De estas herramientas, destacar:

Plataforma Unity 3D para el desarrollo de un juego.
Estudio y diseño de animaciones utilizando el software Blender, e integración con Unity.
Manipulación de audio.
Sistemas interactivos dentro del propio juego, como puede ser el Drag & Drop implementado.

A pesar de tener metas muy ambiciosas, se considera que el juego se ha desarrollado hasta un nivel de jugabilidad aceptable, aunque todavía queda trabajo futuro que realizar. El código del juego y los proyectos desarrollados (tanto el de Unity, como el de Blender), se pueden encontrar en el repositorio del juego indicado en las referencias.

Por último, como trabajo futuro, destacar los siguientes aspectos:

La detección de pulsos en las canciones es aceptable, aunque en cierta música no es del todo realista (sobretodo en canciones lentas). En este caso, se debería revisar el algoritmo de detección de pulso y añadir alguna condición de tamaño máximo a la distancia entre dos pulsos.
Algunos movimientos de las casillas no vuelven a su posición original (sufren ligeros desplazamientos).

Referencias

El código del juego, junto con los archivos del proyecto de Unity, se puede encontrar en la siguiente dirección de github:

https://github.com/MasterInformatica/tmi

Además, la idea original del juego está basada en: https://lightbot.com/

Alumnos implicados

Los alumnos que han desarrollado el proyecto han sido (en orden alfabético):

Luis María Costero Valero
Jesús Javier Doménech Arellano
Hristo Ivanov Ivanov