SlideShare une entreprise Scribd logo
1  sur  25
Télécharger pour lire hors ligne
Conception d’Interfaces Immersives pour
la VR/AR :
Découverte d’un Cas Pratique
Alexia Buclet
Design Ops Director & UX Designer
Minsar.app
@AlexiaBuclet
21/06/2019
Continuité avec l’année dernière…
➢ “L’UX Design dans les Nouvelles Technologies”
➢ Réalité Virtuelle, Augmentée et “Mixte”
Alexia Buclet
© Magic Leap
➢ Anciennement Minsight, logiciel de création d’expériences en AR/VR : directement
dans l’appareil en WYSIWYG et sans compétence en développement.
Minsar
Alexia Buclet
Bêta :
L’UX Design en VR/AR
Alexia Buclet
UX Design à 360°
➢ Affichage autour de l’utilisateur
➢ Champ de vision = écran en mouvement
➢ Adapter l’interface au contexte
Alexia Buclet
60°
20°
12°
40°
47°47°
77° 77°
102°102°
UX Design en 3D
➢ Une nouvelle dimension : la profondeur
➢ Distance à l’utilisateur : confort et lisibilité
➢ Distance entre les éléments
➢ Différents espaces d’affichage
Alexia Buclet
20m :
limite perception
du relief
0.5m
1.5m : popup 2-3m : menu10m :
limite perception forte
du relief
UX Design immersif
➢ Casques AR/VR : interface affichée dans un monde immersif
(virtuel ou physique)
➢ Respecter les règles de la physique…
➢ … Tout en proposant des interactions magiques
➢ Guider l’utilisateur
Alexia Buclet
UX Design immersif
➢ Casques AR/VR : interface affichée dans un monde immersif
(virtuel ou physique)
➢ Limiter la fatigue physique
➢ Prendre en compte l’infinité de positionnement de l’utilisateur
➢ Respecter l’espace personnel
Alexia Buclet
UX Design dans un monde dynamique
➢ Prendre en compte l’environnement (virtuel ou physique)
➢ Eviter les conflits possibles
➢ Intégrer les éléments
➢ Adapter selon les évolutions
possibles et du contexte
Alexia Buclet
Un cas pratique : l’import
Alexia Buclet
Importer des fichiers
1. Choisir l’élément
2. Le télécharger
3. Placer l’élément dans l’espace de travail
Alexia Buclet
2D : l’exemple de PowerPoint
➢ 2 cas possibles en important une image :
➢ Image plus petite que la diapositive
➢ Image plus grande que la diapositive
➢ Choix des designers :
➢ Utiliser la taille d’origine
➢ Si trop grande : s’adapte à la taille de la diapo
➢ Si la taille de la diapo est modifiée : choix à l’utilisateur
Alexia Buclet
En VR/AR
➢ Importer l’élément devant l’utilisateur à une distance confortable.
Alexia Buclet
Mouvement de l’utilisateur
➢ Mais si l’utilisateur tourne la tête au moment de l’import ?
Alexia Buclet
Taille de l’élément
➢ Mais si l’élément importé est très grand ?
Alexia Buclet
Taille de l’élément
➢ Mais si l’élément importé est très petit ?
Alexia Buclet
Environnement
➢ Mais s’il y a un mur devant l’utilisateur ?
Alexia Buclet
Déplacement de l’utilisateur
➢ Mais si le chargement prend un peu de temps… et l’utilisateur
se déplace ?
Alexia Buclet
Attention de l’utilisateur
➢ Mais si le chargement prend un peu de temps… et qu’il y a une
erreur ?
Alexia Buclet
Exemples de problèmes concrets
Alexia Buclet
Pour vous aider
➢ Utilisez le monde physique pour concevoir le virtuel immersif :
➢ Concevez en immersion.
➢ Faites des Proofs of Concept pour itérer facilement.
Alexia Buclet
Objets physiques Un mètre
Les challenges
des interfaces immersives
Alexia Buclet
➢ Avec une dimension en plus et les appareils immersifs actuels
arrive une multitude de nouveaux challenges à relever !
Alexia Buclet
➢ Ces challenges ne doivent pas se reporter sur l’utilisateur, mais
sur l’équipe de conception/développement :
➢ Adaptez votre manière de penser et vos outils.
➢ Soyez attentifs aux choix pris dans les expériences que vous essayez.
➢ Apprenez des autres métiers déjà spécialisés en 3D.
Alexia Buclet
@AlexiaBuclet
Minsar.app

Contenu connexe

Similaire à UX Days 2019 by Flupa - Conférence : Alexia Buclet

Similaire à UX Days 2019 by Flupa - Conférence : Alexia Buclet (20)

Meetup XVR Aura - Travailler efficacement sur un projet xr
Meetup XVR Aura - Travailler efficacement sur un projet xrMeetup XVR Aura - Travailler efficacement sur un projet xr
Meetup XVR Aura - Travailler efficacement sur un projet xr
 
Introduction à la Réalité Augmentée
Introduction à la Réalité AugmentéeIntroduction à la Réalité Augmentée
Introduction à la Réalité Augmentée
 
Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...Retour d'expérience sur la conception et la construction d'une application ME...
Retour d'expérience sur la conception et la construction d'une application ME...
 
Realite Augmentee by Newcast Vivaki
Realite Augmentee by Newcast VivakiRealite Augmentee by Newcast Vivaki
Realite Augmentee by Newcast Vivaki
 
Augmented Reality
Augmented RealityAugmented Reality
Augmented Reality
 
Responsive Web Design : back to basics
Responsive Web Design : back to basicsResponsive Web Design : back to basics
Responsive Web Design : back to basics
 
RWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben PieraertsRWD - Back to Basics par Ruben Pieraerts
RWD - Back to Basics par Ruben Pieraerts
 
Comment concevoir une experience utilisateur cross canal
Comment concevoir une experience utilisateur cross canalComment concevoir une experience utilisateur cross canal
Comment concevoir une experience utilisateur cross canal
 
Printemps Réseaux Sociaux Québec 2013
Printemps Réseaux Sociaux Québec 2013Printemps Réseaux Sociaux Québec 2013
Printemps Réseaux Sociaux Québec 2013
 
LE WEBDOC & LE WEB2.0 - C'EST QUOI LE WEB DOCUMENTAIRE ? - FIFO 2014
LE WEBDOC & LE WEB2.0 - C'EST QUOI LE WEB DOCUMENTAIRE ? - FIFO 2014LE WEBDOC & LE WEB2.0 - C'EST QUOI LE WEB DOCUMENTAIRE ? - FIFO 2014
LE WEBDOC & LE WEB2.0 - C'EST QUOI LE WEB DOCUMENTAIRE ? - FIFO 2014
 
Apple Watch par Benoit Capallere et Joeffrey Bocquet
Apple Watch par Benoit Capallere et Joeffrey BocquetApple Watch par Benoit Capallere et Joeffrey Bocquet
Apple Watch par Benoit Capallere et Joeffrey Bocquet
 
INCUBE Company Profil
INCUBE Company ProfilINCUBE Company Profil
INCUBE Company Profil
 
Article IEEE
Article IEEEArticle IEEE
Article IEEE
 
La conception d'interfaces narratives
La conception d'interfaces narrativesLa conception d'interfaces narratives
La conception d'interfaces narratives
 
Au coeur d'un projet Kinect innovant
Au coeur d'un projet Kinect innovantAu coeur d'un projet Kinect innovant
Au coeur d'un projet Kinect innovant
 
Kinect en entreprise
Kinect en entrepriseKinect en entreprise
Kinect en entreprise
 
MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design MobiliteaTime #5 : Responsive & Adaptive Design
MobiliteaTime #5 : Responsive & Adaptive Design
 
HTML5/CSS3D - Expresso Rennes Atalante - 17 sept. 2013
HTML5/CSS3D - Expresso Rennes Atalante - 17 sept. 2013HTML5/CSS3D - Expresso Rennes Atalante - 17 sept. 2013
HTML5/CSS3D - Expresso Rennes Atalante - 17 sept. 2013
 
OroVibe 2017 - Déployer et gérer les applications Oro dans le Cloud - Aymeric...
OroVibe 2017 - Déployer et gérer les applications Oro dans le Cloud - Aymeric...OroVibe 2017 - Déployer et gérer les applications Oro dans le Cloud - Aymeric...
OroVibe 2017 - Déployer et gérer les applications Oro dans le Cloud - Aymeric...
 
Expresso Rennes Atalante - Html5 / Css3D - 17 sept. 2013
Expresso Rennes Atalante - Html5 / Css3D - 17 sept. 2013Expresso Rennes Atalante - Html5 / Css3D - 17 sept. 2013
Expresso Rennes Atalante - Html5 / Css3D - 17 sept. 2013
 

Plus de Flupa

Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
Flupa
 

Plus de Flupa (20)

UX Days 2019 by Flupa - Conférence : Charlotte Breton Schreiner
UX Days 2019 by Flupa - Conférence : Charlotte Breton SchreinerUX Days 2019 by Flupa - Conférence : Charlotte Breton Schreiner
UX Days 2019 by Flupa - Conférence : Charlotte Breton Schreiner
 
UX Days 2019 by Flupa - Conférence : Laure Constantinesco et Chloé Girard
UX Days 2019 by Flupa - Conférence : Laure Constantinesco et Chloé GirardUX Days 2019 by Flupa - Conférence : Laure Constantinesco et Chloé Girard
UX Days 2019 by Flupa - Conférence : Laure Constantinesco et Chloé Girard
 
UX Days 2019 by Flupa - Conférence : Patrick Maruejouls
UX Days 2019 by Flupa - Conférence : Patrick MaruejoulsUX Days 2019 by Flupa - Conférence : Patrick Maruejouls
UX Days 2019 by Flupa - Conférence : Patrick Maruejouls
 
UX Days 2019 by Flupa - Conférence : Pauline Thomas
UX Days 2019 by Flupa - Conférence : Pauline ThomasUX Days 2019 by Flupa - Conférence : Pauline Thomas
UX Days 2019 by Flupa - Conférence : Pauline Thomas
 
UX Days 2019 by Flupa - Conférence : Nicolas Duval et Dawid Woldu
UX Days 2019 by Flupa - Conférence : Nicolas Duval et Dawid WolduUX Days 2019 by Flupa - Conférence : Nicolas Duval et Dawid Woldu
UX Days 2019 by Flupa - Conférence : Nicolas Duval et Dawid Woldu
 
UX Days 2019 by Flupa - Conférence : Marc Stickdorn
UX Days 2019 by Flupa - Conférence : Marc StickdornUX Days 2019 by Flupa - Conférence : Marc Stickdorn
UX Days 2019 by Flupa - Conférence : Marc Stickdorn
 
UX Days 2019 by Flupa - Conférence : Rowan Twine
UX Days 2019 by Flupa - Conférence : Rowan TwineUX Days 2019 by Flupa - Conférence : Rowan Twine
UX Days 2019 by Flupa - Conférence : Rowan Twine
 
UX Days 2019 by Flupa - Atelier : Silvan Cabot, Amel Taïbi et Julie Plemeniti...
UX Days 2019 by Flupa - Atelier : Silvan Cabot, Amel Taïbi et Julie Plemeniti...UX Days 2019 by Flupa - Atelier : Silvan Cabot, Amel Taïbi et Julie Plemeniti...
UX Days 2019 by Flupa - Atelier : Silvan Cabot, Amel Taïbi et Julie Plemeniti...
 
UX Days 2019 by Flupa - Atelier : Nicolas Catherin
UX Days 2019 by Flupa - Atelier : Nicolas CatherinUX Days 2019 by Flupa - Atelier : Nicolas Catherin
UX Days 2019 by Flupa - Atelier : Nicolas Catherin
 
UX Days 2019 by Flupa - Conférence : Morgane Peng
UX Days 2019 by Flupa - Conférence : Morgane PengUX Days 2019 by Flupa - Conférence : Morgane Peng
UX Days 2019 by Flupa - Conférence : Morgane Peng
 
UX Days 2019 by Flupa - Conférence : Jean-Yves Rigal
UX Days 2019 by Flupa - Conférence : Jean-Yves RigalUX Days 2019 by Flupa - Conférence : Jean-Yves Rigal
UX Days 2019 by Flupa - Conférence : Jean-Yves Rigal
 
UX Days 2019 by Flupa - Atelier : Gwendoline Fradin, Marion Pillet et Elise M...
UX Days 2019 by Flupa - Atelier : Gwendoline Fradin, Marion Pillet et Elise M...UX Days 2019 by Flupa - Atelier : Gwendoline Fradin, Marion Pillet et Elise M...
UX Days 2019 by Flupa - Atelier : Gwendoline Fradin, Marion Pillet et Elise M...
 
UX Days 2019 by Flupa - Conférence : Aurélie Baton
UX Days 2019 by Flupa - Conférence : Aurélie BatonUX Days 2019 by Flupa - Conférence : Aurélie Baton
UX Days 2019 by Flupa - Conférence : Aurélie Baton
 
UX Days 2019 by Flupa - Conférence : Stéphane Maltor
UX Days 2019 by Flupa - Conférence : Stéphane MaltorUX Days 2019 by Flupa - Conférence : Stéphane Maltor
UX Days 2019 by Flupa - Conférence : Stéphane Maltor
 
UX Days 2019 by Flupa - Conférence : Emmanuelle Marévéry
UX Days 2019 by Flupa - Conférence : Emmanuelle MarévéryUX Days 2019 by Flupa - Conférence : Emmanuelle Marévéry
UX Days 2019 by Flupa - Conférence : Emmanuelle Marévéry
 
Flupa UX Days 2018 | Quentin Lefevre
Flupa UX Days 2018 | Quentin LefevreFlupa UX Days 2018 | Quentin Lefevre
Flupa UX Days 2018 | Quentin Lefevre
 
Flupa UX Days 2018 | Nadège Bide
Flupa UX Days 2018 | Nadège BideFlupa UX Days 2018 | Nadège Bide
Flupa UX Days 2018 | Nadège Bide
 
Flupa UX Days 2018 | Jidé Tidjani-Serpos
Flupa UX Days 2018 | Jidé Tidjani-SerposFlupa UX Days 2018 | Jidé Tidjani-Serpos
Flupa UX Days 2018 | Jidé Tidjani-Serpos
 
Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
Flupa UX Days 2018 | Sara Wachter-Boettcher (EN)
 
Flupa UX Days 2018 | Anthony Adam
Flupa UX Days 2018 | Anthony AdamFlupa UX Days 2018 | Anthony Adam
Flupa UX Days 2018 | Anthony Adam
 

UX Days 2019 by Flupa - Conférence : Alexia Buclet

  • 1. Conception d’Interfaces Immersives pour la VR/AR : Découverte d’un Cas Pratique Alexia Buclet Design Ops Director & UX Designer Minsar.app @AlexiaBuclet 21/06/2019
  • 2. Continuité avec l’année dernière… ➢ “L’UX Design dans les Nouvelles Technologies” ➢ Réalité Virtuelle, Augmentée et “Mixte” Alexia Buclet © Magic Leap
  • 3. ➢ Anciennement Minsight, logiciel de création d’expériences en AR/VR : directement dans l’appareil en WYSIWYG et sans compétence en développement. Minsar Alexia Buclet Bêta :
  • 4. L’UX Design en VR/AR Alexia Buclet
  • 5. UX Design à 360° ➢ Affichage autour de l’utilisateur ➢ Champ de vision = écran en mouvement ➢ Adapter l’interface au contexte Alexia Buclet 60° 20° 12° 40° 47°47° 77° 77° 102°102°
  • 6. UX Design en 3D ➢ Une nouvelle dimension : la profondeur ➢ Distance à l’utilisateur : confort et lisibilité ➢ Distance entre les éléments ➢ Différents espaces d’affichage Alexia Buclet 20m : limite perception du relief 0.5m 1.5m : popup 2-3m : menu10m : limite perception forte du relief
  • 7. UX Design immersif ➢ Casques AR/VR : interface affichée dans un monde immersif (virtuel ou physique) ➢ Respecter les règles de la physique… ➢ … Tout en proposant des interactions magiques ➢ Guider l’utilisateur Alexia Buclet
  • 8. UX Design immersif ➢ Casques AR/VR : interface affichée dans un monde immersif (virtuel ou physique) ➢ Limiter la fatigue physique ➢ Prendre en compte l’infinité de positionnement de l’utilisateur ➢ Respecter l’espace personnel Alexia Buclet
  • 9. UX Design dans un monde dynamique ➢ Prendre en compte l’environnement (virtuel ou physique) ➢ Eviter les conflits possibles ➢ Intégrer les éléments ➢ Adapter selon les évolutions possibles et du contexte Alexia Buclet
  • 10. Un cas pratique : l’import Alexia Buclet
  • 11. Importer des fichiers 1. Choisir l’élément 2. Le télécharger 3. Placer l’élément dans l’espace de travail Alexia Buclet
  • 12. 2D : l’exemple de PowerPoint ➢ 2 cas possibles en important une image : ➢ Image plus petite que la diapositive ➢ Image plus grande que la diapositive ➢ Choix des designers : ➢ Utiliser la taille d’origine ➢ Si trop grande : s’adapte à la taille de la diapo ➢ Si la taille de la diapo est modifiée : choix à l’utilisateur Alexia Buclet
  • 13. En VR/AR ➢ Importer l’élément devant l’utilisateur à une distance confortable. Alexia Buclet
  • 14. Mouvement de l’utilisateur ➢ Mais si l’utilisateur tourne la tête au moment de l’import ? Alexia Buclet
  • 15. Taille de l’élément ➢ Mais si l’élément importé est très grand ? Alexia Buclet
  • 16. Taille de l’élément ➢ Mais si l’élément importé est très petit ? Alexia Buclet
  • 17. Environnement ➢ Mais s’il y a un mur devant l’utilisateur ? Alexia Buclet
  • 18. Déplacement de l’utilisateur ➢ Mais si le chargement prend un peu de temps… et l’utilisateur se déplace ? Alexia Buclet
  • 19. Attention de l’utilisateur ➢ Mais si le chargement prend un peu de temps… et qu’il y a une erreur ? Alexia Buclet
  • 20. Exemples de problèmes concrets Alexia Buclet
  • 21. Pour vous aider ➢ Utilisez le monde physique pour concevoir le virtuel immersif : ➢ Concevez en immersion. ➢ Faites des Proofs of Concept pour itérer facilement. Alexia Buclet Objets physiques Un mètre
  • 22. Les challenges des interfaces immersives Alexia Buclet
  • 23. ➢ Avec une dimension en plus et les appareils immersifs actuels arrive une multitude de nouveaux challenges à relever ! Alexia Buclet
  • 24. ➢ Ces challenges ne doivent pas se reporter sur l’utilisateur, mais sur l’équipe de conception/développement : ➢ Adaptez votre manière de penser et vos outils. ➢ Soyez attentifs aux choix pris dans les expériences que vous essayez. ➢ Apprenez des autres métiers déjà spécialisés en 3D. Alexia Buclet