Blog

Avouez-le, pendant les périodes de soldes, on aime traîner dans les magasins pour choisir quelle paire de chaussures suivra avec notre nouveau pull ! Mais contrairement à un client qui se rend en magasin, le client qui achète en ligne désire une chose : ne pas passer 3 heures à choisir le produit qui lui convient ! 

Pour l’e-commerce, les pages produits sont donc essentielles à la réussite d’un site. Il s’agit des pages où le client va prendre la décision d’acheter ou non. Pour ce faire, il faut satisfaire ses clients en leur apportant toutes les informations dont ils ont besoin. La précision est de rigueur !

Voici quelques conseils à mettre en place pour présenter avec précision vos produits et ainsi ne pas perdre vos clients :

1/ Les éléments nécessaires sur une page produit 

Pour inciter le client à acheter sur votre site e-commerce, il est important de faire les choses bien ! Et pour ça, il y a certains Must Have à ne surtout pas négliger car il s’agit des éléments de base à faire figurer sur vos pages produits : le nom du produit et une image descriptive. Il est important aussi que le client puisse effectuer un zoom sur l’image en question. Veillez à fournir toutes les options nécessaires comme la couleur, la taille et la disponibilité du produit. Le client doit également pouvoir ajouter ses articles au panier de manière rapide et facile. En bref, une description concise et claire du produit !

Deux autres catégories d’éléments peuvent également apparaître sur vos pages produits : les éléments dits « agréables à avoir » (Nice to Have), et les éléments dits plus « sophistiqués » (Fancy Features). Pour mieux comprendre à quoi correspondent ces éléments, voici un tableau récapitulatif :

Comme dit précédemment, les éléments nécessaires sur une page produit doivent être organisées correctement. Et c’est cette hiérarchisation qui permet de convertir plus ! Vous pouvez d’ailleurs consulter notre étude de cas sur Electrodepot.fr 😉

2/ Anticiper et répondre aux questions des clients

Il est essentiel de ne pas négliger les interrogations des utilisateurs. De nombreux sites, qui n’offrent pas assez d’informations, laissent filer leurs clients et donc de potentielles opportunités d’achat. C’est pas malin ça ! Ce manque d’informations peut également amener un client à retourner son produit. Pour empêcher cela, c’est simple : efficacité et précision. Un utilisateur doit être en mesure de savoir comment s’utilise le produit, à quoi il ressemble, quelles sont ses fonctionnalités. En d’autres termes, il faut aller droit au but. Rappelez-vous que le client en ligne n’a pas de temps à perdre.

Prenons l’exemple d’Apple qui anticipe les potentielles questions qu’un utilisateur pourrait se poser lorsqu’il s’apprête à acheter le tout nouvel Iphone 11 !

3/ Donner la possibilité aux clients de comparer les produits

Certains sites varient l’affichage des informations ou la conception des pages, ce qui oblige les utilisateurs à prendre du temps pour chercher l’information dont ils ont besoin. Ce n’est pas la chose à faire ! En effet, les utilisateurs ont tendance à vouloir comparer le produit qui les intéresse avec un autre du site. Pour cela, il est important que pour chaque produit du site, on retrouve les détails similaires pour toutes les marques et tous les modèles. Garder une cohérence et logique dans la répartition des informations ! 

[youtube width= »70% »]https://www.youtube.com/watch?v=wlpiZClmwmM&feature=youtu.be[/youtube]

4/ Apporter aux clients des retours d’expérience

Même si les descriptions de vos produits se veulent les plus complètes possible, un utilisateur demandera toujours des retours d’expérience. Pour ça, les commentaires sont nos amis ! Ils constituent aux yeux de l’utilisateur des critiques solides, et provenant d’autres clients ou experts, ils lui apportent des informations supplémentaires. L’utilisateur peut alors se faire une idée de l’utilisation du produit ou encore de sa qualité. Toutefois, il est important de filtrer ces avis afin de distinguer clairement les avis positifs des avis négatifs.

Et même les critiques négatives ont leur importance. Elles permettent à l’utilisateur de se faire son propre avis, d’autant plus que bien souvent, les critiques positives l’emportent sur les négatives. Il n’est donc pas nécessaire de les cacher !

5/ Faciliter le processus d’achat

La dernière étape du processus d’achat est l’ajout des articles au panier. Et beaucoup d’utilisateurs rencontrent des difficultés lors de cette étape : un panier vide alors que vous pensiez qu’il était rempli, des articles en double, etc. La meilleure solution pour éviter ces problèmes est d’afficher une fenêtre pour avertir l’utilisateur que l’article a bien été ajouté à son panier. 

En bref, les pages produits sont les pages à réussir ! Elles sont les pages sur lesquelles les utilisateurs vont décider ou non d’acheter le produit qui répond à leur besoin.

Ces best-practices sont applicables, bien évidemment, pour l’ensemble des sites e-commerce, mais il est tout de même important de penser à se distinguer ! Pour en savoir plus, vous pouvez consulter notre article suivant : Tous les sites de ecommerce doivent-ils nécessairement se ressembler ?

Via Nielsen Norman Group, UX Guidelines for Ecommerce Product Pages.

Les designers ont pour mission de rendre les interfaces accessibles à tous les utilisateurs, c’est-à-dire de prendre en compte les besoins de chaque personne. Mais attention, méfiance ! Il existe de nombreux mythes concernant le contraste des couleurs, mythes perpétués par des personnes souvent mal-informées. On va alors rectifier le tir, et mettre fin à tout ces “on-dit”!

1/ Les exigences du WCAG sont toujours optimales

Le WCAG (Les Règles pour l’accessibilité des contenus Web) présente des règles à suivre afin de rendre les contenus Web plus accessibles, comme par exemple pour les personnes en situation de handicap. Toutefois, on trouve parmi ces règles à suivre une petite coquille ! Il s’agit du cas où se trouve un texte blanc et un texte noir sur un bouton de couleur. La majorité des utilisateurs diront que le texte blanc est plus facile à lire, mais en réalité c’est faux, les rapports de contraste le disent !

2/ Le texte doit répondre à l’exigence du AAA, sinon il est inaccessible

Le WCAG, repris par le RGAA (Référentiel Général d’Accessibilité pour les Administrations), définit 3 niveaux d’accessibilité. Beaucoup de gens estiment que le texte doit être conforme au niveau le plus élevé (AAA), mais en réalité ce n’est pas le cas ! Ce troisième niveau s’applique à un groupe d’utilisateurs restreints :  ceux qui ont une perte de vision importante, comme par exemple les personnes âgées, ce qui n’est donc pas le cas de l’ensemble des utilisateurs. Et si l’on regarde de plus près, le WCAG recommande de ne pas satisfaire toutes les exigences de l’AAA car il n’est tout simplement pas possible de le faire !

3/ Les composants de l’interface ont le même rapport de contraste que le texte

Une erreur de plus : mettre les composants d’une interface au même niveau de contraste que le texte ! Eh non, détrompez-vous, ces niveaux de contraste doivent être différents.

Le texte nécessite un contraste plus élevé afin de faciliter et de rendre plus agréable la lecture des utilisateurs. En effet, de nombreuses nuances affectent le contraste du texte, comme la taille ou la graisse de la police.

4/ Le texte et les boutons gris sont inaccessibles et semblent désactivés

De nombreux utilisateurs pensent que le texte gris n’est pas lisible. Parfois c’est vrai, mais pas toujours ! Si l’on regarde le bouton ci-dessous, vous pourrez voir, grâce à un vérificateur de contraste, que le texte gris est bel et bien conforme à la norme AA.

5/ Les daltoniens ne savent pas faire la différence entre les couleurs contrastées

Il existe un mythe selon lequel si un designer utilise le contraste des couleurs pour transmettre des informations, alors les utilisateurs daltoniens ne remarqueront pas la différence. FAUX ! Ces utilisateurs n’ont pas de difficultés à percevoir les différences de contraste, mais les teintes de couleurs (vous pouvez aller jeter un oeil à notre article dédié au daltonisme). Grâce à un simulateur de daltonisme, on peut voir que ce type d’utilisateur perçoit clairement s’il s’agit du rouge ou du vert.

6/ L’utilisation d’un repère de couleur ne suffit pas à transmettre l’information

Détrompez vous, indiquer à vos utilisateurs une information par une couleur ne suffit pas ! Une des règles d’accessibilité stipule que la couleur ne doit pas être utilisée comme seul moyen visuel pour transmettre une information. Eh oui, mettez-vous par exemple dans la peau d’une personne ayant une déficience de la vision. Si vous choisissez d’afficher l’état actif d’un bouton ou d’un champ par la couleur rouge, une personne daltonienne ne sera pas capable de le voir. Il est alors important d’ajouter un repère supplémentaire comme du texte ou une icône.

7/ Une interface accessible répond aux besoins de TOUS les utilisateurs

C’est évident, en tant que designer on aimerait bien rendre tous nos utilisateurs heureux et satisfaits ! Toutefois, il est impossible de pouvoir répondre aux exigences et aux besoins de l’ensemble des utilisateurs dans la mesure où il y a toujours quelques personnes qui trouveront votre design gênant à leurs yeux. Vouloir atteindre un idéal pour tout le monde est illusoire ! Il faut tout simplement se concentrer sur une majorité d’utilisateurs mais pas sur tous.

L’accessibilité doit toujours être une priorité lors de la conception d’interfaces. Et pour aider les designers à concevoir ces interfaces de manière la plus optimisée possible, les lignes directrices du WCAG (Web Content Accessibility Guidelines) sont des outils essentiels !

Cet outil, tout comme le RGAA, ne sont pas à l’origine de ces « on-dit », ils sont le fait de personnes qui les interprètent mal, les déforment et en font un mauvais usage. Il est temps de mettre fin à ces mythes pour produire des interfaces qui satisferont la majorité des utilisateurs !

Via UX Movement, The Myths of Color Contrast Accessibility

Voilà un projet, dont on est bien fier avec toute l’équipe MARKOPOLO, notre nouvelle agence partenaire ! Une application à destination des personnes en difficulté avec le numérique. Créée de toute pièce en 3 semaines, elle a requis la participation de plus de 8 professionnels de l’innovation et a d’ores et déjà permis à plusieurs centaines de bordelais d’accéder via le numérique à des services d’aide municipaux et de loisirs, grâce à leur smartphone. Je vous explique en détail :

Comment concevoir dans l’urgence une nouvelle application ?

Pour la plupart d’entre nous, l’utilisation des outils numériques va de soi, nos sites ou appli préférés nous facilitent la vie de tous les jours. Au point qu’on se demande parfois comment on faisait “avant”…

Et pourtant, 20% de la population n’est pas utilisatrice du numérique selon une étude récente de Bordeaux Métropole. Et 40% parmi les bénéficiaires de l’action sociale sont de fait “éloignés” du numérique.

Alors que l’immense majorité d’entre eux ont un smartphone avec une connexion internet, ils n’utilisent pas aujourd’hui les services numériques. Par difficulté à comprendre le français, à appréhender les outils, par rejet ou crainte de la technologie…

Cette inégalité d’accès contribue à amplifier les difficultés de populations déjà fragilisées, et s’est révélée avec une violence particulière dans le contexte de la crise du Covid et du confinement.

Face à ce constat plusieurs associations Bordelaises, aidées de la Mairie de Bordeaux et Bordeaux Métropole, ont décidé d’agir. L’idée : créer une application qui facilite la vie des personnes éloignées du numérique, en leur simplifiant l’accès aux principaux services numériques.

Markopolo, une agence d’aide à l’innovation, de l’idée au projet

Dans ce cadre, c’est notre agence partenaire, Markopolo, qui a été sollicitée pour accompagner les équipes et mener à bien le projet.

Pour cela nous avons mis en oeuvre la solution méthodologie POCFab :

• Diagnostic : établir un état de la situation et identifier les principaux freins et obstacles, définir la problématique, constituer l’équipe projet et caler le calendrier
• Co-conception: ateliers collaboratifs associant “Design Sprint” et “Lean Startup” pour analyser la problématique, imaginer et co-concevoir une solution en équipe
• Prototypage : concrétiser la solution imaginée pour pouvoir la tester auprès des utilisateurs
• Evaluation : test du prototype auprès des utilisateurs pour identifier les points d’amélioration et adapter la solution
  

Le résultat prend en compte toutes les contraintes d’un public cible en difficulté

Résultat : l’application TINKIET, une pwa (Progressive Web App) a été co-conçue et développée en moins de 3 semaines.

Les principales caractéristiques de l’application TINKIET :

• Aide à la recherche/navigation via des entrées directes par “besoin”
• Interface ultra simple et intuitive pour une compréhension immédiate du contenu
• Assistance vocale pour confirmer les choix de navigation
• Traduction en 9 langues disponibles
• Personnalisation de certains contenus sans avoir à créer de compte
• Curation de contenu : sélection de 3 à 6 applications/outils “cibles” par catégorie

Ceci est une première version “expérimentale” amenée à évoluer et à s’enrichir. Elle couvre aujourd’hui 7 catégories de service : “Manger”, “Me soigner”, “Discuter”, “S’amuser”, “Ma journée”, “Mes informations”, et “Besoin d’aide”.

Une démonstration des capacités de notre agence partenaire

Tinkiet est un projet mené de bout en bout par notre agence partenaire Markopolo, et démontre notre capacité, non seulement, à prendre en main rapidement une problématique donnée et lui apporter une réponse tout aussi rapide. Mais aussi et surtout à valider nos méthodologies créatives et collaboratives, dont le but est d’assurer la création de produits en adéquation avec un besoin. Tinkiet n’est pas une killer app, mais elle résoud un réel problème de terrain et transforme un problème en solution. N’hésitez pas à nous solliciter pour vous aider à dépasser le stade de l’idée des nombreux projets qui restent dans vos cartons.

Tinkiet vu par la presse

Pour découvrir le projet en images :

Allez, aujourd’hui on remet une couche sur l’accessibilité… mais pas que !  Comme je le dis souvent, l’accessibilité est un véritable enjeu pour les entreprises, car, encore aujourd’hui, beaucoup d’utilisateurs éprouvent de grandes difficultés d’accès à leurs sites. Et cela, souvent est dû à leur esthétique. 

Pour faire TRÈS bref, plus une interface est accessible, moins elle sera visuellement esthétique, et inversement, plus une interface est esthétique, moins elle sera accessible pour ses utilisateurs.

Qui satisfaire ? Et comment le faire ? 

• Parmi les utilisateurs qui ont une vision défaillante, une majorité d’entre eux n’a pas de déficiences visuelles extrêmes. Il est, dans ce cas là, préférable de satisfaire le plus d’utilisateurs possible et donc de privilégier un design équilibré ! 

• Mais, dans tous les cas, il faut trouver un compromis acceptable en fonction de votre population cible. Si l’interface se veut, par exemple, très esthétique, pour des raisons purement marketing, veillez à fournir un mode de contraste élevé qui permet aux utilisateurs d’améliorer la lisibilité du texte et des autres éléments du site. Apple donne, par exemple, la possibilité à ses utilisateurs de choisir un mode clair ou un mode sombre, et de personnaliser la couleur des icônes.

• Et si l’on comprend bien que l’accessibilité a son importance, il ne faut pas négliger l’esthétique pour ce qu’elle apporte à l’expérience utilisateur ! Elle est primordiale ! Si les utilisateurs font preuve de satisfaction et de confiance au site qu’ils utilisent, et cela, grâce à l’esthétique, cela impacte leur engagement et donc le taux de conversion. Alors faites de l’esthétique votre amie !

Etre attentif à ce paradoxe aide les designers à faire des choix de conception qui incluent les malvoyants, sans exclure les autres. Lorsqu’on crée des interfaces pour un large public, promouvoir strictement l’esthétique ou l’accessibilité n’est pas une bonne approche. Trouver le juste milieu est la meilleure façon d’atteindre et de satisfaire le plus grand nombre possible d’utilisateurs 😉

Via The Aesthetic-Accessibility Paradox, UX Movement.

Ce texte est une réécriture de l'article Design patterns in voice interfaces. 

En design d’interface graphique, les designers utilisent des gabarits de conception qui sont, comme en couture, des modèles qui aident à produire plus vite et de manière plus efficace des interfaces, modélisant ainsi des standards de conception.

En anglais on parle beaucoup de design patterns, et avec l’arrivée des interfaces vocales, une question se pose : qu’en est-il de ces design patterns pour la conception des VUI (Voice User Interface) ?

Avant de vous donner la réponse à cette question, commençons par le commencement…

Qu’est-ce qu’un « design pattern » ?

Le terme de design pattern peut se traduire de différentes façons : gabarit de conception, patron de conception, modèle de conception, ou encore motif de conception. Dans la vie de tous les jours, nous en avons d’innombrables exemples. Il peut s’agir du simple carrelage de votre cuisine, ou des interactions que vous rencontrez sur les pages web. 

De plus, un gabarit est une structure que nous pouvons reproduire, et qui permet d’obtenir un résultat prévisible. Cette prédictibilité est une aide pour les designers, qui ne repartent pas de zéro à chaque fois, comme pour les utilisateurs, qui saisissent intuitivement comment les choses fonctionnent lorsqu’ils sont confrontés à une nouvelle interface

Il existe même des “librairies”, comme par exemple ui-patterns.com, où la plupart des gabarits sont documentés et peuvent être consultés gratuitement 😉  

Où peut-on trouver des design patterns ?

Sur les interfaces graphiques (GUI : Graphical Users Interface), ce sont des conventions que les utilisateurs et les designers ont inventé et adopté depuis plusieurs années. Puisque les interfaces graphiques ont été créées par l’homme, on peut dire qu’elles sont nées de toutes pièces.

Toutefois, ces gabarits s’appuient sur la compréhension du fonctionnement du cerveau et de la façon dont il interprète le monde qui nous entoure. D’une certaine manière, les design patterns jouent avec les biais cognitifs du cerveau des utilisateurs afin que ceux-ci puissent mieux comprendre comment interagir avec un écran.

A l’heure actuelle, plusieurs études expliquent comment le cerveau fonctionne en matière de perception, comme les lois de la Gestalt, qui ont été étendues à d’autres lois, comme celles de Hick, Fitts ou Zeigarnik. Tout ceci aide les créateurs à concevoir des interactions avec un résultat prévisible.

Parmi ces design patterns, il existe des modèles qui gagnent et perdent en popularité avec le temps. Ces fluctuations sont le résultat des évolutions techniques, des tendances sociales et des résultats factuels démontrant les performances positives et négatives d’un modèle.

D’où proviennent les design patterns des interfaces vocales  ?

Comme pour l’interface graphique, l’interface vocale nécessite de comprendre le fonctionnement du cerveau humain afin de créer des interactions optimisées et de répondre aux objectifs fixés. 

Contrairement aux interfaces graphiques, les interactions conversationnelles ne sont pas des artefacts technologiques créés par les humains au cours des dernières années. En effet, la conversation est une interaction humaine fondamentale que nous apprenons dès nos premiers jours. 

C’est pourquoi la technologie vocale essaie de reproduire ces schémas d’interaction déjà existants.

Le travail des concepteurs consiste à définir les différents éléments qui constituent une interface vocale, à comprendre comment ils fonctionnent en dehors de la technologie et à les adapter dans les interactions.

Quels design patterns peut-on trouver dans les interfaces vocales ? 

Dans les interfaces vocales, on peut être confrontés à trois types de motifs interactionnels  :

• les motifs narratifs,
• les motifs linguistiques,
• les motifs sonores. 

Pour chacun d’entre eux, nous allons trouver différentes structures pouvant être répliquées, avec un résultat prédictible. 

Les motifs narratifs

Les motifs narratifs se rapportent à la structure de l’ensemble de l’expérience conversationnelle. 

Grâce à eux, nous savons que, quel que soit le cas d’usage, dans chaque interaction vocale nous trouvons une section d’accueil, une délimitation du périmètre de recherche, la conversation en tant que telle, et enfin un message de fin. 

Si nous nous intéressons de plus près à ces motifs narratifs, nous voyons que certains cas d’usage sont déjà pleinement définis. Par exemple, nous avons le format du jeu de culture générale, dont les éléments sont reproduits sur toutes les plateformes logicielles et dans tous les pays presque intégralement. Prenez n’importe quel jeu de culture générale, vous trouverez quelque chose comme ce qui suit : 

• Message de bienvenue et domaine de connaissance : « Merci d’utiliser GeoTivia, le quizz sur la géographie mondiale. » 

• L’explication des règles : « Je vais vous poser des questions et vous donner X points pour chaque bonne réponse. » 

• Les paramètres du jeu (facultatif) : nombre de joueurs, de tours, durée, etc. 

• La partie : « Première question, où se situe… ? »

• Le résultat final : « Vous avez obtenu Y points / Z réponses corrects. » 

• Classement final (facultatif) : « Vous êtes 5 points en dessous de votre meilleur score ! »

• Nouvelle partie (facultatif) : « Voulez-vous jouer de nouveau ? » 

• Le message de fin : « A demain pour une nouvelle partie ! »

Les motifs linguistiques

A une échelle plus réduite, on trouve ce qu’on appelle les micro-motifs ou motifs linguistiques. Ils se rapportent aux éléments que nous mobilisons spécifiquement lors d’une conversation. Dans cette catégorie, nous pouvons ranger des aspects tels que les différents types de questions, comment gérer des listes d’éléments, mais aussi où placer une question dans un message-guide. 

Ces structures sont bien connues et étudiées par les linguistes, puis adaptées aux interfaces vocales. Savoir comment l’homme comprend le langage aide les concepteurs à prévoir comment les utilisateurs vont réagir aux différents messages que nous allons leur envoyer.

Grâce aux linguistes, nous savons notamment que les locuteurs réagissent de trois façons lorsqu’ils reçoivent un message : la confirmation explicite, la confirmation implicite, et l’absence de confirmation. A partir de cette connaissance, nous pouvons déterminer lequel fonctionnera le mieux dans notre cas d’usage et notre situation : 

• La confirmation explicite : – L’utilisateur : « Je veux aller à New-York », – L’assistant : « Avez-vous dit New-York ? », – L’utilisateur : « Oui », – L’assistant : « Quand souhaitez-vous voyager ? »

• La confirmation implicite : – L’utilisateur : « Je veux aller à New-York », – L’assistant : « Très bien, New-York. Quand souhaitez-vous voyager ? ». 

• L’absence de confirmation : – L’utilisateur : « Je veux aller à New-York », – L’assistant : « Quand souhaitez-vous voyager ? ». 

Les motifs sonores

Les motifs sonores, eux, permettent l’interaction et l’écoute des messages vocaux. Ils se rapportent à la façon dont notre cerveau comprend les sons et à la manière dont nous pouvons en tirer profit. Nous pouvons ainsi utiliser cette connaissance et ajuster le ton de nos messages, la vitesse, les pauses, les effets sonores, l’emphase, par exemple. 

La plupart des motifs que nous utilisons sont déjà très répandus dans les conversations traditionnelles. Ceux-ci sont employés tous les jours dans les séries télévisées, au cinéma, à la radio ou dans les discours politiques. A l’instar de ce qui existe sur les interfaces graphiques, des lois les expliquent et il y a des adaptations depuis celles de la Gestalt qui expliquent comment les mêmes concepts fonctionnent en conception audio. 

Voyons quelques exemples de la façon dont nous pouvons faire usage des motifs sonores dans la conception de l’interface vocale :

• Cas n°1. Les questions fermées à deux options ( c’est-à-dire : Souhaitez-vous A ou B ?) reçoivent des réponses comme les questions de type « Oui ou Non ». Nous pouvons travailler sur la formulation et aider les utilisateurs à comprendre qu’ils doivent choisir l’une des options, mais nous pouvons aussi utiliser un motif sonore. Par le simple placement d’une courte pause entre les deux éléments, nous créons un espace vide qui aide le cerveau à comprendre qu’une seule option peut être choisie. 

• Cas n°2. Nous sommes parfois confronté à de longs messages ou à différentes idées d’un coup. Dans tous les cas, la surcharge mentale s’en retrouve influencée et les utilisateurs peuvent finir par ne pas comprendre la plus grande partie du message. Dans un telle situation, il suffit d’employer des séparateurs sonores entre les sujets afin que les utilisateurs saisir la structure de la conversation et accroître leur compréhension : « Il était une fois, dans un château… (longue histoire) »  <séparateur audio> « Désirez-vous une autre histoire ? ». 

En bref, il existe aussi des design patterns dans les interfaces vocales qui permettent aux utilisateurs de mieux interagir face à leur écran, et aux designer d’atteindre leurs objectifs sans réinventer la roue !

Si cet article vous a plu, vous pouvez aller consulter mon retour d’expérience sur l’assistant Google de l’application Carrefour via mon thread Twitter 😉

L’effet de position en série, mais qu’est-ce donc me diriez vous ? Eh bien, il s’agit d’une technique qui permet de réduire la charge mémorielle de vos utilisateurs. Alors, si vous souhaitez améliorer leur expérience sur votre interface, cet article est fait pour vous !

Ce terme a été inventé par Herman Ebbinghaus, un psychologue allemand et pionnier de la recherche sur la mémoire. Il décrit l’influence de la position d’un objet dans une séquence sur l’acuité mémorielle de l’utilisateur.

Cette théorie se réfère à deux concepts principaux : 

• L’effet de primauté : les éléments qui sont présentés au début d’une liste sont mémorisés avec une plus grande précision que les éléments situés au milieu d’une liste.

• L’effet de récence : les éléments qui apparaissent à la fin d’une liste suscitent également un souvenir plus vif que les éléments présentés au milieu d’une liste.

Présenter de longues listes d’information à l’utilisateur n’est pas judicieux puisque cela sollicite de manière considérable sa mémoire, en particulier la mémoire à court terme, qui n’est capable de retenir que 3 à 5 éléments en même temps.

De plus, la capacité à se rappeler des éléments antérieurs est grandement affectée par les événements qui se produisent entre le processus de mémorisation initial et le souvenir ultérieur.

Lors d’une conception design, utiliser l’effet de primauté et de récence permet d’améliorer l’expérience utilisateur. Comprendre comment manipuler l’ordre des informations, c’est réduire la charge mémorielle de l’utilisateur !

Vous trouverez ci-dessous quelques façons d’utiliser l’effet de position en série dans la conception de votre interface utilisateur :

Toujours associer l’information à la tâche

Afin de réduire le plus possible la charge mémorielle de l’utilisateur, il est essentiel de conserver les informations relatives aux tâches sur l’interface utilisateur. Les informations affichées doivent être pertinentes pour la tâche en cours afin de minimiser la charge de mémorisation imposée à l’utilisateur. Cela lui permet d’être plus efficace, en ôtant la nécessité de se rappeler où se trouve chaque outil.

La plupart des applications de bureau telles que Sketch, Photoshop, Microsoft Word,  Pages, Keynote, et bien d’autres, place toute leur barre d’outils en haut afin d’aider l’utilisateur à travailler de manière plus efficace.

Adapter l’ordre des informations

Selon l’effet de position en série, présenter les éléments importants au début ou à la fin d’une liste favorise le souvenir, mais cela dépend du temps nécessaire à l’utilisateur pour prendre une décision. Si la décision doit être prise plus tard, mieux vaut présenter l’élément important au début de la liste – afin d’aider l’utilisateur à s’en souvenir.

Au contraire, si l’utilisateur doit prendre une décision immédiatement, il est préférable de placer l’élément le plus important en dernier, car les gens ont tendance à favoriser le dernier choix qui leur est présenté.

L’exemple ci-dessous montre que les éléments les plus importants sont situés en haut (le nom de l’article, le prix, la possibilité de payer en 4x sans frais) de manière à augmenter la probabilité de mémorisation des utilisateurs. La partie centrale comprend le CTA qui incite à l’achat ainsi que les disponibilités en magasin. La dernière section, elle, souligne la gratuité du retrait en magasin, le prix de la livraison, ainsi que les conditions de retour et le paiement sécurisé.

Voici un autre exemple avec Airbnb où sont placées les informations les plus essentielles en haut et en bas de la page de réservation : le résumé du bien, l’incitation à l’action et la disponibilité du lieu. Dans la section du milieu, certaines informations sont même cachées afin d’éviter la surcharge cognitive, ce qui permet à l’utilisateur de se concentrer sur les éléments importants.

[youtube width= »70% »]https://www.youtube.com/watch?v=4DhDfSLRLM8&feature=youtu.be[/youtube]

En dessous de la disponibilité se trouve la section des commentaires qui permet de terminer le parcours de l’utilisateur par une note positive ! Et puisque l’utilisateur prend souvent le temps de réfléchir, les dernières informations retiendront davantage l’attention de l’utilisateur.

Tirer profit de son atout décisif

Les promotions et les offres sont nécessaires et courantes pour la plupart des sites de e-commerce. Ce sont des tactiques de marketing essentielles qui contribuent à augmenter la conversion, il est donc important de les placer tout en haut de la page d’accueil. Cela permet à l’utilisateur de mieux garder en mémoire les promotions – même après avoir quitté le site.

J’espère que cet article sur les effets de position en série vous a plu ! A vous de mettre en place ces bonnes pratiques pour améliorer l’expérience de vos utilisateur. Sur le même sujet, vous pouvez également consulter notre article qui traite de l’impact de la charge cognitive en UX Design 😉

Disponible dans 600 villes réparties dans 65 pays et comptant plus de 75 millions d’utilisateurs, Uber est devenu le moyen de transport, par défaut, de nombreuses personnes. 

Le succès de cette application a été fulgurant, et Uber évoque son modèle commercial unique et son expérience client comme étant les facteurs clés de cette évolution. 

Et si Uber cartonne, on peut tout de même se demander quels sont les principaux problèmes que les clients rencontrent, et comment l’entreprise a su tirer profit de la science pour les résoudre… Réponse dans cet article !

Le plus gros problème des clients d’Uber : l’attente

Allez, petite mise en situation… Imaginez vous dehors à 2 heures du matin par une nuit d’hiver, attendant votre Uber tout en frissonnant sur le côté d’une rue sombre dans une ville que vous ne connaissez pas. Ou alors vous êtes en retard pour une réunion super importante, et vous ne voulez pas vous faire gronder par votre patron… Vous vous dites, pourvu que mon Uber arrive à l’heure !

Dans ce genre de situation, vous êtes soumis au stress et à la pression. Votre perception du temps est alors faussée puisque chaque seconde s’apparente à une minute, et une minute à une heure, autrement dit… une éternité.

De plus, les gens utilisent ce temps d’attente biaisé pour évaluer l’ensemble de leur expérience client. Pourquoi ? Tout simplement, parce que leur jugement se base sur un principe psychologique appelé le Peak-end-Rule. 

La science au service d’une expérience client inoubliable

Le Peak-end–Rule correspond à la façon dont les consommateurs évaluent, sur la base ce qu’ils ont ressenti, une expérience client. Ils prennent essentiellement en compte le sentiment le plus fort que leur a procuré l’expérience, qu’il soit bon ou mauvais, et leur ressenti à la fin de celle-ci.

Pour les marques, cela signifie que les clients jugeront leur expérience en se basant uniquement sur deux moments : la meilleure (ou la pire) partie de leur expérience, c’est-à-dire l’apogée, et la fin.

De quelle façon Uber applique la psychologie pour parfaire l’expérience client ?

Le temps d’attente est la clé d’une bonne expérience client, c’est pourquoi Uber a passé de nombreuses heures à s’attaquer à ce point douloureux pour les consommateurs.

Dans le cadre de ces recherches sur la perception de l’attente, trois principes ont été découverts : l’aversion pour l’oisiveté (Idleness Aversion), la transparence opérationnelle (Operational Transparency) et l’effet graduel à l’approche de l’objectif (Goal Gradient Effect).

1/ L’aversion pour l’oisiveté

Des études récentes sur la psychologie, le bonheur et l’expérience du client ont mis en évidence un principe appelé Idleness Aversion, c’est-à-dire l’aversion pour l’oisiveté. Selon ce principe, les gens sont plus heureux lorsqu’ils sont plus occupés, même s’ils sont obligés de l’être.

Comment appliquer l’aversion pour l’oisiveté ?

Pour occuper les gens et susciter leur intérêt, des éléments ludiques peuvent être mis en place sur l’application : des animations ou des images sont idéales ! Cela permet de retenir l’utilisateur et de le faire patienter de manière plus agréable.

Uber utilise une animation qui montre à l’utilisateur le trajet de son conducteur. Cela permet de le divertir, de le faire patienter mais surtout de lui apporter l’information sur le temps qui lui reste à attendre.

2/ Transparence opérationnelle

Le principe d’Operational Transparency, comme son nom l’indique, consiste à être totalement transparent avec ses clients. Il s’agit de montrer les efforts fournis par l’entreprise pour apporter la meilleure expérience possible.

Selon des recherches récentes, la transparence opérationnelle amène les clients à apprécier davantage un produit et peut même rendre les gens plus heureux.

Comment appliquer la transparence opérationnelle ?

Tenir les gens informés, mettre à disposition des informations clés et les aider à comprendre d’où viennent ces informations.

L’application Uber fournit, par exemple, des informations sur la manière dont les heures d’arrivée sont calculées. Cela assure une certaine transparence et ne submerge pas un client novice avec trop de détails qu’il ne pourrait pas comprendre.

3/ L’effet graduel à l’approche de l’objectif

Le Goal Gradient Effect montre que, pour atteindre leur objectif, les gens sont plus motivés par ce qu’il leur reste à faire que par le chemin parcouru. Et à mesure que les gens se rapprochent d’une récompense, ils modifient leur comportement pour atteindre leur objectif plus rapidement.

Comment appliquer le Goal Gradient Effect ?

Pensez au Goal Gradient Effect comme une ligne d’arrivée virtuelle : plus les clients se rapprochent de la victoire, plus ils sont encouragés. Ce concept est très répandu au sein de l’UX avec par exemple les barres de progression et l’achèvement d’un profil. En atteignant des objectifs, l’ utilisateur est encouragé et poussé à accomplir une nouvelle tâche.

Uber applique ce principe en illustrant ce qui se passe dans les coulisses pendant que le client attend. Chaque étape du processus est expliqué, ce qui donne au client le sentiment de progresser continuellement vers son objectif.

Pour appliquer les principes que nous avons détaillés dans cet article, il est comme toujours il est important de se mettre au plus près de l’utilisateur en réalisant des tests utilisateurs. Il est important de tester votre application de plusieurs manières afin de découvrir ce qui satisfait le mieux l’utilisateur et ainsi lui apporter la meilleure expérience client qui soit !

Via UX Magazine : How Uber uses psychology to perfect their customer experience.

En août 2019, Walt Disney a annoncé son propre service de streaming appelé Disney+. 

Le service de streaming offre des contenus provenant de leurs studios (Marvel, Pixar, Star Wars, National Geographic et Walt Disney Pictures) et entre sur le marché des services de streaming. 

En tant que designer UX, il est intéressant de se pencher sur l’onboarding de cette nouvelle plateforme et de comprendre comment elle attire de nouveaux clients et se différencie des concurrents tels que Netflix, Amazon Prime Video, Apple+ ou encore Hulu.

Et pour ceux qui ne le savent pas, l’onboarding d’une application n’est autre que le processus par lequel un utilisateur venant d’installer l’application est guidé lors de sa première utilisation 😉 

#1 L’accueil de Disney+ mobile

Sur la page d’accueil du site internet mobile, l’utilisateur retrouve toutes les offres qui lui sont offertes. Diverses fonctionnalités de la plateforme sont mises en avant telles que la possibilité d’avoir plusieurs utilisateurs, la diffusion simultanée en continu par plusieurs personnes, les téléchargements hors ligne et une large sélection de plateformes compatibles avec Disney+. 

Si la présentation des offres est assez claire, et que l’on distingue correctement le choix entre deux abonnements, les Call To Action de même couleur, et avec un libellé similaire, peuvent prêter à confusion. La distinction entre les deux abonnements, avec ou sans engagement, n’est pas assez détaillé, et il en est de même pour les conditions qui, elles, sont peu visibles.

#2 Le flux d’inscription

Pour se créer un compte Disney+, rien de plus simple : l’utilisateur doit entrer son adresse électronique ainsi que son mot de passe. Jusque là, tout va bien….

Les conditions générales sont assez mal présentées, et manquent de clarté pour la simple et bonne raison qu’elles ne se présentent pas sous la forme de case à cocher, comme en a l’habitude l’utilisateur. Ici, elles sont comprises dans le Call To Action “Continuer”. Ce contenu alourdit d’ailleurs de par sa taille et sa complexité, la lecture de l’utilisateur.

La seule case à cocher présente à l’écran est celle de l’acceptation à la Newsletter. Et comme dit précédemment, puisqu’il ne s’agit pas des conditions générales, comme pourrait s’y attendre l’utilisateur, ce dernier pourrait par réflexe cocher cette case !

#3 Abonnement et paiement

Après la création de son compte, l’utilisateur a la possibilité de payer mensuellement (6,99 €) ou annuellement (69,99 € au lieu de 83,88 € sur la base du prix mensuel). L’abonnement annuel fait économiser environ 13,89 €, et ce qui est dommage, c’est que Disney+ ne souligne pas précisemment cette économie qui offre pourtant à l’utilisateur deux mois gratuits. 

La case à cocher à côté de chaque mode de paiement demande à l’utilisateur s’il désire que ses données de paiement soient conservées pour que d’autres sociétés de la famille Walt Disney puisse les utiliser. Cette demande n’est pas claire pour l’utilisateur dans la mesure où il ne sait pas exactement dans quels buts pourra servir cette conservation des données, ce qui peut s’avérer être un frein pour les futurs abonnés.

En outre, l’option PayPal One Touch, qui permet de payer directement sans entrer de détails, est très appréciable et efficace. Cette fonctionnalité améliore l’expérience utilisateur lors de cette étape cruciale qu’est le paiement !

#4 Premiers pas sur l’application

Si l’utilisateur télécharge l’application mobile Disney+, il peut constater que la page d’accueil présente la même esthétique que sur la version web mobile. Sur cette première page, l’utilisateur est guidé facilement et peut se connecter sur le compte qu’il vient de créer. Rien de plus simple !

On retrouve sur l’application et la version web mobile une esthétique similaire, ce qui crée une bonne homogénéité ! Cet élément renforce l’identité de marque de Disney et rassure l’utilisateur qui retrouve son univers !

#5 L’application sur iOS

L’aspect général de l’application est assez clair et offre tous les éléments de base que l’on peut attendre d’un service de streaming : les catégories, les favoris personnels avec capacités hors ligne et les profils multiples. Par défaut, chaque profil a un avatar, et il est amusant de pouvoir le modifier à sa guise : Buzz l’éclair, Dark Vador, ou encore Mickey Mouse, les utilisateurs ont le choix !

En conclusion, on peut dire que le site web mobile ainsi que l’application présentent une expérience d’onboarding très satisfaisante, ce qui permet aujourd’hui à Disney+ de trouver sa place sur un marché très concurrentiel !

Si cet article vous a intéressé, vous pouvez aller consulter nos deux autres articles, cette fois-ci, sur Netflix ! Et si cette plateforme domine le marché depuis maintenant près de 10 ans, c’est parce qu’elle sait comment attirer les abonnés grâce à des stratégies parfaitement menées : La stratégie de recommandation Netflix.

Disney+ ne peut que s’inspirer de Netflix pour augmenter sa conversion 😉

Via UX Design : How Disney+ onboards new users ?