Conférence sur le design émotionnel
- Qu’est ce que le design émotionnel dans la conception web?
- Utiliser la communication non verbale
- Le pictogramme pour communiquer à toutes les cultures
- La beauté dans le design émotionnel
- L’utilisation de l’humour
- 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
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:
- Snickers: on n’est pas le même quand on a faim
- Pédigréé: tel maitre, tel chien.
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.
- Air B&B met en avant par son accroche l’aspect humain “Bienvenue à la maison” focalise sur le relationnel et le bénéfice de l’utilisateur s’il se sert du service.
- Spotify affiche son motto “musique pour tous” par des visuels de tout type d’utilisateurs qui écoutent de la musique.
- über propose de réserver des taxis, mais son slogan est “partager vos expériences” pour mettre en avant le côté plus humain des services proposés. L’ajout de relationnel humain passe également par les chat en ligne. Le live chat améliore le ressenti et facilite les achats en rassurant les utilisateurs.
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.
Sur cette base, des applications ont été réalisées avec succès.
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é.
La beauté dans le design émotionnel
- 52% des gens ne reviennent pas sur un site à cause de son design
- 92% des utilisateurs achètent si un produit est beau
- 42% des utilisateurs fondent leur opinion sur la conception globale Ce qui est plus beau fait plus envie, on le voit bien avec les productions de captain choco – michalak. Au japon les mamans ont bien compris ça depuis longtemps, et leurs bentô sont toujours ludiques et bien présentés.
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.
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,