Hola aumentados! Bienvenidos a este nuevo super minitutorial de cómo hacer una aplicación de realidad aumentada en minutos, y la podremos usar y visualizar en nuestros móviles Android e iOS – Aplicación de realidad aumentada en móviles Android – Aplicación de realidad aumentada en móviles iOS.
Puntos a saber antes de visualizar los ejemplos:
- Móviles Android.
- (Algunos dispositivos NO permiten la visualización en Realidad Aumentada). Se necesita compatibilidad con servicios de Google Play para RA – ARCORE.
- Móviles iOS.
- (Normalmente permite la visualización en iPhone y iPad, sin embargo, necesitas tener tu móvil actualizado par que sea compatible con los modelos 3D USDZ – Quieres saber más sobre que son modelos USDZ, aquí te dejo el link. AQUI)
- Laptop and desktop.
- (Permite la visualización del modelo 3D más NO permite realizar la experiencia en realidad aumentada)
- Funciona para Google Chrome, Mozilla Firefox, Safari y otros navegadores comunes.
Vamos con los ejemplos y luego las explicación de cómo hacer este tipo de aplicaciones de Realidad aumentada – Augmented reality tutorial de forma fácil.
Si quieres ver los ejemplos en realidad aumentada da clic en el botón ACTIVAR AR
Ejemplo 1: (Modelo 3D en Realidad Aumentada)
Ejemplo 2: (Modelo 3D en Realidad Aumentada)
Estos dos ejemplos están realizados con Google model-viewer, el cual nos permite mostrar de manera fácil y rápida modelos 3D en la web y en Realidad aumentada.
- Google model-viewer funciona con ARCORE (Google) y además con los productos de Apple para realidad aumentada – ARKit – Reality composer y RealityKit.
Este visualizador es super poderoso y todavía se encuentra en etapa de desarrollo, pero aun así nos ayuda a tener excelentes resultados y lo mejor de todo es que no necesita un marcador para ver nuestro modelo 3D en realidad aumentada.
Mira su página de desarrollo en GitHub: https://github.com/google/model-viewer
sorprendente verdad! Mira una fotografía capturada desde un iPhone utilizando la opción de realidad aumentada.
Ahora bien, cómo hacemos este tipo de aplicaciones?
Resulta muy fácil utilizando html5 y JavaScript, lo primero que debemos de hacer es agregar los scripts que necesitamos en nuestro documento HTML:
- <script type=»module» src=»https://unpkg.com/@google/model-viewer/dist/model-viewer.js»></script>
- <script nomodule src=»https://unpkg.com/@google/model-viewer/dist/model-viewer-legacy.js»></script>
- <model-viewer src=»ubicacion de tu modelo 3D» auto-rotate camera-controls></model-viewer>
y básicamente eso es todo! super fácil, ¿verdad?
Tienes preguntas? deja tu comentario y con gusto las responderé.
Hola, me interesa hacer unas imagenes que se vean en realidad aumentada en el movil android, tienes algun tutorial de cero para poder hacerlo? Gracias
Hola amigo, muchas gracias por escribirme. Claro utilizando Ar.js puedes hacer aplicaciones de Realidad Aumentada para Android.
hola, tendrás algún tutorial desde cero para realizarlo en Android con visual
Hola Katherine, muchas gracias por tu comentario. Te refieres a generar un app de android desde visual studio code? si es asi, no soy muy amigo de las aplicaciones instalables en los telefonos prefiero la emulacion de apps enfocadas a la nube.
¡Hola! Mi nombre Leonaldo en youtube vi algunos tutoriales sobre realidad aumentada con la herramienta AR.JS Me gustaría aprender correctamente y en detalle cómo hacerlo usando Visual Studio. ¿Tendría un curso sobre este tema?
Hola Leonaldo. Claro que si, me puedes enviar un inbox por la fanpage de facebook y con gusto te colaboro.