EN

Réalités Parallèles

Ergonomie et conception de jeu vidéo

Conférence sur le design émotionnel

  1. Qu’est ce que le design émotionnel dans la conception web?
  2. Utiliser la communication non verbale
  3. Le pictogramme pour communiquer à toutes les cultures
  4. La beauté dans le design émotionnel
  5. L’utilisation de l’humour
  6. En conclusion

L’auteur d’ergophile, Jacinthe Busson, a réalisé lors du Flupa UX Day 2014 une conférence portant sur le design émotionnel, dont une version plus détaillée est disponible à l’adresse suivante : www.designemotionnel.fr

Image blague. Une interface, c'est comme une blague: s'il faut l'expliquer, c'est qu'elle est pas bonne.

Riche en exemples, elle nous fait voyager de la poivrière à Air B&B, en passant par des campagnes de pub Snickers, et des manifestations virtuelles, l’utilisation internationale de pictogrammes et des bornes SNCF.

Bonne (re)découverte

Qu’est ce que le design émotionnel dans la conception web?

Les arts plastiques sont une expression personnelle à but artistique. Les arts appliqués au contrainte visent à concevoir un produit à vocation utilitaire grand public. Un designer est formé à la conception d’objets, au stylisme, au packaging, et au graphisme. Un web designer fait de l’art appliqué, dont les productions ont vocation à répondre au besoin d’autrui.

La poivrière a ainsi évolué : d’abord en bois, grande, sa taille s’est réduite progressivement, puis a adopté un style plus “fun” par exemple en forme de poules.

L’interface de Deezer a évolué de même: d’une liste fonctionnelle de titres dans un player, il est passé par flash, par une application mobile, pour revenir au html avec une mise en avant progressive de l’artiste.

Le design émotionnel pousse l’adaptation de la conception aux technologies, à celle des usages et de l’affection: une mascotte, vécue au quotidien remplace l’interaction avec les objets.

Utiliser la communication non verbale

L’humain a six émotions de base, dont une neutre et une positive. Une seule critique négative vous travaille plus que 30 revues positives. D’autant que le client satisfait se manifeste peu, là où celui qui râle est bruyant. Lorsque l’interface de Deezer est passé à un fond blanc plutôt que noir, l’équipe a reçu des dizaines de mails, contenant des bannières de manifestation virtuelles. En répondant “merci pour le feedback constructif, veuillez préciser”, les internautes se sont excusés et ont précisé que ce n’était pas le noir qui gênait, mais un problème de compréhension ou de fonctionnalité cachée. Le contact humain a facilité la relation entre le marque en adoucissant les échanges, lorsque les utilisateurs se sont rendus compte de la présence d’humains réels derrière la messagerie.

La publicité utilise les expressions faciales pour communiquer de façon non verbale. Dans le web, cette approche fonctionne également. ex:

La mise en avant de l’humain par Highrise passe par l’affichage d’ l’utilisateur satisfait. Par du test AB, la présentation de leur CRM retenue a amélioré les taux d’inscriptions.

Le pictogramme pour communiquer à toutes les cultures

La représentation des expressions faciales par des pictogrammes permet de parler à tout le monde. Des icônes play, stop, pause reflètent bien le fonctionnement des trois pédales de votre voiture. Le symbole WC est repris dans toutes las gares et aéroports.

Pédales de voiture avec des icones en relief rapellant ce qu'elles font.

Sur cette base, des applications ont été réalisées avec succès.

Screenshot d'une appli mobile utilisant les gestes pour indiquer son humeur.

Mr Mood propose d’enregistrer via des visuels son humeur quotidienne. Le concept a tellement plu qu’il a été rapidement cloné, donnant naissance à l’application chinoise Miss Diary. Le fait est que cela a fonctionné même à l’autre bout du monde.

Le concept peut être utilisé sur des bornes SNCF, comme échelle de réponse à un questionnaire de satisfaction. 4 boutons avec des smileys permettaient de donner sa satisfaction. L’alternative avec un bouton :) et un bouton QRCode pour les mécontents a moins bien marché.

Photo de bornes permettant de dire si l'on est content ou requérant un processus compliqué pour expliquer pourquoi on ne l'est pas.

La beauté dans le design émotionnel

L’acheteur fait son choix dans les 90 premières secondes de sa visite en agence immobilière, il en va de même sur internet. Le beau donne l’impression d’utilisabilité. Un design clair et épuré, bien présenté est bien plus efficace pour vendre qu’un fond bleu blanc rouge sur les annonces pendant la coupe du monde.

On entend souvent : non mais ma fille, elle touche a Photoshop elle va me le faire. Erreur de laisser un aspect aussi important de la perception dans les mains de quelqu’un qui maitrise certainement l’outil, mais pas la conception.

L’interactivité contribue également au design émotionnel.

La prise de position personnelle vis à vis de produits ou informations engage l’utilisateur. Sur l’Iphone, les applications semblent trembler de peur qu’on les supprime, lorsqu’on veut les éditer. Le Gif animé revient à la mode, car il rend les images vivantes. (flux machine, photo loop a day). Imaginez l’affiche de vos films animés de la sorte: elles seraient bien plus diversifiées et impactantes.

L’utilisation de l’humour

“Femme qui rit est à moitié dans son….”

Le ton et la voix avec laquelle on s’adresse aux utilisateurs jour beaucoup sur l’appréciation d’une marque. Nombre de consommateurs préfèrent les produits monoprix à cause de leur petite blagues, distrayant l’attention du prix et en faisant un critère numéro 2. Des accroches et descriptions décalées lors de mise à jour d’applications permettent de retenir l’attention. Fnac et Spotify ont ainsi utilisé le modèle de la vente de voiture pour vanter leurs nouvelles fonctionnalités, ou ajouté une feature complètement fictive pour le fun.

Le questionnaire de satisfaction sur le site d’annonces d’emploi azerty, propose des réponses au ton décalé qui rendent le questionnaire moins rébarbatif.

BeMyApp annonce immédiatement l’ambiance de son évènement de programmation dans le formulaire d’inscription. Ce dernier affiche clairement dans la sélection de profil que l’on peut venir en tant que codeur fou et passionné, comme en tant que pantouflard curieux.

Des messages plus informels lors des erreurs et des succès (changement de mot de passe) rendent l’usage plus fun et dynamique, en donnant de la personnalité à l’interface. “vous n’êtes plus abonné à wix, mais vous restez les bienvenus si vous voulez repasser plus tard” est bien plus encourageant à revenir que ‘Votre désinscription a bien été prise en compte”. Capitaine train l’a bien compris : sa proposition: acheter un billet de train comme on irait chez son boulanger préféré.

En conclusion

Sur internet comme dans la vraie vie: si on n’a pas le sens de l’accueil, il ne faut pas travailler dans la restauration. On ne vous reprochera jamais d’être sympatique.

Posté par Cornelia le 2015-02-05. Dernière mise à jour le 2020-12-21

Articles sur des sujets connexes

Etude de cas d’une vente et réalisation d’un projet B2B

Ergonomie web, Conference FLUPA,

Companion apps - l’innovation en marche

Ergonomie web, Conference FLUPA,

L’ux sans documentation

Ergonomie web, Conference FLUPA,

Pourquoi l’ux design va s’éteindre en france et heureusement pour nous

Ergonomie web, Conference FLUPA,

UX économie circulaire

Ergonomie web, Conference FLUPA,

UX Lean et Agile

Ergonomie web, Conference FLUPA,