Si quieres implementar las ventajas de la realidad aumentada de forma rápida y sencilla, utilizar AR.js y Aframe es una buena alternativa, ya que únicamente deberás de importar las librerías a tu proyecto, tener las imágenes a mostrar o modelos 3D y compartir tu creación.

Si estas en esta entrada, te apuesto a que será en parte por mi pequeño proyecto desarrollado en donde visualizamos un pequeño juego de hacer clic sobre círculos y una tarjeta de realidad aumentada (Véase la imagen al final de este parráfo) que mostré en el Platzi Conf. Este proyecto consta de menos de 150 líneas de código, donde la mayoría solo son estilos y una pequeña funcionalidad de JavaScript para el juego de los círculos, en sí, para la función de AR prácticamente se usan menos de 10 líneas de código (si, enserio).

La magia de esto es que a través de utilizar el Marked Based de AR.js podemos utilizar el mismo QR que te lleva a la página web donde esta albergado el código fuente, que utiliza la cámara en tu dispositivo y hace uso del QR para mostrar el juego de círculos, todo esto basado en patrones, para también mostrar la tarjeta de presentación, los cuales puedes crear en esta herramienta oficial de los creadores.

Una vez subida tu imagen a la herramienta, tendrás que descargar tanto el archivo .patt que será el patrón y te recomiendo bajar nuevamente la imagen, con estos 2 armaremos un contenedor <a-marker> el cual una vez encontrada la imagen basada en el patrón mostrara en AR algunos elementos que son los que se definen en el bloque de código dentro de <a-entity> que puede ser texto, más imágenes o elementos en 3D. Lo maravilloso de esto y que en muchos tutoriales que he encontrado, no dicen explícitamente que podemos usar CSS para dar estilos (como en el caso de los banners que uso para dar instrucciones) así como la funcionalidad de detectar los clics de círculos y aumentar el puntaje.

Sin duda crear esta aplicación fue un reto increíble, pensaba que sería más difícil crear una aplicación de AR pero también hay que decir que puede que este limitado, por ejemplo, a meter más funcionalidad con el uso de los sensores de nuestro dispositivo o reaccionar de forma más sutil (¡Porque incluso puedes realizar una detección de manos!).

Entradas relacionadas

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Esta web utiliza cookies propias y de terceros para su correcto funcionamiento y para fines analíticos. Contiene enlaces a sitios web de terceros con políticas de privacidad ajenas que podrás aceptar o no cuando accedas a ellos. Al hacer clic en el botón Aceptar, acepta el uso de estas tecnologías y el procesamiento de tus datos para estos propósitos.
Privacidad