Visual design, en finir avec quelques contrevérités

Le visual design est un des champs de l’expérience utilisateur les moins bien considérés. C’est aussi l’un des plus mal compris. C’est à la fois injuste et regrettable, car une fois sur quatre (vous découvrirez l’origine de cette statistique en lisant l’article), il est à la source des problèmes des utilisateurs.

Comme je me raidis à chaque fois que je lis une nouvelle bêtise à son sujet, j’ai pensé qu’il pouvait être utile de me fendre d’un court article afin de tordre le cou à quelques contrevérités et tenter de comprendre l’origine de sa mauvaise réputation.

Visual design ?

Le Nielsen & Norman Group définit le visual design comme « la manière dont les éléments graphiques de l’interface (lignes, formes, couleurs, espaces) sont associés pour créer un visuel équilibré et réfléchi […] qui améliore l’utilisabilité ». En d’autres termes, il relève de la forme de l’interface et son rôle principal est d’aider l’utilisateur à comprendre intuitivement comment s’en servir pour passer à l’action.

Le visual design est souvent confondu avec l’interface utilisateur (UI) et l’expérience utilisateur (UX). En réalité, il faut se figurer ces trois domaines circonscrits les uns dans les autres, à la manière de poupées russes :

• Le visual design est une des dimensions fondamentales de l’interface lorsqu’elle est graphique évidemment. Il y en a quatre au total, j’y reviendrai dans quelques lignes.
• L’UI désigne l’espace au sein duquel l’utilisateur et le système interagissent, en un mot l’interface dans TOUTES ses composantes.
• L’UX c’est ce qui résulte de cette interaction. Ce sont TOUS les aspects de l’expérience de l’utilisateur avec un produit ou un service.

Il y a donc quatre dimensions fondamentales à toute interface graphique :

• L’information : les messages délivrés à l’utilisateur au moyen de textes et de médias (images, sons, vidéos…).
• Le visual design : l’organisation et le traitement graphique des informations.
• La chronologie : la succession des informations et des événements dans le temps.
• Le comportement de l’interface : la façon dont elle réagit aux actions de l’utilisateur pour lui permettre de naviguer.

Ces dimensions sont interconnectées, pour ne pas dire entremêlées, si bien qu’il est difficile de les considérer séparément. Lorsque l’on parle de visual design, on évoque donc toujours par la même occasion l’une ou l’autre de ces composantes.

« Le visual design est superficiel »

Le lieu commun le plus répandu au sujet du visual design, c’est qu’il n’est que la partie émergée de l’iceberg, ou un joli vernis apposé sur l’interface. En d’autres termes, un élément superficiel de l’expérience utilisateur. Cette séparation entre l’utile et le futile est d’ailleurs souvent opérée au sein même de la communauté des designers, où l’on a tendance à opposer les aspects fonctionnels aux questions formelles, les premiers étant généralement jugés plus nobles et dignes d’intérêt.

Je pourrais m’étendre longuement sur cet antagonisme très artificiel, mais ça n’est pas tout à fait notre sujet. Quoique, j’en parlerais peut-être avant la fin de cet article. Mais revenons plutôt à notre sujet. Pour qu’une interface soit utilisable, il faut que l’on comprenne en un coup d’œil et sans effort comment s’en servir. Les éléments qui la constituent doivent donner des indices sur ce qu’ils permettent d’accomplir. On parle d’affordance, un néologisme popularisé par Don Norman dans son livre : « The Design of Everyday Things ».

Prenons l’exemple d’un bouton d’action. Pour jouer efficacement son rôle, un bouton doit d’abord être visible. La hiérarchie de l’information, le contraste, la couleur, la taille et les espacements doivent permettre de le faire émerger au sein d’un écran. Il doit ensuite être reconnu comme un bouton. Il doit donc posséder les caractéristiques généralement attribuées à ce type d’élément : forme, anatomie, détails graphiques, comportement… Enfin on doit comprendre quelle action il permet d’accomplir. Le texte, les éventuels pictogrammes et bien évidemment le contexte de ce bouton aident l’utilisateur à discerner quelle tâche il peut exécuter en cliquant sur ce dernier. Ce processus cognitif (perception, reconnaissance, compréhension) qui détermine le degré d’affordance des objets interactifs doit énormément au visual design. Loin d’être une couche superficielle et esthétique, c’est l’un des leviers majeurs de l’utilisabilité.

« Le visual design c’est pour faire joli »

Beaucoup de gens croient que le visual design se cantonne à la dimension esthétique de l’interface. C’est un contresens malheureux car nous l’avons vu, sa fonction première est d’améliorer l’utilisabilité. À trop se focaliser sur l’esthétique, on peut perdre de vue d’autres objectifs importants. Il suffit de faire un tour sur Dribble pour constater qu’une « jolie » interface n’est pas forcément claire, intuitive et ergonomique pour autant. Il est d’ailleurs parfois nécessaire de bousculer l’harmonie graphique pour mieux guider l’utilisateur. Une couleur qui tranche, un style de texte qui dénote, un alignement particulier sont autant d’accidents qui peuvent aider à capter l’attention des gens pour leur délivrer un message important. De la même façon, quelques concessions à l’élégance sont parfois utiles pour améliorer l’accessibilité ou s’assurer qu’une information est correctement transmise.

Entendons-nous bien, la beauté n’est pas problématique, mais ça n’est pas vraiment l’objet du visual design. Il faut plutôt la voir comme une conséquence de celui-ci. Comme le dit le philosophe américain Denis Dutton : « la beauté se trouve dans les choses bien exécutées » et les interfaces correctement conçues, intelligibles et utilisables sont rarement laides.

« C’est la dernière chose à faire »

On considère généralement le visual design comme la dernière étape du processus de conception. S’il est vrai qu’il intervient après la phase amont des projets (recherche utilisateur, stratégie, planification), il commence à s’esquisser dès les prémices de ce que l’on appelle la phase d’idéation.

Une interface ne voit pas le jour dans les derniers instants d’un projet. Elle est le fruit d’un processus de raffinement qui s’étale dans le temps. Tout comme l’art du sculpteur ne se limite pas à polir un marbre déjà taillé, le visual design ne se borne pas à aligner des pixels une fois la phase de conception terminée. Griffonner une forme sur un post-it, élaborer un zoning basse fidélité ou un wireframe plus détaillé, c’est déjà faire du visual design.

Encore une fois, on opère une séparation artificielle entre aspects fonctionnels et questions formelles dans une acception littérale du célèbre « Form follows function » de l’architecte Louis Sullivan, comme si le travail de la forme devait nécessairement intervenir dans un second temps. Les textes fondateurs sont souvent compris de travers et le célèbre aphorisme ne fait pas exception à la règle. Ce que voulait dire Sullivan c’est que ces deux aspects sont « absolument unis et inséparables ». La fonction ne précède pas la forme puisque toutes deux sont consubstantielles.

Déterminer la fonction d’un élément d’interface c’est donc déjà esquisser son apparence, ou du moins la restreindre à un vocabulaire de forme particulier. Loin d’être l’ultime étape du processus de conception, le visual design débute très tôt et se peaufine longtemps.

« On ne peut pas être visual designer et concepteur »

Ce dernier lieu commun est un des plus préjudiciables. Et malheureusement, il marche dans les deux sens. Ce préjugé conduit à des erreurs de recrutements, ou ce qui est pire, à passer à côté d’excellents candidats qui ont la particularité d’avoir plus d’une corde à leur arc.

L’opposition entre matière et esprit est vieille comme le monde. En français, le mot « design » au sens anglo-saxon de « conception » n’existe pas. On opère une distinction sémantique claire entre le dessin (la pratique) et le dessein (l’idée), qui témoigne d’une tendance persistante à considérer le visual design comme un « art décoratif ». Notre société valorise peu les métiers manuels et confère un prestige certain aux professions dites intellectuelles. Le visual design relevant plutôt de la première catégorie — après tout cela tient presque de l’artisanat — on dénie facilement aux gens qui y excellent la capacité de penser l’expérience utilisateur dans sa globalité.

La réalité est évidemment moins manichéenne et fort heureusement, la sensibilité graphique n’inhibe pas les aptitudes conceptuelles. D’ailleurs, les concepteurs les plus aguerris avec lesquels j’ai eu l’opportunité de collaborer sont aussi d’excellents visual designers. Les savoirs se nourrissent les uns des autres, ils ne s’annulent pas. On peut tout à fait apporter de l’attention aux détails graphiques et être également concerné par les besoins des utilisateurs. Ce n’est pas incompatible, c’est même parfaitement complémentaire.

Pour conclure

Le visual design est loin d’être la seule compétence utile à la création d’interfaces. Cependant c’est un aspect fondamental de l’expérience utilisateur et un talent dont toute équipe de concepteurs devrait disposer.

À mal le comprendre, certains designers ont fini par sous-estimer son rôle et par s’en désintéresser. D’autres s’y consacrent sans se préoccuper de sa dimension fonctionnelle, inondent des sites comme Dribbble ou Behance de leurs productions et exacerbent le sentiment des premiers qu’il s’agit d’une discipline superficielle.

Je suis vous l’aurez compris défenseur d’une troisième voie qui envisage le visual design et l’utilisabilité comme une seule et même question et j’espère vous avoir convaincu que c’est la bonne approche.