Blog

Comment créer une application de réalité augmentée

06 juin 2020 · Josué Gomes

La production de Réalité Augmentée peut être réalisée en associant le logiciel Unity à l'extension Vuforia. Lisez le tutoriel ci-dessous pour en savoir plus :

Ajouter la partie Éditeur Unity :

Éditeur Unity

Après avoir démarré un nouveau projet, l'écran de l'éditeur s'ouvre en mettant à disposition les outils d'édition.

  • Cliquez sur file et accédez à build settings ou, si vous préférez, utilisez le raccourci "ctrl+shift+b".

 

 

 

  • Avec le "build settings" ouvert, cliquez sur android puis sur "switch plataform". Si vous ne disposez pas de l'extension android, une option de téléchargement apparaîtra, après quoi vous pourrez suivre les étapes ci-dessus.

 

 

Ajouter ensuite :

Lorsque l'image sélectionnée comme target est affichée, le résultat final de l'animation apparaît dans la caméra de votre ordinateur :

Pour ajouter votre modèle 3D dans Unity, il vous suffit de faire glisser ou de copier le fichier 3D depuis le dossier de votre ordinateur vers l'onglet "Project" de Unity ; vous pourrez ensuite l'ajouter à votre RA. S'il apparaît sans texture, ajoutez également la texture.

Il est toujours conseillé d'organiser l'environnement Project : lorsque vous ajoutez des fichiers images, des fichiers audio ou des objets 3D, créez des dossiers séparés afin de ne pas vous perdre et de retrouver facilement ce dont vous avez besoin. Pour créer un dossier, faites un clic droit dans Project puis cliquez sur "create > folder".

 

 

Après avoir téléchargé depuis la "asset store" ou transféré votre animation vers Unity, la procédure est pratiquement identique : il suffit de faire glisser l'objet à l'intérieur de la "image target" et de le tester avec la caméra de votre ordinateur via le play mode.

 

RA avec séquence d'images

Vous pouvez également produire de la réalité augmentée à partir d'une séquence d'images. Si vous disposez d'une séquence d'images issue d'une animation 3D, accédez à "Project" et créez un dossier spécifique pour la séquence ; vous pouvez cliquer-glisser ou copier ces images dans Unity (1.). Après l'exportation des images, sélectionnez-les toutes, changez l'option en "sprite" (2.) et cliquez sur "aply" (3.).

 

 

 

En dehors du dossier contenant la séquence d'images, toujours dans l'onglet Project, faites un clic droit et, via "create", créez un "animator controler" et une "animation". Ces composants vous permettront de lire votre séquence d'images en générant une animation.

 

 

Ajoutez une nouvelle "image target" ou supprimez le modèle 3D et utilisez la même. Pour ajouter de nouvelles images et disposer de plusieurs RA, vous devez accéder à Vuforia, entrer dans votre database et ajouter une nouvelle image de la même façon que la première a été ajoutée, puis télécharger et importer à nouveau.

Après avoir configuré l'image, dans l'onglet "Hierarchy", cliquez sur la image target et créez un sprite.

 

 

À l'intérieur de ce sprite, accédez à "add component", recherchez et ajoutez le "animator", puis faites glisser le "animator controler" que vous avez créé jusqu'à la fenêtre "controller".

 

 

 

Ouvrez un onglet "animator" et faites-y glisser l'animation que vous avez créée.

 

Accédez à Window et ajoutez l'onglet "animation et animator". Si l'un des onglets mentionnés au cours de ce tutoriel n'est pas activé dans votre Unity, vous pouvez le trouver facilement via le même bouton : Window.

 

 

Avec l'onglet animator ouvert, cliquez sur votre animator controler, ce qui ouvrira les couches de votre animation. Ajoutez ensuite l'élément animation que vous avez créé en le sélectionnant et en le faisant glisser jusqu'à lui.

 

 

Entrez dans le dossier contenant votre séquence d'images (1.), cliquez sur "new sprite" (le composant à l'intérieur de la image target) (2.), sélectionnez toutes les images de votre séquence et faites-les glisser vers l'onglet animation (3.), puis cliquez sur play dans ce même onglet ; l'animation devrait apparaître dans la scène (4.).

RA avec URL

Il est également possible de produire une RA avec des vidéos en URL. Si vous disposez d'une vidéo avec une URL ou d'un serveur sur lequel vous pouvez téléverser une vidéo et obtenir une URL à ajouter à l'application, celle-ci utilisera Internet pour lire la vidéo sans occuper trop de mémoire sur le téléphone utilisé. Ce mode ne fonctionne pas avec des vidéos hébergées sur des sites tels que Youtube ou Facebook ; pour lire l'URL, il faut un lien qui contient uniquement la vidéo et disposer d'un accès à Internet.

 

Ajoutez une "image target", sélectionnez-la en cliquant dessus et, avec le bouton droit de la souris, accédez à "3D Object > Plane".

 

 

Une fois le plane ajouté à la image target, cliquez dessus, accédez à "add component", recherchez "vídeo player" et sélectionnez-le.

 

Accédez au vídeo player situé à l'intérieur du plane et modifiez la ressource "source" de vídeo clip vers URL, puis ajoutez le lien de votre vidéo. Votre vidéo pourra ensuite être lue lorsque la caméra scannera l'image.

 

 

RA sur Android

Pour créer un APK (type de fichier des applications pour Android), vous devez disposer d'un SDK, c'est-à-dire un kit de développement logiciel pour Android. Ce logiciel "communiquera" avec Unity en fournissant des données et des outils pour produire l'application. Dans ce cas, nous utiliserons Android Studio, qui est le programme le plus utilisé pour développer des applications Android.

 

 

Il vous suffit de télécharger et d'installer le programme sur votre ordinateur. Cependant, il existe quelques détails importants lors de l'installation que vous devez vérifier. Il n'est pas permis d'installer le programme dans des dossiers dont le nom contient des accents ; notez également l'emplacement où vous allez l'installer et mémorisez ou notez l'adresse de cet emplacement, car il sera le dossier source du SDK et vous pourrez en avoir besoin ultérieurement.

Avec un téléphone Android, vous pouvez tester votre réalité augmentée directement sur l'appareil : il vous suffit de connecter le dispositif via USB et d'activer le débogage dans ses paramètres. Ensuite, dans Unity, accédez à "file > build settings > build and run", sélectionnez le nom et le dossier du fichier, puis cliquez sur enregistrer. Unity effectuera la compilation et, une fois terminée, l'application sera installée sur votre appareil.

 

 

Apple impose des spécifications plus exigeantes pour les appareils iOS (iPhones et iPads) ; pour les tester, vous devez disposer d'un compte développeur Apple et d'un Macbook ou d'un iMac.

 

Quelques erreurs rencontrées au cours du processus

  • Compilation incomplète — SDK introuvable : lors de la compilation, Unity peut commencer à charger l'apk normalement, mais après un certain temps, un avertissement tel que "sdk non trouvé" peut apparaître et la compilation ne se termine pas. Si cela se produit, Unity proposera une option pour indiquer l'emplacement de votre sdk, c'est-à-dire le dossier dans lequel il a été installé. Il suffit de localiser le dossier pour résoudre le problème.

  • Objet 3D ajouté sans texture : Si vous ajoutez un projet 3D dans Unity et qu'il apparaît sans texture dans le programme, ajoutez les images de texture séparément. Vous pouvez les faire glisser dans Unity et les ajouter ultérieurement lorsque l'objet est en scène (en les faisant glisser de l'onglet Project vers Hierarchy).

  • Appareil introuvable : Il ne suffit pas de connecter le téléphone Android via USB pour tester votre APK. Si Unity ne trouve pas votre appareil, vérifiez dans vos paramètres si vous avez activé les options : développeur et débogage via USB.

Si ce n'est pas le cas, l'activation est simple : dans les versions les plus récentes d'Android, il existe un bouton spécifique dans les paramètres appelé "Options du développeur" ; cliquez dessus, activez cette option, puis un peu plus bas vous trouverez "Débogage USB", activez-le également. Une fenêtre de confirmation apparaîtra, appuyez sur OK.

Sur certaines versions plus anciennes, accédez également aux paramètres, puis aux applications et au bouton "développement", et activez le Débogage USB.

Si vous ne parvenez pas à localiser l'une de ces deux options, accédez aux paramètres et à "À propos de l'appareil", cliquez 7 fois sur le numéro de compilation / version build / numéro de version, revenez aux paramètres, choisissez les options du développeur, activez-les ainsi que le débogage USB.

Ce processus peut être annulé en désactivant le Débogage USB sur votre téléphone, ou vous pouvez annuler uniquement pour les ordinateurs auxquels vous ne souhaitez plus autoriser le débogage.

 

  • L'animation de la RA apparaît même sans scanner l'image ou n'apparaît pas : supposons que vous souhaitiez tester votre RA en "play mode" (outil situé dans la partie centrale supérieure de Unity sous forme d'un symbole play) et que, lorsque la webcam est activée, l'animation apparaisse sans lire l'image cible et reste visible en permanence dans votre caméra. Pour résoudre ce problème, accédez à l'onglet "Hierarchy" et placez l'animation à l'intérieur de l'image cible que vous avez créée ; ainsi, l'animation n'apparaîtra que lorsque l'image sera détectée.

Dans une autre situation avec la même cause mais une conséquence différente, si l'animation n'apparaît pas lors du scan de l'image avec la caméra, vérifiez à nouveau que l'animation se trouve bien à l'intérieur de l'image cible.

 

  • L'URL ne fonctionne pas : vous avez choisi de produire une RA avec des vidéos en URL, mais lors du scan de l'image la vidéo n'apparaît pas ? Vérifiez d'abord que vous disposez d'une bonne connexion Internet, puis vérifiez le lien que vous utilisez : ce lien doit contenir uniquement la vidéo et celle-ci doit être dans un format pris en charge par Unity. Les formats vidéo pris en charge sont : MOV, AVI, ASF, MPG, MPEG, MP4.

  • Erreur "Location contains non ASCII characters" : Si à un moment des installations ou du développement vous recevez un message d'erreur similaire à celui-ci, sachez que l'emplacement du programme, du projet, du fichier, etc. se trouve dans un endroit contenant des caractères inhabituels tels que des lettres accentuées, des points ou des symboles. Sachant cela, essayez de modifier l'adresse de l'élément en question ou de renommer le dossier.

  • Docs : Les programmes utilisés pour produire de la RA sont accompagnés d'une sorte de manuel d'instructions que vous pouvez consulter en cas de doute ou si une erreur survient que vous ne parvenez pas à résoudre. Ce sont les fameux DOCS ; vous pouvez les trouver sur le site de chaque programme ou accéder aux liens ci-dessous :

Unity: https://docs.unity3d.com/Manual/index.html

Android Studio: https://developer.android.com/docs

Vuforia: https://library.vuforia.com/getting-started/overview.html