Accueil / Réalité Augmentée / Tutoriel : comment utiliser Frame Studio de Facebook pour créer des éléments en réalité augmentée ?

Tutoriel : comment utiliser Frame Studio de Facebook pour créer des éléments en réalité augmentée ?

Lors de la dernière conférence F8, Facebook par l’intermédiaire de son représentant Mark Zuckerberg n’a pas caché ses ambitions : la plateforme aux 2 milliards d’utilisateurs compte bien intégrer la réalité augmentée dans les mois et années à venir.

Lors de sa présentation, le fondateur de Facebook a notamment dévoilé 2 outils disponibles pour les développeurs et designers et plus largement mis à disposition des marques afin qu’ils puissent développer des contenus en réalité augmentée. Les outils se nomment : Frame Studio et AR Studio. Les deux outils sont assez différents mais ont le même objectifs : pouvoir créer toujours plus de contenus « funs » pour les utilisateurs et permettent aux marques et influenceurs d’être toujours au plus proche de leurs utilisateurs.

Frame Studio a pour objectif de pouvoir créer des éléments en réalité augmentée que vous pouvez intégrer « en tant que filtre » dans l’application photo de Facebook. Intéressant pour une marque qui veut créer pour un évènement ou un engagement particulier autour d’un produit (une nouvelle bouteille, voiture, objet…). Le tout est assez facile à réaliser et à mettre en place. Nous vous donnons le tutoriel complet pour réaliser cela ci-dessous. Il ne reste plus qu’à faire fourmiller votre imagination puisque l’outil est déjà disponible et fonctionne pour les pages personnelles ainsi que pour les Fan Pages.

AR Studio est différent puisqu’il va beaucoup plus loin que Frame Studio. Selon Facebook : « il permet aux artistes et aux développeurs de créer leur propre expérience en réalité augmentée tels que des images animées, des effets interactifs qui réagissent à un mouvement, intégrer de l’AR dans une vidéo live ou encore interagir avec des données provenant de services tiers [ndlr. : ex. GIPHY]« .  Pour cela, Facebook a mis en place un logiciel pour en bêta privé et disponible sur Mac pour les artistes et développeurs qui souhaitent démarrer l’expérience. Vous pouvez donc vous inscrire pour y participer ici.

Comment utiliser Frame Studio étape par étape ?

Mieux qu’un long discours, voici les différentes étapes pour créer votre premier objet/effet en réalité augmentée avec Frame Studio

1. Où puis-je accéder au service Frame Studio ?

Pour accéder au service Frame Studio et démarrer, il vous suffit de vous rendre à cette adresse : https://www.facebook.com/fbcameraeffects/home/ et de suivre les instructions suivantes.

2. Comment démarrer le service ?

Cliquez ensuite sur le bouton « Créez un décor » et une nouvelle interface va démarrer. Cela va être votre interface de travail sur laquelle vous allez créer votre effet « à la Snapchat« .

3. Quel objet utiliser pour créer mon effet en réalité augmentée ?

Sur le choix de l’objet vous devez absolument utiliser un .png et non pas un .jpg. Le .png gère la transparence (le fond est transparent) et donc s’intégrera mieux. Voici un exemple d’objet téléchargeable, mais vous en trouverez plein sur Google et vous pouvez bien sûr créez le votre via des outils comme Photoshop par exemple. Notre conseil est de trouver un objet qui soit le plus grand possible pour que vous puissiez changer facilement sa taille sans que ce dernier ne pixelise.

4. Comment fonctionne l’interface ?

L’interface fonctionne facilement grâce à un glisser-déposer. Vous prenez votre objet que vous avez téléchargé et vous le glissez sur le plan de travail du milieu. Vous avez ensuite la possibilité de changer sa taille et sa position. Cela peut prendre un petit moment avant de charger l’objet. Sachez que vous pouvez intégrez plusieurs effets sur le même plan de travail.

frame-studio-1-950x682

Lorsque vous avez choisi la taille qui vous convient et le positionnement, vous cliquez en bas à droite sur le bouton « Suivant » dans lequel vous devez rentrez certains détails (qui seront changeables par la suite sans problème). C’est à ce moment-là qu’il est important de bien choisir à qui va appartenir l’effet : soit pour vous-même, soit pour votre Fan Page. Lorsque cela est fait, vous cliquez sur le bouton « Suivant » et vous pourrez examiner ce que rend votre effet selon les positions de votre smartphone.

Note : si ces positions peuvent aider, il nous a fallu au final plusieurs reprises pour bien caler l’effet ainsi que la taille et faire plusieurs essais avant d’obtenir le bon effet. Il y a donc une véritable phase de test, cette page « examen » n’aide donc ici que peu.

Avant de publier votre effet, il existe quelques boutons intéressants :

  • Vous pouvez enregistrer votre effet pour y revenir ensuite.
  • Avoir une preview sur votre mobile : en cliquant dessus, vous allez recevoir une notification Facebook. Depuis votre mobile, vous cliquez sur la notification et vous commencez à tester votre effet. Le délai de chargement peut prendre quelques temps, mais l’effet fonctionne. C’est grâce à cette preview que vous allez pouvoir voir exactement si votre effet est bien calé. Si ce n’est pas le cas, refaite le positionnement et recommencez l’opération jusqu’à ce que cela soit fini.
  • Envoyer votre effet pour le rendre disponible à tous

 

A vous maintenant de créer les meilleurs effets avec Frame Studio pour impressionner et engager vos amis et fans !

A propos de Milan Boisgard

Fondateur du site GoGlasses.fr, je cherche à comprendre et à analyser le phénomène de réalité virtuelle et augmentée pour en tirer des usages concrets et développer le domaine.