UX Design : conception orientée utilisateur

L'UX Design permet de concevoir un site web répondant au mieux aux besoins de l'utilisateur. Le but est de réaliser une interface facile à utiliser. Il faudra donc, lors de la conception, se mettre à la place de l'utilisateur et prendre en compte son comportement et son ressenti.

Le design itératif
Le design itératif s'appuie sur l'amélioration de l'expérience utilisateur via des tests utilisateurs réguliers ou la collecte d'avis. Cette technique d'amélioration constante est l'inverse d'une gestion de projet unique.
On considère que l'utilisateur est le mieux placé pour indiquer les améliorations à faire sur un site. Web design et itération.

Les éléments UX de Peter Morville

Peter Morville est un pionnier de l'architecture de l'information. Il imagine ce schéma en nid d'abeille :

éléments UX de Peter Morville

L'utilité
Ce que votre site web permet de faire. Par exemple, le site lemonde.fr permet d'informer sur l'actualité et le site Zalando vend des chaussures et des vêtements en ligne.

L'utilisabilité
Facilité d'utilisation d'un site, facilité d'emploi et au final, satisfaction des utilisateurs.

La désirabilité
Tous les éléments d’un site ou d’une application servent à l’émotion et à la satisfaction de l’utilisateur. Il faut donc faire attention aux couleurs, aux mots utilisés, aux photos, aux icônes. La qualité de la conception graphique est ici déterminante.

La désirabilité de votre plateforme repose sur la conception visuelle et la création d'une expérience émotionnellement positive pour l'utilisateur. Le design doit être soigné pour susciter des réactions positives. Cela nécessite une compréhension approfondie de votre cible, ainsi qu'une adaptation du design en fonction de leur psychologie et de leurs préférences.

La trouvabilité
La possibilité pour un utilisateur de trouver facilement l'information qu'il recherche à l'intérieur de votre site.
Facilité avec laquelle votre site peut être trouvé dans les moteurs de recherche. Le référencement naturel (SEO) joue un rôle central, en attirant un flux régulier de visiteurs. Cependant il faudra convertir les visites en interactions positives (Taux de conversion).

La crédibilité
Votre site doit inspirer confiance auprès des utilisateurs. Il peut s'appuyer sur un design de qualité, sur des avis ou témoignages positifs et sur une bonne description du produit ou du service.

Le site Trustpilot évalue la crédibilité des sites en croisant certains critères et les témoignages des utilisateurs : https://fr.trustpilot.com

L'accessibilité
L’interface doit être accessible à tous, notamment aux personnes en situation de handicap. Le W3C, organisme de standardisation du web, propose un ensemble de règles pour l'accessibilité et dit qu'un site web doit être perceptible, utilisable et compréhensible par les personnes handicapées. Bien entendu, ce principe concerne également les personnes âgées qui ne sont pas forcément handicapées.

La valeur
Si on remplit toutes les qualités situées à la périphérie du schéma en nid d'abeille, on augmente la valeur (située au centre) du produit ou du service.

Les plans de Jesse James Garrett

Jesse James Garrett

Né à Ottawa, Jesse James Garrett, architecte de l'information, est connu pour son livre The Elements of User Experience ainsi que pour l'invention du terme Ajax.

Dans son livre The Elements of User Experience (2002), Jesse James Garrett propose de décomposer le processus de conception en cinq grandes étapes qui vont du plus abstrait au plus concret :

plans de Jesse James Garrett
  • La stratégie : il s'agit de définir les objectifs du produit et les besoins des utilisateurs.
  • La portée : Sur ce plan, les concepteurs doivent définir les fonctions et les contenus à créer.
  • La structure : il s'agit de définir l'architecture de l'information, le design d'interaction, et la navigation du produit.
  • L'ossature : il s'agit de concevoir l'interface, la présentation de l'information, et les éléments visuels du produit.
  • La surface : il s'agit de réaliser le design sensoriel en utilisant les couleurs, les formes, les sons, etc.

Les méthodes UX

Le test d’utilisabilité

Le test d’utilisabilité consiste à observer directement l’utilisateur en train de se servir et d’interagir avec le dispositif digital. Avoir recours à ce type de méthode permet d’identifier l’ensemble des difficultés qui peuvent impacter négativement l’expérience utilisateur.

Le test UX est le moyen le plus efficace pour identifier les fonctionnalités appréciables par les internautes, déterminer les points de friction et distinguer les fonctionnalités non pertinentes pour des utilisateurs finaux.

Les tests d’utilisabilité permettent donc aux équipes UX de rendre le parcours utilisateur plus fluide et agréable grâce à la récolte des informations précieuses auprès des l’audience cible.

Le focus group

Le focus group (groupe de discussion) consiste à réunir entre 6 et 12 participants afin de recueillir leurs opinions et de comprendre en profondeur leurs comportements et leurs motivations lors de l'utilisation d'un produit ou d'un service.

Guidée par un animateur, cette discussion collective a pour objectif de dégager des idées argumentées autour de l'usage d'un produit ou d'un service.

L'animateur rédige un document regroupant les principales thématiques à aborder et les questions à poser aux participants.

Plus d'informations sur les groupes de discussion ici : https://blog.hubspot.fr/marketing/focus-group

L'eye tracking

L'eye tracking permet d'enregistrer les mouvements oculaires. Le but est de suivre le parcours de l'oeil pour évaluer l'efficacité d'une page web ou d'une affiche publicitaire.

eye tracking

Voici deux sites permettant de tester gratuitement l'eye tracking sur des sites web à l'aide d'une simple Webcam :

L'AB testing

On propose deux versions d'un site web qui vont se charger aléatoirement. Les utilisateurs arrivent aléatoirement sur l'une des versions. A la fin de la période de test, on choisira la version la plus performante.

https://blog.hubspot.fr/marketing/creer-a-b-test

L'analyse de données statistiques

Cette phase débute par une écoute active des utilisateurs. Elle permet d’identifier leurs besoins, de les catégoriser et de les classer par ordre de priorité pour les traduire au final en fonctionnalités.

Une fois les besoins sont cernés, l’analyse de l’outil digital est primordiale avant de fixer les objectifs d’optimisation du parcours. Pour ce faire, l’entreprise peut avoir recours à plusieurs canaux, tels que :

La data : Google Analytics, AWStats, Google trends (tendances) peuvent mettre en évidence certains indicateurs du site (nombre de clics, les pages les plus vues, etc.) ainsi que des points de frictions et irritants de l’application.

AWStats
Cet histogramme d'AWStats nous renseigne sur le nombre de clics des visiteurs d'un site web.
Google Analytics

Les tendances de Google permettent de connaitre les mots clés les plus fréquemment tapés dans Google.

tendances de Google
tendances de Google

Exemple d'usage des tendances : Supposons que l'on souhaite référencer un site proposant des images en licence libre, on préférera utiliser le terme "libre de droit" car c'est le terme le plus fréquemment utilisé par les internautes, même si ce terme n'est pas une notion juridique en droit français.

L’interview utilisateur : le contact avec l’internaute permet à l’organisation de disposer d’informations immédiates et plus approfondies sur le sujet en posant directement les questions aux participants.

Sondage Chronopost
Suite à une livraison, Chronopost effectue un petit sondage
Enquête satisfaction La Poste
Suite à un envoi de colis depuis ma boite aux lettres, je reçois une enquête de satisfaction de La Poste.

Le Benchmark UX des concurrents : auditer les expériences proposées par les concurrents aidera l’entreprise à alimenter ses réflexions sur l’optimisation du parcours.

Les fiches persona

Persona est un mot latin qui désigne le masque du comédien. Il signifie le personnage.

Un persona est une représentation de vos types de clients. Il permet de simuler une visite sur votre site et de caractériser des comportements.

Les personas représentent un groupe de personnes imaginaires, et plus précisément un segment d’audience caractérisé par certaines spécificités propres aux utilisateurs cibles. Ces archétypes décrivent le profil type des internautes qu’une entreprise veut avoir. Grâce à ces échantillons d’utilisateurs, il est plus facile pour les designers et concepteurs UX d’avoir une meilleure compréhension de l’audience et d’y adapter les bonnes stratégies de conceptions et de développements de l’expérience utilisateur.

Grâce aux personas, il devient plus aisé de faire émerger les attentes et les besoins potentiels des utilisateurs finaux, d’ajuster et personnaliser les contenus et les actions, d’affiner les parcours UX, pour optimiser au final la qualité globale de l’expérience utilisateur.

Les personas sont généralement créés au début d’un projet, néanmoins ils peuvent évoluer tout au long du processus.

Quelques exemples de personas sur le site de Guillaume Gronier : https://www.guillaumegronier.com/cv/resources/Personas_v1.pdf

La carte d'empathie

L’objectif d’une carte d’empathie consiste à se mettre à la place de l'utilisateur pour mieux le comprendre. Voici les sections principales d'une carte d'empathie :

Qui : Une description de l'utilisateur : âge, le sexe, catégorie socioprofessionnelle, citadin ou rural, habitudes de consommation, etc.

Quoi : Les actions, les comportements et les tâches effectuées par l'utilisateur en relation avec le produit ou le service.

Pensées et sentiments : Les pensées, les émotions, les préoccupations et les objectifs de l'utilisateur liés à l'utilisation du produit ou du service.

Problèmes : Les frustrations ou les difficultés rencontrées par l'utilisateur lors de l'utilisation du produit ou du service.

Satisfaction : Les avantages ou les points positifs que l'utilisateur espère obtenir en utilisant le produit ou le service.

La carte d'empathie
Carte d'empathie proposée par Dave Gray, spécialiste du design de l'information

En résumé, une carte d'empathie permet aux concepteurs et aux équipes de projet de mieux comprendre les utilisateurs en se mettant à leur place et en identifiant ce qui est important pour eux. Cette compréhension approfondie des utilisateurs aide les concepteurs à prendre des décisions éclairées lors de la création de produits ou de services qui répondent véritablement à leurs besoins et à leurs attentes.

Se mettre à la place des utilisateurs est aussi très utile en SEO, lorsqu'il faut supposer les mots clés que vont taper les internautes dans les moteurs de recherche.

La carte d'expérience

Le parcours de l'utilisateur sur une interface pour réaliser le processus d’achat d’un produit est appelé la carte d'expérience. La carte permet de se rendre compte des différentes actions des internautes et les motivations qui les poussent à passer d’une étape à une autre.

Grâce à la carte, les concepteurs UX comprennent de façon détaillée les actions de l’utilisateur lors de sa navigation sur le site ou l'application. Elle permet de mettre en évidence les mauvaises expériences durant le parcours de l'internaute afin de proposer des améliorations sur chaque point de friction.

Guillaume Gronier, psychologue en ergonomie, imagine cette carte :

La carte d'expérience
  • Actions : Les actions de l'utilisateur à chaque étape.
  • Pensées : Ce que pense l'utilisateur à chaque étape.
  • Expériences : La jauge exprimant une bonne ou mauvaise expérience ressentie par l'utilisateur.
  • Opportunités : Ce qu'il convient de faire pour améliorer le produit ou le service.

Voici un modèle de persona et une carte d'expérience sur Canva.

Plus d'informations avec des cartes d'expériences décortiquées par Guillaume Gronier : https://www.guillaumegronier.com/cv/resources/ExperienceMap_v2.pdf

Focus accessibilité

Les Règles pour l'accessibilité des contenus Web WCAG (Web Content Accessibility Guidelines) permettent de rendre les contenus Web plus accessibles aux personnes handicapées. Les sites web doivent être :

  • perceptibles : faciliter la perception visuelle et auditive du contenu par l’utilisateur ; proposer des équivalents textuels à tout contenu non textuel ; créer un contenu qui puisse être présenté de différentes manières sans perte d’information ni de structure (par exemple avec une mise en page simplifiée) ;
  • utilisables : fournir à l’utilisateur des éléments d’orientation pour naviguer, trouver le contenu ; rendre toutes les fonctionnalités accessibles au clavier ; laisser à l’utilisateur suffisamment de temps pour lire et utiliser le contenu ; ne pas concevoir de contenu susceptible de provoquer des crises d’épilepsie ;
  • compréhensibles : faire en sorte que les pages fonctionnent de manière prévisible ; aider l’utilisateur à corriger les erreurs de saisie.
  • robustes : optimiser la durée dans le temps, la compatibilité avec les utilisations actuelles et futures, y compris avec les technologies d’assistance.
  • Source : https://accessibilite.numerique.gouv.fr/obligations/notions-accessibilite-numerique/

Web AIM (Web Accessibility in mind)

Web AIM est organisation américaine, à but non lucratif, visant à améliorer le web pour les personnes handicapées en donnant aux individus et aux organisations les moyens de créer du contenu accessible.

https://webaim.org/projects/screenreadersurvey10/

Le référentiel général d’accessibilité pour les administrations (RGAA)

La direction interministérielle du numérique (DINUM) propose de rendre accessibles aux personnes handicapées les services de communication au public en ligne.

https://accessibilite.numerique.gouv.fr/methode/criteres-et-tests/

L'outil d'analyse WAVE

Réalisée par le Web AIM, cette extension du navigateur Chrome analyse l’accessibilité de votre site web et vous indique les erreurs ou les points à améliorer.

Plugin WAVE Accessibilité

Les règles de l'accessibilité

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.