martes, 28 de febrero de 2017

[Unity] Tercer ejemplo



Estas dos últimas semanas he estado desarrollando mi tercera aplicación de ejemplo usando Cardboard. Los objetivos de este ejemplo eran:
  • Implementar una interfaz gráfica con diálogos entre personajes.
  • Realizar transiciones entre escenarios. 

Ejemplo de caja de dialogo. Se ve el nombre del personaje que habla (en azul) y el texto de lo que está diciendo.

Este ejemplo está inspirado en una escena del juego de Game Cube Eternal Darkness, en donde el protagonista, Pious, se encuentra en medio de un templo en ruinas. En una cámara del templo hay tres reliquias, cada una representando a una entidad sobrenatural diferente. Pious debe elegir una de ellas. Esta elección define la historia del resto del juego.

Mi ejemplo consiste en un santuario en medio de un bosque. En el santuario hay tres artefactos. Al interactuar con ellos el personaje tiene una visión (o un recuerdo) sobre una conversación con el dios representado por cada uno. Después de que se acaba la conversación el personaje vuelve en sí y puede elegir otra reliquia.   


Una de las reliquias. El jugador puede interactuar con ellas al centrar su mirada y oprimir el botón del Cardboard.



Un aspecto muy importante al hacer interfaces gráficas para realidad virtual es que no se pueden colocar elementos "pegados a la pantalla" como normalmente se hace. En su lugar, la interfaz de ser parte del mundo y tener coordinadas tridimensionales como cualquier objeto del escenario.

Si uno no quiere perder de vista los elementos de la interfaz al girar la cabeza, uno puede meterlos dentro de la jerarquía de la cámara principal. Al hacer esto hay que tener especial cuidado en que no resulte molesto para los jugadores: generalmente no hay problema con elementos pequeños, pero cuando los objetos son muy grandes puede causar mareo.

Otro aspecto que hay que tener en cuenta es que los elementos de la escena que están más cerca de la cámara pueden obstruir la vista de la interfaz. 

Canvas de la interfaz con coordenadas en el mundo y cómo hijo de la cámara.


Cómo lo que quería hacer era diálogos, decidí que el jugador no pudiera cambiar la orientación  de la cámara mientras no se acabara la conversación. Para evitar cambios abruptos e incómodos seguí los siguientes pasos siempre que iniciaba una conversación:


  1. El jugador hace clic en el objeto.
  2. Se realiza un fade out de la pantalla hasta que solo se ve negro.
  3. Se coloca la cámara en la posición y rotación deseada.
  4. Se detiene la captura de movimiento y rotación.
  5. Se pone una imagen de fondo para la conversación.
  6. Se realiza un fade in de la pantalla hasta que se puede ver de nuevo. 


Por último, vale la pena mencionar la herramienta que utilicé para el manejo de la narrativa: Fungus. 
Se puede descargar gratis desde el Asset Store de Unity y facilita enormemente el manejo de toda la parte narrativa del juego. Definitivamente la recomiendo.

Aquí dejo uno de los tres diálogos del ejemplo:








domingo, 19 de febrero de 2017

[Unity] Segundo ejemplo

Durante esta semana desarrollé mi segundo ejemplo usando Cardboard. Tenía los siguientes objetivos en mente:
  • Incluir un personaje animado para ver cómo se siente.
  • Incluir la mira que viene en el paquete de Google VR.
  • Interactuar con un objeto del mundo utilizando la mira y el botón del Cardboard. 
El ejemplo consiste en un bosque nocturno (de nuevo... ) donde, adicional a los árboles, también hay personajes animados. Uno puede ver alrededor al igual que en el primer ejemplo. El personaje más cercano es un objeto con el que se puede interactuar. Al tener la mira sobre él y oprimir el botón se prende una luz. Los personajes que están en el fondo también comienzan a iluminarse aleatoriamente.  Al oprimir de nuevo el botón mientras se está apuntado al personaje principal, todas las luces se apagan.


Pedazo del bosque.




El escenario lo hice igual que en el primer ejemplo: ubicando sprites alrededor de la cámara principal y rotándolos para que queden viendo hacía la cámara (esto lo hice con un script). 

Para incluir la mira y hacer objetos con los que se pueden interactuar se deben seguir los siguientes pasos:


  1.  Agregar el prefab GvrReticlePointer como hijo de la cámara principal.
  2.  Agregar un EventSystem a la escena.
  3.  Agregar los scripts GvrPointerInputModule y VRPointerManager al Event system.
  4.  Agregar GvrPointerPhysicsRaycaster a la cámara principal.
  5.  Agregar un EventTrigger al objeto con el que se quiere interactuar (el objeto debe tener un  Collider). El Event trigger debe disparar uno de los eventos dados por GvrPointerInputModule.


Luego de seguir estos pasos implementé la funcionalidad que buscaba. Al tener todo listo, conecté el celular al computador, le di clic a Build and Run y la aplicación quedó instalada. Puse el celular en el Cardboard y disfruté del escenario y la música ;)

 

(Credits in the Youtube's description)

sábado, 11 de febrero de 2017

[Unity] Primer ejemplo

Con el ambiente finalmente configurado, comencé a hacer mi primer proyecto con Cardboard. El objetivo de este ejemplo era probar la captura del movimiento y la rotación de la cabeza.

El ejemplo consiste en un bosque nocturno donde uno puede mirar alrededor. Bastante simple.




Pedazo del bosque.


El procedimiento inicial fue, en pocas palabras, el siguiente: construí un skybox para la escena, ubiqué la cámara principal, coloqué sprites de árboles alrededor de la cámara, configuré la iluminación y seleccioné la música de fondo.

Luego importé el paquete de Google VR para Unity. En este paquete se encuentran un montón de assets útiles y necesarios para utilizar Cardboard. También hay algunos ejemplos que revisaré luego.

Dentro del directorio "Prefabs" del paquete hay un prefab llamado "GvrViewerMain". Simplemente agregué el prefab a mi escena e hice clic en Play. En Unity se puede simular el movimiento de la cabeza haciendo clic en las teclas ALT y/o CTRL y moviendo el mouse.







 

Después de unos pequeños ajustes de la configuración de builds, el proyecto quedó listo para ser probado en un Cardboard. En el laboratorio conecté al computador un Samsung Galaxy s6 previamente configurado para funcionar con Cardboard y seleccioné la opción Build and Run en Unity. Tomó unos minutos, pero finalmente la aplicación quedó instalada en el celular. Abrí la aplicación, coloqué el equipo en el Cardboard y crucé los dedos para que todo saliera bien.

Afortunadamente, todo salió bien y la aplicación corrió sin inconvenientes :D






[Unity] Configuración del Ambiente

Después de ver varios ejemplos y leer parte de la documentación encontré que Unity 3D es una herramienta poderosa para crear aplicaciones de Cardboard. Para empezar a trabajar en Unity es necesario preparar el ambiente de desarrollo.

Instalar Unity

Unity cuenta con una versión personal gratis que se puede descargar desde su página web. Yo ya tenía instalado Unity, por lo que simplemente actualicé mi versión a la más reciente (Unity 5.5.1).

Obtener Google VR SDK para Unity

El SDK de Cardboard para Unity se encuentra en el siguiente link. Uno descarga el paquete y lo guarda en algún directorio del computador para posteriormente agregarlo a los proyectos de Unity que desee.

Configurar Ambiente de desarrollo Android

Para construir aplicaciones de Unity para Android se necesitan seguir ciertos pasos. Con iOS la metodología es similar, sin embargo, no tengo planeado trabajar con iOS por el momento. Primero se debe descargar e instalar el SDK de Android, que se puede obtener en este enlace. Luego se deben instalar los controladores necesarios para que el computador reconozca dispositivos Android conectados por USB. Una vez instalados los drivers, se debe activar el modo de desarrollador en el dispositivo y permitir la depuración por USB. Finalmente se debe conectar el SDK de Android con Unity, lo cual se puede hacer cuando uno intenta hacer un build a Android por primera vez desde Unity.




Referencias

Enlaces con información útil e interesante para el desarrollo en Cardboard

 

Documentación y SDKs:

 

Tutoriales:

 

Herramientas:

domingo, 5 de febrero de 2017

Android VR SDK - 1: Configuración del ambiente


Mi primer paso para trabajar con Cardboard fue configurar un ambiente para desarrollar aplicaciones de realidad virtual para dispositivos Android.  

Seguí una guía escrita por Google para instalar los programas necesarios en mi computador para poder instalar una aplicación de prueba en mi celular Android. Mi objetivo era lograr que el APK se instalara correctamente, más adelante, cuando tenga acceso al Cardboard del laboratorio, quisiera probar la funcionalidad de la aplicación.

Primero instalé el IDE Android Studio y descargué la API 25 de Android.



Instalando el API 25 de Android desde Android Studio.



Luego descargué el GVR SDK desde su repositorio en GitHub. Dentro de este SDK se encuentran varios proyectos de ejemplo, de los cuales seleccioné uno e indiqué que se corriera en mi dispositivo conectado al computador.
Afortunadamente, parece que todo salió bien y la aplicación se ejecutó en mi celular sin mostrar mensajes de error.  


Aplicación de ejemplo corriendo en mi celular ZTE Blade A310.



Ahora bien, la aplicación se instaló en mi celular sin mayor problema, sin embargo, esto es apenas el primer paso. Tengo la intención de volver a repetir este proceso en el laboratorio para verificar si la aplicación funciona bien en mi celular y para realizar las configuraciones necesarias en mi teléfono que requiere Cardboard.