Démo ARKit : réalisation de films en réalité augmentée

Publié: 2022-03-11

La réalité augmentée et la réalité virtuelle deviennent courantes, et toutes les grandes entreprises de haute technologie les poursuivent : Apple a ARKit, Google a ARCore et Microsoft a son propre HoloLens (et puis, bien sûr, il y a Unity). Et avec quelques applications qui reçoivent beaucoup d'attention du public, le développement d'applications de réalité augmentée devient une compétence très souhaitable pour les développeurs mobiles.

Dans cet article, j'aimerais démontrer une petite application simple, mais significative, qui fera plus que simplement avoir un cube rotatif. Qui a besoin de cubes rotatifs de toute façon ? Faisons Matrix.

Présentation d'ARKit

ARKit est un framework Apple permettant de créer des applications AR pour les appareils iOS. Plusieurs rendus peuvent être utilisés avec : SpriteKit pour les objets 2D, SceneKit pour la 3D et Metal si nous voulons implémenter un rendu personnalisé.

Pour cette démo, nous utiliserons SceneKit pour rendre et placer des objets 3D entièrement rendus (couteaux).

image : distinction entre les moteurs de rendu

Depuis ARKit v2, cinq types de configuration sont pris en charge dans ARKit :

AROrientationTrackingConfiguration – Lorsque vous souhaitez suivre uniquement l'orientation de l'appareil (par exemple, pour une application de constellation d'étoiles). Avec cette configuration, les mouvements physiques tels que les pas de côté ne sont pas suivis et n'affectent pas la position ou la direction des objets sur la scène.

ARWorldTrackingConfiguration - Il s'agit probablement de la configuration la plus souvent utilisée pour AR car elle prend en charge ce que la plupart des gens considéreraient comme la réalité augmentée. Les exemples incluent les applications de chasse aux animaux de compagnie virtuels ou aux Pokémon.

ARFaceTrackingConfiguration – Cette configuration n'est actuellement prise en charge que par l'iPhone X car elle nécessite une caméra TrueDepth (comme Face ID). Cette configuration suit les caractéristiques du visage et son décalage relatif par rapport à l'expression faciale neutre (par exemple, une application où les utilisateurs peuvent essayer des lunettes de soleil à la mode avant de les commander).

ARImageTrackingConfiguration - Si vous avez un ensemble de marqueurs et que vous souhaitez montrer des animaux sautant hors du marqueur, cette configuration est faite pour vous. Ceux-ci ne doivent pas nécessairement être des marqueurs de type carte, mais n'importe quelle image 2D. Vous pourriez pointer votre appareil photo vers la Joconde, et elle tournerait la tête et vous dirait quelque chose. Un inconvénient est que vous devez dire à l'avance quelle est la taille physique du marqueur d'image.

ARObjectScanningConfiguration – Cette configuration est la version 3D de ARImageTrackingConfiguration.

Dans cette démo, nous allons ajouter des couteaux et des balles à la scène, et nous aimerions avoir six degrés de liberté, donc l'outil approprié est ARWorldTrackingConfiguration.

Le concept d'application

Tous ceux qui ont vu The Matrix peuvent se rappeler que Neo (Keanu Reeves) a esquivé les balles et les a arrêtées en l'air. Notre application nous aidera à recréer cette scène à partir d'un flux de caméra en direct. Ainsi, nous pouvons créer des vidéos personnalisées démontrant des pouvoirs de type Neo.

Notre application aura des modèles 3D de balles et de couteaux. C'est à l'utilisateur de décider combien de balles ou de couteaux il veut dans son film. Si vous souhaitez passer du temps et ajouter d'autres modèles, le code de l'application est open source et il est disponible sur GitHub (https://github.com/altaibayar/toptal_ar_video_maker). Bien qu'il ne s'agisse pas d'un didacticiel AR complet, la démo et la source devraient être une ressource précieuse si vous essayez de vous lancer dans le développement d'applications AR sur iOS.

Le scénario de cas d'utilisation prévu est le suivant :

  1. demandez à un ami de se déguiser en Néo (ce n'est pas strictement nécessaire au fonctionnement de l'application, mais cela peut aussi bien paraître pendant que nous faisons cela).
  2. Demandez à "Neo" de se tenir à environ 10 mètres (30 pieds) de vous.
  3. Démarrez l'application et scannez le plan du sol.
  4. Ajoutez des balles et des couteaux volant à "Neo".
  5. Maintenez le bouton d'enregistrement enfoncé pour enregistrer la vidéo pendant que "Neo" effectue des mouvements sympas en esquivant ou en arrêtant les balles
  6. relâchez le bouton d'enregistrement et enregistrez la vidéo dans votre bibliothèque.

Construire l'application

Comme mentionné précédemment, nous voulons pouvoir nous déplacer librement tout en enregistrant les 360 degrés de la scène et faire en sorte que les balles et les couteaux suivent le mouvement de la caméra de manière appropriée.

À des fins de démonstration, nous n'aurons que deux types d'objets virtuels : les couteaux et les balles de fusil de chasse.

Les couteaux sont des objets détaillés et j'utiliserai le modèle gratuit de https://poly.google.com/view/3TnnfzKfHrq (Merci Andrew).

Les balles de fusil de chasse, cependant, sont de simples objets sphériques et nous pouvons simplement les coder. Nous les rendrons métalliques et incandescentes pour plus de variété. Puisque nous émulons un fusil de chasse, nous les générerons également sous forme de clusters groupés. Pour que le regroupement ait un sens sans trop de tracas, nous pouvons utiliser le générateur de nombres aléatoires gaussien du GamplayKit.

GameplayKit est un outil utile qui s'avère pratique chaque fois que vous avez besoin d'une génération de bruit aléatoire, d'une machine à états, d'une IA ou d'une prise de décision basée sur les probabilités.

 override init() { super.init(); // generate 50 gaussian distributed position around [0, 0, 0] let positions = Randomness.gaussian(center: SCNVector3Zero, count: 50); for pos in positions { let node = SCNNode(geometry: sphereGeometry()); node.position = pos; self.addChildNode(node); } } private func sphereGeometry() -> SCNGeometry { // radius of one projectile sphere is 5mm/0.2inch let sphere = SCNSphere(radius: 0.005); // sphere is reddish sphere.firstMaterial?.diffuse.contents = UIColor.red; // reflection on light is gray/silver sphere.firstMaterial?.reflective.contents = UIColor.gray; // metalness is 0.3 sphere.firstMaterial?.metalness.contents = 0.3; // shading should be realistic sphere.firstMaterial?.lightingModel = .physicallyBased; return sphere; }

Une logique de décalage aléatoire similaire peut être utilisée pour les couteaux, mais comme ils ne se comportent pas comme des clusters, une simple distribution aléatoire peut être utilisée.

Architecture d'application

Il n'entre pas dans le cadre de cette démonstration de se plonger dans les discussions sur le meilleur paradigme d'architecture. Il existe de nombreux articles qui se penchent sur ce sujet.

Au lieu de cela, je vais simplement présenter la structure du projet comme un guide pour vous repérer dans le projet GitHub lié : quels sont les composants principaux, comment ils sont connectés et pourquoi ils ont été choisis.

L'application n'a que trois écrans :

PermissionViewController - L'écran où nous demandons à l'utilisateur d'accorder à l'application l'accès aux fonctionnalités mobiles requises.

  • Caméra – Évidemment
  • Galerie - Pour enregistrer la vidéo enregistrée et l'entrée du microphone
  • Microphone - L'autorisation est requise par une bibliothèque que j'utilise pour créer la vidéo (par défaut, le son du microphone serait utilisé comme source d'une piste audio).

ExportViewController - Cet écran affiche une vidéo enregistrée et offre les options pour partager ou enregistrer la vidéo.

MainViewController - Toute la magie se produit ici.

D'après mon expérience, il est préférable d'envelopper toutes les classes ARKit nécessaires comme ARSession, ARConfiguration et tous les types uniques de SCNNode. De cette façon, le code est explicite.

ARSession est hérité dans ToptalARSession, et la nouvelle classe de session n'a que trois méthodes : le constructeur de classe où nous configurons tout ce qui est requis et les méthodes resetTracking et pauseTracking.

L'application reconnaît quatre types uniques de SCNNodes :

  • KnifeNode – Représente un objet couteau 3D et charge automatiquement un couteau 3D comme géométrie.

  • BulletsNode - Ce nœud représente un ensemble de cartouches de fusil de chasse. Le bruit gaussien aléatoire, les couleurs et le mode d'éclairage physique sont configurés automatiquement.

    Aucun travail spécial ou supplémentaire n'est requis dans les classes qui utilisent KnifeNode ou BulletsNode, et ils peuvent être utilisés comme modèles pour personnaliser l'application afin d'ajouter plus de types d'objets 3D.

  • ReticleNode - Enveloppe un modèle 3D qui apparaît dans la scène au-dessus du sol pour montrer où des couteaux ou des balles seront ajoutés.
  • DirectionalLightNode - Il s'agit d'un nœud représentant une lumière verticale pointant vers le bas.

Références et crédits

Modèle de couteau : https://poly.google.com/view/3TnnfzKfHrq

Enregistrement depuis SCNScene : https://github.com/svtek/SceneKitVideoRecorder

Icônes de bouton, application de démonstration ARKit : https://developer.apple.com/documentation/arkit/handling_3d_interaction_and_ui_controls_in_augmented_reality