Sélectionner une page

Troisième épisode de notre série sur la dernière édition Flupa UX Days 19, avec notre équipe de designers et PO qui a pu suivre l’ensemble des conférences : Nadège BIDE, Guillaume MARGUET, Jolanta USCILAITYTE, Leila MAILLOT, Franck BUSCAJA, Louise GAZEAU

Les méthodes décrites dans cette série, nous les mettons en œuvre au quotidien chez VNEXT et sommes ravis de partager avec vous notre synthèse.

 

“Evolution of design system. Closing the gap between design and production”

par Nicolas Duval et Dawid Woldu

Vidéo de la présentation ici : https://www.youtube.com/watch?v=VY94rpU1jtU&list=PLIgLhmTe1f7LH0Q3MXCLTUbIaGsZjvExs&index=2

Nicolas Duval et Dawid Woldu, tous deux UX Designers au sein de BlaBlaCar, nous ont présenté lors de cette conférence le Design System de l’entreprise et pourquoi ils ont décidé de le créer. 

Le design system est à la fois la charte des composants ergonomiques et graphiques d’une interface et un ensemble de bonnes pratiques, permettant de faire le lien entre la conception et le développement pour assurer l’homogénéité d’un produit numérique (ou entre plusieurs) sur le long terme. Tous les « pure players » en ont un (Airbnb, Spotify, Google…), les Grands Groupes s’y mettent aussi.

Nicolas nous a tout d’abord présenté la méthodologie BlaBlaCar : 

 

Découvrir, définir, développer, livrer, livrer « pour de vrai », mesurer.

La difficulté était de garder une haute qualité pendant tout le processus. Avant la construction du Design System, il n’y avait aucun document de référence pour les designers ou pour les développeurs.

Nicolas donne l’exemple du Template des e-mails. Lorsque l’équipe souhaitait changer ou créer un nouveau type d’e-mail à envoyer aux utilisateurs, il fallait recommencer depuis le début. En fonction de l’appareil, du support (Android, Apple, PC…), les templates d’e-mail étaient complétement différents. L’utilisateur était perdu.

Créer un Design System fut donc une réelle évidence pour l’équipe Bla Bla Car. Nicolas nous donne l’exemple de la construction d’un bateau. Deux personnes le construisent, avec la même quantité et les mêmes pièces. Seule différence : l’un possède la notice de construction (charte), l’autre non : 

L’exemple parle de lui-même : l’un des principaux objectifs du Design System est de standardiser les bases en découpant les éléments, pour ainsi les réutiliser indépendamment (Manière Atomic Design), et donc à être beaucoup plus performant et rapide.

Une autre action fut de définir des « patterns » d’expérience. Ainsi, les équipes peuvent être plus indépendantes et cela les aide à prendre des décisions.

Exemple pour répondre à une question du type : dois-je envoyer un mail à cet utilisateur ? La réponse est un arbre décisionnel qui permet à l’équipe de trouver la solution seule, sans être bloquée.

La deuxième partie de la conférence était une présentation de différents outils très puissants permettant d’appliquer le Design System. David nous a fait une démonstration sur Framer ainsi que sur Origami Studio, et il l’affirme : cela permet à l’équipe BlaBlaCar d’être beaucoup plus performant. 

Ils s’en sont rendus compte notamment lors de tests utilisateurs avec Sketch. L’utilisateur était frustré de ne pas pouvoir interagir avec la carte, pour zoomer ou se déplacer par exemple. Il fallait donc trouver un autre outil qui permette une visualisation plus réelle de l’expérience que l’équipe souhaitait donner à l’utilisateur. Origami, outil de prototypage désigné par Facebook, permet d’intégrer des interactions avec l’interface plus poussées dont la cartographie (utilisation de l’API de Google Maps) et fonctionne avec React.

Après cette démonstration, Nicolas et Dawid ont conclu avec un précieux conseil :

« Get designers close with developpers »

Que ce soit par rapport aux outils ou à la méthodologie utilisée, les designers et les développeurs se doivent de travailler ensemble, surtout lors de la conception de Design System.

 

“Conception d’interfaces immersives pour la réalité virtuelle et augmentée : découverte d’un cas pratique

par Alexia Buclet, Design Ops director & UX Designer (Minsar by Opuscope)

Vidéo de la présentation ici : https://www.youtube.com/watch?v=_CjFJPJ_BJM&list=PLIgLhmTe1f7LH0Q3MXCLTUbIaGsZjvExs&index=3

Intéressée par la psychologie et les nouvelles technologies depuis l’enfance, Alexia est devenue psychologue cognitiviste et UX Designer il y a bientôt 10 ans.

Lors de sa conférence, Alexia nous parle d’UX Design dans les nouvelles technologies. Elle se pose plusieurs questions sur la conception d’Interfaces Homme-Machine qui impliquent plusieurs problématiques : où placer les éléments sur l’écran pour que l’utilisateur puisse interagir avec de manière optimale ? Quelle quantité d’informations devons-nous afficher ? Où ? Quand ? Etc.

Elle présente UX Design à 360° en trois grandes parties : affichage autour de l’utilisateur, champ de vision = écran en mouvement et adaptation de l’interface au contexte. Il y a peu de temps une nouvelle dimension s’ajoute : la profondeur qui ajoute un sentiment de confort et de lisibilité, distance entre les éléments et différentes espaces d’affichage.

A travers un cas pratique Alexia aborde différentes problématiques des interfaces et paramètres. Dans ces projets immersifs, elle nous conseille de ne pas oublier de respecter des règles physiques (l’espace personnel, la fatigue physique, prendre en compte l’infinité de positionnement) tout en proposant des interactions magiques et sans oublier de guider l’utilisateur.

En ce qui concerne l’environnement virtuel ou physique, elle recommande d’éviter les conflits possibles, d’intégrer les éléments et de s’adapter aux évolutions possibles du contexte.

Dans son cas elle aborde le sujet d’import et les exemples des problématiques rencontrées. 

Avec une dimension en plus et les appareils immersifs actuels arrivent une multitude de nouveaux challenges à relever !

Pour nous aider, elle propose d’utiliser le monde physique pour concevoir le virtuel immersif et d’apprendre des autres métiers déjà spécialisés en 3D.

 

 

“Design Génératif : les algorithmes de la création”

par Yohan Founs (@founsy)

Vidéo de la présentation ici : https://www.youtube.com/watch?v=_CjFJPJ_BJM&list=PLIgLhmTe1f7LH0Q3MXCLTUbIaGsZjvExs&index=3 

Aujourd’hui on se pose souvent la question : l’IA annoncera-t-elle la fin du métier de créatif ou de designer ? Est-ce que, dans le futur, les IA concevront les systèmes à la place des humains, pour des humains ?

Yohan Founs nous fait un état de l’art et nous propose une réflexion sur le « design génératif », son potentiel, son impact, et ses dangers.

Il constate que les IA peuvent également copier ou recréer le style des créatifs…

Par exemple, un morceau des Beatles a été généré à l’aide d’une IA. Elle a en effet récupéré tous les disques, les a exploités et a été capable de générer un morceau des Beatles qui n’a jamais existé. Peut-être un jour on pourra-t-on écouter de nouvelles chansons de Michael Jackson… Qui sait ? 😊 

… Elles ouvrent le champ à de nouveaux domaines créatifs …

Avec l‘IA, les œuvres deviennent paramétrables. 

Yohan Founs nous présente le projet d’ADOBE SENSEI qui pourra implémenter de nouvelles fonctionnalités à l’aide l‘IA au sein des différents outils Adobe. Ceci facilitera (ou pas) l’étape de la création.  

 

 

“OK Google, dis Siri, Alexa : comment designer une expérience pour assistant vocal”

par Stéphane Maltor, La Haute Société

Vidéo de la présentation ici : https://www.youtube.com/watch?v=9RZiNreHf5c&list=PLIgLhmTe1f7LH0Q3MXCLTUbIaGsZjvExs&index=5

Stéphane commence sa conférence avec l’histoire des assistants vocaux. On peut considèrer que la première Voice User Interface (VUI) fut Audrey, créée au Bell Lab en 1952. Cette machine pouvait effectivement reconnaître des chiffres énoncés dans un micro.

Les statistiques montrent que les assistants vocaux sont utilisés à 52% dans le salon, 25% dans la cuisine et enfin 22% dans la chambre. La majorité des requêtes concerne la météo, des questions générales ou mettre de la musique. On est donc loin des attentes et des fantasmes générés par ces assistants vocaux. Stéphane parle alors d’une « désillusion », l’appétence initiale serait en train de chuter.

Stéphane nous partage ses conseils pour designer une expérience d’assistant vocal :

  1. Se poser 4 questions avant de se lancer dans la conception de VUI :
    • Est-elle intuitive ?
    • Permet à l’utilisateur de se mettre en mode multitâche ?
    • Épargne-t-elle plus de temps qu’une interface écran ?
    • Permet à l’utilisateur de parler librement ? 

 

  1. Intégrer la théorie de Grice. Celle-ci se découpe en quatre maximes :
  • Maxime de quantité : la durée des silences doit être un peu longue mais pas trop
  • Maxime de qualité : la vérité  rien que le vérité
  • Maxime de relation : soyez pertinent
  • Maxime de manière : pas d’ambiguïté
  1. Prendre conscience de la technique requise pour concevoir des VUI. Il faut que le temps de réponse ne dépasse pas 5 secondes pour ne pas être gênant ou impatienter l’utilisateur.  

  1. Stéphane note qu’il faut aussi de la diversité dans les réponses de l’assistant vocal. Avec l’exemple de Siri lorsque nous demandons l’heure :

A la fin de sa conférence, Stéphane parle des questions d’éthiques concernant les assistants vocaux. 63% des utilisateurs réguliers d’enceintes et des non-utilisateurs estiment qu’elles peuvent constituer une menace. A noter que Google scanne déjà les e-mails…(myaccount.google.com/purchases )

 

Lire ou relire l’épisode 2 : https://www.vnext-group.com/2019/07/18/ux-design-series-by-vnext-flupa-ux-days-19-ep2-impact-de-lux-designer-dans-la-transformation-la-production-digitale/

Lire ou relire l’épisode 1https://www.vnext-group.com/2019/07/09/ux-design-series-by-vnext-ep1/