Tutorial Unity y Vuforia
Software necesario
- Unity3d 2017.4.1 o posterior
- Google sdk Android Studio
- Visual studio Code (opcional, con Monodevelop se puede trabajar… o no…)
(No recomiendo la última versión por no estar tan probada como esta y por no ser la usada en el tutorial)
Hardware y material físico necesario
- Un ordenador portátil con webcam o torre con webcam usb
- Un teléfono móvil Android (cámara incluida) o un Iphone (en este tutorial no se mostrará su uso pero no sobra el decir que se puede usar también).
- Una carta o imagen para usar de target (cuanto más contraste tenga mejor para la identificación de rasgos o puntos). Yo he usado una carta de un tigre del juego Magic (figura 14). No recomiendo usar imágenes directamente proyectadas en la pantalla
del móvil porque el brillo y reflejos hará que os cueste muchísimo que se capture. Mejor física aunque tendremos que capturarla posteriormente para nuestra base de datos.
Instalación y configuración previa
Instalación de Unity 3D
Descarga desde el enlace el instalador web. Ejecutamos y pulsamos next, aceptamos, next y en la siguiente ventana
seleccionamos lo que viene por defecto y añadimos el soporte de Vuforia.
Seleccionamos la ruta por defecto o la que queramos y seguimos hasta finalizar la instalación. El proceso es algo largo por lo que podemos ir haciendo el siguiente paso mientras tanto o esperar a que termine, pero no abramos aún Unity una vez instalado.
Instalación de SDK de Google
Si alguna vez has descargado previamente este SDK para algún proyecto de Unity o para desarrollar en Android con Java, puedes saltar este paso, sino sigue los pasos a descritos continuación.
Descargamos Android Studio pinchando en
el siguiente botón y una vez descargado lo instalamos.
Si tenemos ya una versión anterior de Android Studio y no lo recordábamos o la queremos actualizar, nos saldrá la siguiente ventana.
El único paso en el que hay que prestar especial atención es en la selección del SDK que sea la más alta compatible con tu dispositivo Android. En mi caso tengo Android 8.0 Oreo que corresponde a la API 26, pero por darle
algo más de compatibilidad preferí añadir la API 24 de Android 7.0. De todos modos siempre se puede añadir nuevas versiones ejecutando Android Studio, Tools, Android y SDK Manager.
Ya sólo falta agregar la ruta del SDK a Android, pero lo haremos más tarde cuando arranquemos Unity y optemos por compilar para Android.
Registro en Vuforia y obtención de clave de desarrollo
Ya estaría lo básico ocnfigurado, pero falta lo que hará nuestra magia con AR, Vuforia. Para ello accedemos a su web y nos registramos.
Tras
esto, nos logueamos y accedemos a la sección Develop, License Manager para generar una key que nos hará falta más tarde como indico en la siguiente figura, dándole un nombre y marcando la casilla de confirmación.
Creando la aplicación y preparando el entorno en windows 10
Ahora sí, abrimos Unity 3D, creamos un proyecto nuevo en la ruta que queramos con un nombre que nos resulte identificable y con la opción 3D.
Instalación de asset Vuforia
Si os pasa como a mi, que ya tenía instalado Unity 2017 de proyectos previos y no encontraba la forma de añadir el componente de Vuforia, podéis seguir los mismos pasos que seguí yo y os detallo a continuación. En caso de que lo hayáis
seleccionado en la instalación de Unity de este tutorial, podréis saltaros este paso.
Para ello seleccionamos File -> build settings -> player settings -> XR Settings y marcaremos Vuforia. Si no está instalado, nos preguntará
si queremos descargarlo. Le decimos que si y lo instalamos. Es posible que nos pida cerrar Unity para poder instalar esta actualización de componentes.
Una vez instalado, volvemos a repetir los pasos para asegurarnos de que esté seleccionado el componente de Vuforia. Si no es así lo marcamos y cerramos la ventana de build settings.
Creando nuestra cámara AR y configurando vuforia
El siguiente paso será añadir nuestra cámara de AR y eliminar la existente. Para ello pulsamos botón derecho del ratón sobre el cuadro Hierarchy de Unity y seleccionamos Vuforia -> cámara AR.
Es posible que nos pida importar lo necesario si no lo hizo al seleccionar Vuforia en el paso previo, le decimos que si. Nuestro proyecto tendrá entonces las siguientes carpetas:
En el cuadro de Hierarchy ahora tendremos dos cámaras así que eliminamos la Main Camera.
Ahora configuramos la cámara de AR seleccionándola y pinchando en Open Vuforia configuration como
muestra la imagen.
Pulsamos en Add License y donde nos sale el cuadro de App License Key, pondremos la key que nos generó en la web de Vuforia al dar de alta nuestro proyecto AR.
Creando la base de datos necesaria para los objetos “target” que usaremos en el proyecto
Volvemos a la web de Vuforia y en este caso en lugar de a la licencia accedemos a Target Manager. Pulsamos sobre Add DataBase donde le pondremos un nombre y en nuestro caso marcaremos Type: Device. Con
esto lo que le decimos es que el target estará alojado en nuestro dispositivo, siendo Cloud igual pero con la necesidad de consultar por Internet la imagen y con VuMark, cuando son marcas registradas.
En mi caso lo he llamado
prueba _ar_demo y pinchando sobre ella, añadiremos nuestro target. Al pulsar Add target, nos saldrán varios tipos, en el ejemplo usaremos single image, pero se pueden usar objetos 3D reales. La imagen usada tiene
que tener un máximo de 2mb y ser jpg o png. Además debemos saber el ancho de la misma ya que habrá que ponerlo en la caja donde pone Width y darle un nombre. Yo he usado la siguiente imagen
capturada con mi móvil de una carta real. Como veis en la figura, el número de estrellas nos indica la calidad o facilidad que tendra de ser reconocida por nuestro dispositivo como target.
Una vez subida, pulsamos sobre Download Database (All) y marcamos Unity Editor. Esto generará un unitypackage que importaremos haciendo doble clic.
Una vez importado, como se ve en la figura y en la ruta indicada, estará nuestro target.
Ahora seleccionamos nuestra cámara AR de nuevo y la configuración de Vuforia para cargar la base de datos descargada, marcando en Databases la nuestra y activándola.
Configurando el objeto de nuestra tarjeta “target” que nuestra cámara detectará
Ahora añadiremos nuestra carta como target a la escena, pulsando sobre Hierarchy botón derecho del ratón, Vuforia e Imagen. Esto nos crea un ImageTarget que al seleccionarlo nos muestra en el Inspector sus opciones.
En Database al pinchar se nos muestra como opción la nuestra que seleccionamos. Y si no lo hace de forma automática, seleccionamos nosotros la nuestra. Aparecerá con su tamaño real, pero lo arreglamos cambiando su Scale en 1 1 1.
Agregando el objeto virtual que aparecerá al detectar nuestro “target” con la cámara
Ahora, creamos un objeto cualquiera, en mi caso un cubo que sea hijo de ImageTarget y le añadimos un material de algún color. Lo escalamos y colocamos donde queremos que aparezca cuando nuestra cámara detecte nuestro target. Este objeto puede
ser un objeto estático como el ejemplo o uno animado. Aquí el límite lo dará nuestra imaginación.
Probando la demo con la webcam
Al fin, para ver nuestro primer resultado, seleccionaremos nuestra cámara AR e iremos una vez más a su configuración y en la sección Webcam, Camera Device seleccionaremos nuestra cámara. Tras esto pulsamos “Play”
y al mostrarle a nuestra webcam nuestra tarjeta o carta, hará aparecer nuestro cubo rojo sobre ella y aunque la movamos irá con nosotros siempre que el plano de la imagen sea visible.
Compilando el proyecto para nuestro Android
Ya tenemos nuestro proyecto funcionando, pero lo chulo es poder enseñarselo a la gente y hacerlo más funcional aún ¿no?
Bien, pues vamos a ello, no es nada complejo y el proceso es exactamente el mismo que cualqueir proyecto Android asique los que
ya hayais tocado algo con Unity lo hareis si necesidad de mirar esto o de un vistazo rápido.
Seleccionamosd File -> Build Settings y añadimos la escena actual. Si hasta ahora no la habíamos guardado, (eso es que os gusta el riesgo…
para una demo no pasa nada, pero para un proyecto real no os lo aconsejo) nos pedirá el nombre y ruta de la misma, por ejemplo main.
Ahora seleccionamos Android y pulsamos Switch Platform. Esto creará lo necesario
para el cambio de proyecto. Cuando acabe, pulsamos sobre Player Settings. Marcamos de nuevo Vuforia Augmented Reality Supporte. En Other Settings, en la sección Identification es necesario darle
un nombre a Package Name que suele ser nuestro juego y nuestra web a la inversa, por ejemplo com.croquetasvirtuales.ARdemo y estaría listo.
Al pulsar sobre Build debería de generar el apk de nuestra demo que instalaremos y probaremos en nuestro móvil, pero es posible que nos de error si no hemos configurado aún el path del SDK de Android como comenté
al principio que haríamos a posteriori.
En ese caso iremos a Edit, External Tools, SDK y JDK. Si por algún motivo alguno de los dos no lo hemos instalado, podemos darle a download ahí mismo y tras instalarlo, le pondremos la ruta.
Tras esto, iremos de nuevo a File -> build and settings y haremos el build. Si os da error puede ser que tengáis activado por defecto en Other Settings, la compatibilidad con AndroidTv, así que desmarcadla.
Una vez ejecutado en nuestro móvil tendremos el resultado siguiente:
Comments
Post a Comment