Realidad aumentada con HTML5 y JSARToolKit

Las posibilidades que introduce HTML5 para multimedia son realmente importantes para renovar las posibilidades que existían hasta ahora en la Web.

Hasta hace poco tiempo, las aplicaciones de realidad aumentada para la Web sólo eran posible incluyendo algún desarrollo basado en Flash o mediante algún otro plugin o agregado (por ejemplo Silverlight).

Una de las características que dificultaba la creación de aplicaciones de realidad aumentada con herramientas Web estándar era el acceso a cámara. Esto está cambiando con las posibilidades que introduce HTML5 para emplear funcionalidades de audio y video nativas y, además, el acceso a hardware, en este caso la cámara del usuario.

Si bien aún estamos en un plano experimental, la expansión y adopción de estas nuevas tecnologías abren una puerta más que interesante para crear realidad aumentada que funcione en nuestro navegador sin necesidad de Flash.

JSARToolKit es una librería que nos facilita la entrada al mundo de Realidad Aumentada. Con la API getUserMedia podremos acceder a capturar contenido desde la cámara del usuario.

Para saber más sobre estas tecnologías, les recomendamos una nota publica por HTML5 Rocks, titulada: Writing Augmented Reality Applications using JSARToolKit. En la nota también se emplea 3D, apoyándose en las características de Canvas de HTML5 y en la librería three.js.

Más sobre Diseño y desarrollo Web


Acerca de

Autor de los libros: Webmaster Profesional, HTML5: Comprenda el cambio y Apps HTML5 para móviles. Soy especialista en Diseño y Programación Web y Mobile. Colaboré como autor y editor de contenidos para revistas, colecciones y diversos medios digitales. Dicto capacitaciones y consultorías sobre lenguajes y herramientas de desarrollo Web

9 Comentarios en “Realidad aumentada con HTML5 y JSARToolKit
  1. wilfer dice:

    hola estamos desarrollando una plicacion donde subimos modelos 3d nesesitamos darles unos parametros de colision pero no podemos si nos pueden ayudar

  2. Santiago dice:

    Hola, buen aporte! existe algo similar para mobile? saludos

  3. Daniel P.P dice:

    Hola, buenas tardes. Estamos pensando en desarrollar un proyecto con realidad aumentada, pero trabajando con plataformas móviles y usando de base phonegap, no código nativo. ¿Es posible utilizar esta librería para ello? La base de phonegap es html5 y javascript, no se si eso es suficiente para ello.

    Saludos.

    • Como todo, la respuesta es un gran “depende”. Lo recomendable es que realices previamente test y pruebas para llegar a la mejor conclusión, es la librería que se ajusta mejor a tu proyecto. Con PhoneGap tendrás el acceso a cámara, pero algunas personas que han realizado este tipos de desarrollo, me han comentado que hay más control y una gama mayor de opciones con desarrollo nativo, si se enfoca en el tema de acceso a cámara.

      Saludos

      Damián

  4. Clemente dice:

    Hola, estoy interesado en implementar realidad aumentada para que en un libro con fotos visto desde el móvil pueda pasar varias imágenes desde una misma foto.

    Al estilo del ejemplo que hay en: http://www.html5rocks.com/es/tutorials/webgl/jsartoolkit_webrtc/

    Pero estoy estancada en poder personalizar los marcadores por las fotos del libro… Eso se puede realizar o no es posible.

    Gracias!!!

Deja un comentario

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

*


Cursos y capacitaciones para empresas y profesionales

  • HTML & CSS (maquetado web).
  • CSS3 & Responsive Web Design (diseño web adaptado a móviles y tablets).
  • Flexbox & Grids (técnicas modernas de CSS).
  • LESS & SASS (CSS preprocessors).
  • Responsive E-mail (diseño de emails multidispositivo).
  • Bootstrap (el framework de diseño más utilizado).
  • HTML5 (Nivel inicial y Avanzado + APIs).
  • PhoneGap/Cordova (Aplicaciones para Android e iOS basadas en lenguajes Web).
  • JavaScript (Nivel inicial y avanzado con ECMAScript 6).
  • jQuery (una de las librerías más famosas de JavaScript).
  • Angular (framework para construir aplicaciones Web con JavaScript).
  • PHP & MySQL (programación del lado servidor y bases de datos).

Encontrame en las redes sociales. Contactame.