Les grands principes du design UX en 10 exemples concrets

Des centaines de sites Internet sont créés par jour, on a dépassé le milliard de site web en ligne il y a peu. On estime en 2013 pas moins de 100 milliards d’applications qui ont été téléchargées, autant dire que maintenant les utilisateurs, nous, avons largement le choix. Un panel d’opportunités différentes s’offre à nous.

Comprendre les grandes étapes de conception UX via des exemples concrets
Click To Tweet

Nous commençons naturellement à s’accoutumer aux différents usages et nous développons des réactions émotionnelles (ou physiques) aux interfaces auxquelles nous faisons face. C’est pourquoi il est important de se démarquer et de « plaire » à l’utilisateur.

Pour ça il faut faciliter l’aboutissement de son parcours en répondant à ses besoins. Si l’utilisateur se plaît sur une interface, ce n’est pas pour autant qu’il y restera ou qu’il comprendra ce que le service souhaite transmettre comme message.

Avec les méthodologies basées sur la recherche et l’amélioration de l’expérience utilisateur, les services numériques qui tendent à suivre ces méthodes améliorent largement leurs rendements. Un bénéfice énorme peut éclore suite à de simples changements d’interface. Ceux-ci auront une répercussion directe sur l’appréciation générale de l’utilisateur. Et l’avis de l’utilisateur c’est ce qui est le plus engageant pour une marque.

Les usages évoluent chaque jour donc le design d’expérience utilisateur aussi, c’est pourquoi c’est si compliqué d’assimiler parfaitement l’intégralité des principes UX.

Ces exemples permettent de comprendre des principes qu’emploient les designers UX afin de rendre une navigation appréciable tout le long de son utilisation.

La majeure partie des utilisateurs ne se soucient pas de l’intérêt et de la qualité de l’interface qu’ils voient, cependant ils le ressentent et agissent en conséquence. Nous retenons plus facilement ce qui nous déplaît plutôt que l’inverse, donc des mises en situation d’interface que nous connaissons (et visitions) c’est le meilleur moyen pour se rendre compte des écueils à éviter et des grandes lignes à suivre.

Recherche utilisateur

L’étude de l’utilisateur en amont (ou en aval) de la réalisation d’un site permet de (re)définir ses objectifs en fonction des personnes qu’on souhaite toucher (les cibles). Écouter ce qu’il veut et regarder comment il l’utilise s’avère être le meilleur moyen pour toucher un maximum de personne.

En 2014, les utilisateurs français préfèrent encore les moyens traditionnels pour communiquer.

Hiérarchisation de l’information

La navigation c’est le chemin qu’emprunte l’utilisateur pour trouver ce qu’il cherche. S’il y a trop de directions différentes on s’y perdra. Faciliter l’accès à l’objectif c’est faire gagner du temps à l’utilisateur et augmenter ses chances qu’il revienne et s’engage.

La hiérarchie de l’information des pages Paramètres des différents OS peut avoir un réel impact sur le nombre d’items d’une liste

Affordance

Un principe fondamental du design UX et de l’ergonomie en général. Une interface se lit, comme un livre, elle a des principes de lecture dont l’affordance en est l’une règle. Comme une interface est pavée de différents modules, la capacité de ceux-ci à suggérer leur propre utilisation est primordiale. Si un bouton ne ressemble pas à module cliquable, personne n’ira cliquer dessus.

L’affordance d’un bouton peut radicalement augmenter le nombre d’interaction

Wireframe

Une étape de conception d’interface indispensable pour structurer une interface. Le wireframe permet de mettre rapidement à plat les ébauches d’un site ou d’une application. C’est le squelette qui sert à vérifier si les articulations fonctionnent correctement. De plus cette étape permet de se concentrer davantage sur les versions responsive

Le wireframing permet d’avoir une vision globale sur l’ensemble des écrans et des différents écrans.

Storytelling

Une manière de disposer et de choisir une tonalité aux contenus qui affecte la lecture de l’utilisateur. Nous aimons tous les histoires, surtout quand elles sont biens racontées, c’est sur cette idée que le designer UX peut faire d’une interface un récit qui provoque l’enthousiasme et l’intérêt.

Le storytelling joue sur l’émotion en facilitant la lecture du contenu et capte l’attention de l’utilisateur

Gamification

Une interaction avec l’utilisateur qui implique directement l’utilisateur par le biais d’une présentation qui fonctionne toujours : le divertissement. Le fait d’interagir avec une interface facilite la compréhension et marque l’esprit. On apprend mieux en s’amusant et en pratiquant plutôt qu’en étant contraint d’utiliser les méthodes traditionnelles.

La gamification fait assimiler à l’utilisateur des notions parfois complexes ou émouvantes à travers des moyens ludiques.

Iconographie

Les images parlent, inspirent et font assimiler rapidement des idées/ actions aux utilisateurs. Pour autant chacun peut avoir sa propre interprétation sur une forme ou un visuel, c’est pourquoi il est important de se soucier de ce qu’on utilise comme icon ou visuel pour transmettre le bon message.

Les icones ne représentent pas forcément la même idée pour tout le monde, même si certains se suffisent à eux-mêmes il est préférable de les labelliser

Design émotionnel

Une façon d’humaniser une interface en utilisant des codes humains et similaires à un contexte réel. Une interface se loge dans une machine qui agit de manière robotique et répond à un programme, le design émotionnel permet de réduire cette distance entre la machine et l’homme. Le dialogue et l’échange entre l’utilisateur et l’interface se dote de règles et tonalités similaires à un dialogue entre deux humains.

Le design émotionnel est habilement utilisé par MailChimp (numéro 1 en email marketing) qui utilise sa mascotte, un singe coursier, pour toucher l’affectif humain.

Design d’interaction

Le design permet de communiquer des idées ou du contenu, et pour que l’utilisateur sente du répondant, le seul moyen est l’interaction. Une interface doit réagir aux actions faites par l’utilisateur, cela guide et accompagne la navigation de l’utilisateur. Le design doit être cohérent avec l’usage qu’on en fait et ce qu’il doit transmettre.

Le design d’interaction fonctionne particulièrement bien sur mobile. La réponse graphique faite à l’interaction menée par notre doigt permet de comprendre rapidement la réussite ou non de notre action.

Test utilisateur

Les retours des utilisateurs sont essentiels pour l’amélioration d’une expérience, ce sont eux qui guident les objectifs principaux d’un service. Leurs avis permettent de mieux cibler ces besoins et d’en tirer des changements structurels qui bonifieront la navigation dans son ensemble. Savoir ce qui intéresse l’utilisateur permet également de hiérarchiser ses priorités et ainsi d’être plus efficace.

Les tests utilisateurs ont permis de connaître l’impact de la refonte du site de Virgin America auprès de ses clients.