Niixer

Cómo creamos una experiencia de realidad aumentada para Alerta Sísmica con Pictarize Studio

Introducción

La realidad aumentada permite complementar elementos del mundo real con contenidos digitales que aparecen a través de la cámara de un dispositivo.

Para el proyecto Alerta Sísmica: Cada Decisión Cuenta desarrollamos una experiencia de realidad aumentada utilizando Pictarize Studio, con el objetivo de transformar el póster promocional del proyecto en una pieza interactiva.

La propuesta consistió en utilizar el póster como imagen de reconocimiento y hacer que, al ser detectado por la cámara, apareciera una pequeña escena relacionada con un terremoto.

Dentro de esta escena se utilizaron diferentes recursos tridimensionales y animaciones para representar el movimiento sísmico y mostrar a un personaje perdiendo el equilibrio y cayendo.

La intención fue crear una pieza promocional que llamara la atención sobre algunos de los riesgos que pueden presentarse durante un terremoto.

¿Qué es Pictarize Studio?

Pictarize Studio es una plataforma que permite desarrollar experiencias de realidad aumentada utilizando imágenes como objetivos de reconocimiento.

Estas imágenes funcionan como Targets.

Cuando la cámara reconoce el Target, Pictarize puede posicionar diferentes contenidos digitales sobre la imagen.

Entre estos elementos pueden encontrarse:

  • modelos 3D;
  • imágenes;
  • videos;
  • audios;
  • animaciones;
  • textos;
  • elementos interactivos.

Para nuestro proyecto, el Target utilizado fue el póster promocional de Alerta Sísmica.

Herramientas y recursos utilizados

Para construir la experiencia se utilizaron diferentes plataformas.

Pictarize Studio

Fue la herramienta principal utilizada para desarrollar y organizar la experiencia de realidad aumentada.

Dentro de Pictarize se configuró el póster como Target y posteriormente se incorporaron los diferentes recursos tridimensionales y animaciones.

Proyecto de trabajo:

https://studio.pictarize.com/project/6ab204a2fc9b790012044199

Sketchfab

Para complementar la escena se utilizó un recurso tridimensional obtenido desde Sketchfab.

El recurso utilizado fue Earthquake:

https://sketchfab.com/3d-models/earthquake-4bb99313cd744a59802bd9f5d058fe29

Este modelo fue utilizado como parte de la representación visual del terremoto dentro de la experiencia.

Adobe Mixamo

Para obtener la animación del personaje utilizamos Mixamo, plataforma de Adobe que cuenta con una biblioteca de movimientos para personajes tridimensionales.

Biblioteca utilizada:

https://www.mixamo.com/#/?type=Motion%2CMotionPack

Dentro de Mixamo se buscó una animación que representara una caída, con el objetivo de mostrar al personaje perdiendo el equilibrio durante el terremoto.

Paso 1. Preparar el póster de Alerta Sísmica

El primer elemento necesario fue el póster promocional de Alerta Sísmica: Cada Decisión Cuenta.

Este póster había sido desarrollado previamente como parte de la identidad visual del proyecto.

Para la experiencia de realidad aumentada, la imagen tendría una función adicional: actuar como el elemento que debía reconocer la cámara.

La lógica de la experiencia sería:

Póster → reconocimiento mediante cámara → aparición del contenido de realidad aumentada.

Por esta razón, el póster se utilizó posteriormente como Target dentro de Pictarize Studio.

Paso 2. Buscar y descargar los recursos

Antes de comenzar a organizar la escena dentro de Pictarize fue necesario reunir los recursos que aparecerían en la experiencia.

Para representar visualmente el terremoto se utilizó un modelo disponible en Sketchfab.

El recurso utilizado fue:

Earthquake

https://sketchfab.com/3d-models/earthquake-4bb99313cd744a59802bd9f5d058fe29

Una vez obtenido el recurso, este pudo prepararse para ser incorporado posteriormente dentro de la escena.

También necesitábamos que un personaje reaccionara al movimiento sísmico.

Para resolver esta parte utilizamos Adobe Mixamo.

https://www.mixamo.com/#/?type=Motion%2CMotionPack

Mixamo permite aplicar animaciones prediseñadas a personajes tridimensionales.

Dentro de la biblioteca buscamos un movimiento de caída que permitiera representar al personaje perdiendo la estabilidad durante el terremoto.

El proceso de esta etapa fue:

Buscar recurso → descargar → preparar archivo → importar a Pictarize.

Paso 3. Crear el proyecto en Pictarize Studio

Con los recursos preparados, ingresamos a Pictarize Studio y comenzamos a construir la experiencia.

El proyecto utilizado fue:

https://studio.pictarize.com/project/6ab204a2fc9b790012044199

Dentro de Pictarize se encuentra el panel destinado a los Targets.

En este espacio cargamos el póster de Alerta Sísmica.

A partir de ese momento, la plataforma comenzó a utilizar esta imagen como referencia para determinar dónde debían aparecer los elementos digitales.

Paso 4. Configurar el Target

Una vez cargado el póster, fue necesario configurarlo correctamente como imagen de reconocimiento.

El Target funciona como una referencia visual.

Cuando el usuario apunta la cámara hacia el póster, Pictarize analiza la imagen y, al reconocerla, activa los elementos de realidad aumentada asociados con ella.

Por esta razón, era importante comprobar que el póster pudiera reconocerse correctamente desde diferentes posiciones y distancias.

El funcionamiento básico era:

Cámara → reconocimiento del póster → activación de la experiencia.

Paso 5. Importar los recursos descargados

Después de configurar el Target se incorporaron los diferentes elementos que formarían la escena.

El recurso tridimensional relacionado con el terremoto fue importado dentro del proyecto.

También se incorporó el personaje con la animación obtenida previamente mediante Mixamo.

Una vez dentro de Pictarize, fue necesario ajustar diferentes propiedades:

  • posición;
  • escala;
  • rotación;
  • profundidad;
  • orientación.

Estos ajustes permitieron organizar los elementos alrededor del póster y construir la composición final.

⸻

Paso 6. Construir la escena

La experiencia fue diseñada principalmente como una pieza promocional.

No se buscaba construir una experiencia compleja, sino representar visualmente una situación relacionada con los riesgos de un terremoto.

Al reconocer el póster comienza la escena.

El movimiento sísmico altera la situación y el personaje pierde el equilibrio hasta caer.

La secuencia puede resumirse de la siguiente manera:

situación inicial → comienza el terremoto → movimiento → pérdida de equilibrio → caída del personaje.

La caída ayuda a representar de manera sencilla algunos de los riesgos que pueden producirse cuando una persona no se encuentra preparada para reaccionar durante una emergencia.

⸻

Paso 7. Ajustar posición, tamaño y perspectiva

Una vez colocados los elementos principales comenzó un proceso de ajuste.

Los objetos tridimensionales debían mantenerse relacionados visualmente con el póster.

Por esta razón, fue necesario modificar diferentes valores hasta encontrar una composición adecuada.

Se revisaron principalmente:

  • tamaño de los elementos;
  • posición con respecto al Target;
  • orientación;
  • profundidad;
  • relación entre personaje y escenario.

Estos cambios se realizaron observando tanto el editor como el resultado desde un dispositivo móvil.

⸻

Paso 8. Configurar la animación del personaje

Una parte importante de la experiencia fue la reacción del personaje.

La animación obtenida mediante Mixamo permitió representar la caída sin necesidad de crear manualmente cada movimiento desde cero.

La animación fue incorporada dentro de la escena y posteriormente sincronizada con el resto de los elementos.

El objetivo era que el personaje no permaneciera estático, sino que reaccionara visualmente al terremoto.

De esta manera, la experiencia comenzó a tener una pequeña estructura narrativa.

⸻

Paso 9. Realizar pruebas desde el dispositivo móvil

Después de organizar la escena fue necesario comprobar cómo funcionaba fuera del editor.

Se realizaron pruebas desde un dispositivo móvil para analizar el comportamiento del reconocimiento y de los elementos de realidad aumentada.

Durante esta etapa se revisaron aspectos como:

  • reconocimiento del póster;
  • estabilidad de los modelos;
  • tamaño de los elementos;
  • comportamiento desde diferentes ángulos;
  • distancia de la cámara;
  • reproducción de la animación;
  • caída del personaje;
  • iluminación.

Este proceso permitió encontrar errores que no necesariamente eran evidentes desde el editor.

⸻

Paso 10. Ajustar la experiencia

Después de realizar las primeras pruebas se realizaron diferentes modificaciones.

En realidad aumentada es importante comprobar constantemente la experiencia desde el dispositivo final, ya que pequeños cambios de escala o posición pueden modificar considerablemente la percepción de los elementos.

El flujo de trabajo fue:

Modificar → probar → observar → corregir → volver a probar.

Este proceso continuó hasta obtener una versión suficientemente estable de la experiencia.

⸻

Paso 11. Publicar el proyecto

Una vez finalizadas las pruebas, Pictarize permite generar y publicar la experiencia.

Al publicarse, el proyecto puede disponer de una dirección web que permite abrir la experiencia desde un dispositivo compatible.

Cuando el usuario accede a ella, el navegador solicita permiso para utilizar la cámara.

Después de autorizarla, puede apuntar hacia el póster utilizado como Target y visualizar los contenidos de realidad aumentada.

⸻

Resultado

El resultado fue una experiencia promocional de realidad aumentada para Alerta Sísmica: Cada Decisión Cuenta.

El proceso completo fue:

Preparación del póster → búsqueda de recursos → descarga desde Sketchfab → selección de animación en Mixamo → creación del proyecto en Pictarize → configuración del Target → importación de recursos → organización de la escena → pruebas → ajustes → publicación.

Cada plataforma cumplió una función específica dentro del proceso:

Sketchfab → recurso tridimensional.

Mixamo → animación del personaje.

Pictarize Studio → construcción y publicación de la experiencia de realidad aumentada.

El resultado final transforma un póster estático en una pieza promocional interactiva que utiliza la cámara del dispositivo para añadir información y movimiento sobre la imagen original.

⸻

Acceder a la experiencia de realidad aumentada

La experiencia final puede abrirse desde la dirección pública generada al publicar el proyecto en Pictarize.

Al ingresar desde un teléfono compatible, el navegador solicitará permiso para utilizar la cámara.

Posteriormente, el usuario debe apuntar hacia el póster de Alerta Sísmica para activar la experiencia.

El enlace público definitivo puede incorporarse directamente en esta sección del artículo para facilitar el acceso al lector.

⸻

¿Qué aprendimos durante el proceso?

Uno de los principales aprendizajes fue comprobar que una experiencia de realidad aumentada puede construirse utilizando diferentes herramientas especializadas.

No fue necesario desarrollar todos los recursos desde cero.

En cambio, cada plataforma se utilizó para resolver una necesidad específica.

Sketchfab permitió encontrar un recurso tridimensional relacionado con el terremoto.

Mixamo permitió encontrar una animación adecuada para el personaje.

Pictarize permitió reunir estos elementos, relacionarlos con una imagen física y transformarlos en una experiencia de realidad aumentada.

El flujo terminó siendo:

Recursos → animación → integración → realidad aumentada.

También fue importante comprobar que gran parte del trabajo ocurre durante las pruebas.

Una escena puede funcionar correctamente dentro del editor y comportarse de manera diferente cuando se observa desde una cámara real.

Por esta razón, probar continuamente desde el dispositivo final fue una parte fundamental del proceso.

⸻

Conclusión

La creación de esta experiencia permitió experimentar con la realidad aumentada como una herramienta de comunicación para Alerta Sísmica: Cada Decisión Cuenta.

Pictarize Studio permitió transformar el póster en una imagen reconocible por la cámara y posteriormente posicionar diferentes contenidos digitales sobre ella.

Sketchfab facilitó la obtención de uno de los recursos tridimensionales utilizados en la escena, mientras que Mixamo permitió incorporar movimiento al personaje mediante una animación previamente desarrollada.

El resultado demuestra cómo una pieza gráfica tradicional puede convertirse en una experiencia interactiva al combinar diseño, recursos tridimensionales, animación y realidad aumentada.

⸻

Créditos

Autores: Andrés Pérez Ponce y Lina Palacios

Editor: Mg. Ing. Carlos Iván Pinzón Romero

Universidad: Universidad Central

Proyecto: Alerta Sísmica: Cada Decisión Cuenta

⸻

Fuentes y recursos utilizados

Pictarize Studio. Plataforma utilizada para desarrollar la experiencia de realidad aumentada.

Proyecto de desarrollo:
https://studio.pictarize.com/project/6ab204a2fc9b790012044199

Sketchfab. Earthquake. Recurso tridimensional utilizado durante la construcción de la experiencia.

https://sketchfab.com/3d-models/earthquake-4bb99313cd744a59802bd9f5d058fe29

Adobe Mixamo. Biblioteca de animaciones utilizada durante el desarrollo del movimiento del personaje.

https://www.mixamo.com/#/?type=Motion%2CMotionPack

Pictarize. Documentación de Pictarize Studio y funcionamiento de experiencias WebAR.

Alerta Sísmica: Cada Decisión Cuenta. Proyecto y materiales de elaboración propia.