L'histoire et la définition de l'UX/UI Design

En bref

Comment l'UX/UI Design est apparu ? Quelles définitions lui donner aujourd'hui et quelle place a le web design dedans ? Réponses dans cet article.

Cet article fait partie d’un autre ⚠️

Si c’est votre première visite ici, déjà bienvenu 👋 . Sachez que cet article fait partie de celui-ci plus global : Débuter dans l'UX/UI Design, un guide compréhensif. Bien que ce ne soit pas essentiel, je recommande néanmoins de commencer par là avant si vous débutez dans l’UX/UI Design.

Table des matières

• Premiers pas
• Que signifie design ?
• UX et UI, au commencement
• Comment définir l'UX et l'UI aujourd'hui ?
• Et au-delà

Premiers pas

Imaginez : c’est le matin et vous ouvrez une application sur votre smartphone pour lire les news, le soir vous choisissez un film sur votre smart TV, le lendemain vous payez des tickets dans une station de métro sur une borne et au moment de faire les courses, vous payez à une caisse automatique. À chaque fois que vous utilisez un écran qui vous propose d’interagir avec lui à travers une interface digitale, des UX/UI Designers ont été derrières pour vous permettre cela. Car il a bien fallu à un moment que quelqu’un définisse les fonctionnalités de cette application, sa structure, la disposition des composants (formulaires, textes, boutons etc.) les espacements entre eux, les couleurs, animations etc.

Mais pourquoi ce terme barbare ? “UX/UI Design” ? Pour faire court, il regroupe les deux phases principales dans le design d’une interface digitale, UX = User eXperience et UI = User Interface. Dans UX il y a “User” et “Experience”, c’est-à-dire que c’est le fait de prendre en compte les utilisateurs le plus tôt possible dans la structuration d’un produit ou d’un service, afin de délivrer la meilleure expérience possible. Pour l’UI, il s’agit d’habiller cette structure avec une interface utilisable par l’utilisateur final. Une UI de qualité assure une bonne expérience globale.

La phase UX porte donc sur le fond, la structure (on y produit des livrables que l’utilisateur ne verra pas, exemple un wireframe) et la phase d’UI, sur la forme (ce que verra l’utilisateur). Voici un exemple :

Nous aborderons plus en détail ce que l’on fait dans la phase UX et dans la phase UI plus tard.

Notez que quand l’on dit UX, on ne parle pas forcément d’un produit digital comme une application mobile, à l’origine le terme “UX” est large et englobe tous les points d’interactions avec une entreprise comme le service client ou l’aménagement d’une boutique. Mais de nos jours, il est beaucoup utilisé pour les produits digitaux. Je reparle de tout cela dans l’article suivant sur les différents termes.

Cela dit, quand on mentionne “UX/UI Design”, dans ce cas-là l’UX est spécifique à un produit digital.

Note importante : dans la suite de cet article et les autres, quand je parlerai d’UI Design, ce sera concernant des interfaces de types GUI ou “Interface Utilisateur Graphique”, soit : les ordinateurs, smartphones, montres connectées, etc. Mais il en existe d’autres que je vous présente plus loin dans cet article.

Que signifie design ?

Avant de rentrer dans le vif du sujet, que signifie “design” dans “UX/UI Design” ? Si on regarde les traductions du mot “design” avec Linguee, on obtient “conception”, “dessin”, “modèle” voir “forme”. On peut donc également traduire “designer” par “concepteur”. Mais vous verrez rarement “concepteur UX/UI” sur des fiches de postes (à moins que vous habitiez au Québec 😉 ). Une bonne définition est celle de l’Alliance Française des Designers :

“Le design est un processus intellectuel créatif, pluridisciplinaire et humaniste, dont le but est de traiter et d’apporter des solutions aux problématiques de tous les jours, petites et grandes, liées aux enjeux économiques, sociaux et environnementaux.” - AFD

UX et UI, au commencement

L’UX, au sens d’améliorer la vie des utilisateurs est apparu avant l’UI, qui elle, est purement digitale. On attribue souvent, et c’est vrai, la création du terme “UX” à Don Norman, un psychologue cognitif et designer qui a travaillé chez Apple à partir de 1993. Il fut alors le premier à avoir le terme “UX” sur sa carte de visite (“User Experience Architect” pour être précis).

Mais on peut remonter plus loin : en partant du Feng Shui, en 4000 av. JC, qui explique comment harmoniser son intérieur pour améliorer l’expérience de vie de ses occupants. Puis en passant par la Grèce ancienne, en 500 av. JC, et leurs principes d’ergonomie pour optimiser les activités des travailleurs.

Plus proches de nous, à partir des années 1900, avec Frederick Winslow Taylor et son taylorisme puis Toyota, connu pour leur utilisation de la gestion en “Kanban” qui avait pour but d’optimiser les environnements de travail en les centrant autour des travailleurs ou dit autrement, les “utilisateurs” des chaînes de productions.

À partir de 1950, on commence à voir les premiers UX Designers pour les consommateurs, avec entre autres : Henry Dreyfus et Walt Disney. Le premier pour sa pratique du design industriel centrée sur l’utilisateur dont, par exemple, les fameux aspirateurs Hoover qui en sont une manifestation. Le second, plus connu certainement et souvent cité comme le premier des UX Designers, avec ses parcs à thèmes où son obsession pour l’expérience des visiteurs fait encore leurs renommés aujourd’hui.

Puis en 1970 commence l’UX/UI Design à proprement parler, soit la création d’expériences utilisateurs qui se basent grandement sur une interface digitale. On pourrait penser en premier à Apple, mais en réalité, la paternité revient à Xerox qui introduit pour la première fois des concepts clés comme la navigation à la souris, les dossiers et le bureau virtuel. Là où Apple a marqué son époque (et Microsoft, ne les oublions pas 😉 ), c’est en reprenant les concepts de Xerox (les mauvaises langues vous diront “voler”) pour les améliorer et surtout, les rendre accessibles au grand public, avec le premier Macintosh en 1984 est son prix de 2500$ comparé au “Star” de Xerox à 16500$ sorti trois ans plus tôt.

Et c’est là que nous arrivons en 1988, à Don Norman, qui avec son fameux livre The Design of Everyday Things, formalisa encore plus la pratique de l’UX. Souvent cités dans les livres indispensables à lire pour tout UX/UI Designer et avec raison, même s’il n’est plus tout jeune, ses principes en UX restent universels et applicables encore aujourd’hui.

Un autre événement marquant dans l’histoire est le premier iPhone en 2007. En effet, comme pour le premier Mac, Steve Jobs avec Apple, combina pour un prix accessible plusieurs produits et technologies (baladeur musical, téléphone portable, navigateur internet, technologie multi-touch, capteurs, etc.) en faisant une rupture avec les appareils qui utilisaient un stylet et un clavier physique. Au contraire, il simplifia l’expérience en proposant d’utiliser le doigt et en introduisant le multi-touch. Maintenant, quasiment tout le monde a un smartphone, et de plus en plus, on l’utilise pour toutes sortes de choses.

Au début, les UI étaient fidèles aux principes du skeuomorphisme, c’est-à-dire le fait de faire ressembler des éléments virtuels à ceux du monde réel (bureau, dossier, fenêtre etc.). Puis avec le temps, les éléments sont devenus plus abstraits (fig. 2 à 4 ci-dessous). Ainsi, les utilisateurs ont pu s’habituer progressivement à utiliser ces nouvelles interfaces.

En résumé, l’UX existe depuis la nuit des temps, car à son cœur, il y a la volonté d’améliorer la vie des gens. Mais c’est avec l’avènement de la psychologie et des machines toujours plus intelligentes que l’UX et l’UI ont pris de plus en plus d’importance, d’où la nécessité de “professionnaliser” le domaine, avec des pratiquants dédiés.

Comment définir l’UX et l’UI aujourd’hui ?

Donc, depuis les années 80 l’UX/UI Design a fait son chemin, mais quelles définitions en donner aujourd’hui ? Bien qu’il ait évolué, on peut a priori, en donner qui seront valables un moment.

Je présente l’UX puis l’UI car pour rappel l’UX/UI Design sont deux domaines regroupés la plupart du temps en un métier, mais il existe des spécialistes qui ne font que de l’UX et d’autres que de l’UI.

Comment définir l’UX ?

Il existe de multiples définitions pour l’UX, car contrairement à l’UI qui est plus “visible” et donc plus facile à définir, l’UX englobe plusieurs vastes domaines liés à l’être humain, et de ce fait plus difficile à résumer en une définition (de toute façon, dès qu’une discipline inclut le comportement humain, bonne chance pour la faire rentrer dans une seule définition). Donc on peut dire sans trop de mal, que chaque UX Designers peut avoir sa propre définition, du moment qu’elle n’oublie pas ces éléments importants, relevés par le Dr Carine Lallemand dans son livre Méthodes de design UX : “Chercheurs et praticiens s’accordent tout de même à dire que l’UX est le résultat de l’interaction entre trois éléments : l’utilisateur, le système et le contexte.”

Avant de vous faire votre propre définition, je vous ai fait une sélection de celles qui me semblent les plus pertinentes :

“Tous les aspects liés à la manière dont les gens utilisent un produit interactif : la sensation du produit dans leurs mains, la compréhension de son fonctionnement, le ressenti durant l’usage, l’accomplissement de leurs buts, mais également son adéquation avec le contexte global dans lequel ils l’utilisent.” - Alben

“Une conséquence de l’état interne de l’utilisateur (prédispositions, attentes, besoins, motivation, humeur, etc.), des caractéristiques du système conçu (par exemple, la complexité, l’objectif, la facilité d’utilisation, la fonctionnalité, etc.) et du contexte (ou de l’environnement) dans lequel l’interaction se produit (par exemple, le cadre organisationnel/social, le sens de l’activité, le caractère volontaire de l’utilisation, etc.)” - Hassenzahl & Tractinsky

“UX = la somme d’une série d’interactions. L’expérience utilisateur UX représente la perception laissée dans l’esprit d’une personne suite à une série d’interactions entre des personnes, des dispositifs et des événements -ou toute combinaison de ceux-ci.” - Fatdux

À partir des précédentes et de mon expérience, voici ma définition de L’UX :

“Un vaste champ de connaissances et pratiques centrées sur l’utilisateur et ses interactions avec des produits et services. l’UX est transverse sur de nombreux domaines comme la psychologie, la sociologie, l’ergonomie, l’ethnographie etc. Globalement, tout ce qui touche à l’utilisateur. Lors de l’UX, on ne parle pas encore de l’aspect visuel comme les couleurs ou la typographie. On se concentre sur la connaissance des utilisateurs, leurs envies, buts et parcours dans le futur produit ou service ainsi que la structure de ce dernier.”

Comment définir l’UI ?

Comme dit le Nielsen & Norman Group, l’UI est à différencier de l’UX et cite cet exemple parlant :

“Prenons l’exemple d’un site web proposant des critiques de films. Même si l’UI pour trouver un film est parfaite, l’UX sera médiocre pour un utilisateur qui souhaite obtenir des informations sur un petit film indépendant si la base de données sous-jacente ne contient que des films des grands studios.” - NN Group

Ou encore :

“L’UI Design (User Interface Design), est l’étape de conception de l’interface utilisateur. L’UI (User Interface), littéralement “interface utilisateur” permet l’interaction avec le produit et contribue en cela à l’UX globale. L’expérience utilisateur est en effet directement liée au design graphique de l’interface UI qui a pour rôle de permettre une expérience agréable. L’UI Designer collabore donc avec l’UX Designer, garant de l’expérience utilisateur, avec qui il élabore la version graphique de l’interface.” - Usabilis

“L’expérience utilisateur UX et l’interface utilisateur UI font partie des termes les plus confus et les plus mal utilisés dans notre domaine. Une UI sans UX est comme un peintre qui applique de la peinture sur une toile sans réfléchir, tandis qu’une UX sans UI est comme le cadre d’une sculpture sans papier mâché. Une bonne expérience produit commence par l’UX, puis l’UI. Les deux sont essentiels pour le succès du produit.” - Rahul Varshney, co-créateur de Foster.fm

À partir des précédentes et de mon expérience, voici ma définition de l’UI :

“La mise en forme visuelle de ce qui a été conçu lors de la phase UX. Contrairement à l’UX qui est large et englobe les produits digitaux et non-digitaux, l’UI est uniquement digitale. Elle joue un rôle important dans l’UX, puisqu’un produit avec une bonne UX mais une UI pauvre, réduira l’appréciation générale de l’utilisateur.”

Notez aussi qu’en UI Design, on peut parler de trois types d’interfaces principales :

• GUI (“Graphical User Interface” ou “Interface Utilisateur Graphique”), fig. 5 : la plus connue, regroupe toutes les interfaces avec un écran, avec lequel l’utilisateur interagit avec ses doigts ou des dispositifs comme une souris, manette de jeu, etc.
• VUI (“Voice-Controlled Interface” ou “Interface à commande vocale”), fig. 6 : on pense tout de suite aux assistants type Google ou Siri d’Apple, regroupe tout ce qui se contrôle à la voix.
• Gesture-based Interface (ou “Interface basée sur les gestes”), fig. 7 : sans doute le domaine le plus novateur, regroupe les interfaces qui se contrôlent par les gestes, le plus souvent dans un environnement 3D. Par exemple : les interfaces de types casques VR ou le Leap Motion (pour contrôler un ordinateur avec les mains dans un espace 3D virtuel). Également, Microsoft avec son HoloLens (casque de MR pour “Mixed-Reality”) qui ouvre déjà des applications dans la médecine ou l’industrie, et sans doute bientôt Apple avec des rumeurs sur des “Apple Glass” (sans compter les Google Glass, mais qui n’ont pas encore rencontré le succès attendu). Samsung avait également expérimenté le tracking des yeux sur certains de ses smartphones, mais pour le moment ce n’est pas une technologie de masse semble-t-il.

En général pour un UX/UI ou un UI Designer, il travaillera la grande majorité du temps sur une GUI, car c’est celle qui est encore dominante. Le VUI Design ou l’UI Design avec des gestes sont des spécialisations de l’UI Designer.

Et le web design dans tout ça ?

Le web designer, dans le sens pur du terme, ne designera que des sites web et pas d’applications mobile/desktop (ou même l’interface des bornes de tickets de métro par exemple). Mais le web design et l’UX/UI Design ont tellement de points communs comme, entre autres, les choix de couleurs ou la gestion du responsive, que personnellement, je fais simple et englobe le web design dans l’UX/UI Design.

Mais attention, un web designer spécialisé dans ce domaine peut, par exemple, n’avoir jamais touché au design d’une application mobile. Dans ce cas-là, mieux vaut indiquer sur son CV “web designer” que “UX/UI Designer spécialisé en web design”.

Dit autrement : l’UX/UI Design propose de l’action, du choix et dans une certaine mesure de l’information à l’utilisateur alors qu’un site web propose principalement de l’information. Mais dans certains cas, la frontière entre les deux est plus floue, de nombreux sites font les deux : apporter de l’information et proposer une application. Un exemple simple : un site d’information avec en plus un système d’abonnement, de gestion de compte, consultation des éditions digitales et articles favoris, pouvoir les trier, etc. C’est ce raisonnement qui me fait englober le web design dans l’UX/UI Design.

Et au-delà

La valeur ajoutée d’un produit bien fait avec une interface soignée prend de plus en plus d’importance, surtout dans les domaines concurrentiels, ce sont des paramètres de plus en plus recherchés par les utilisateurs. Si le client potentiel a cinq apps similaires à départager et qu’il les essaie toutes, vous pouvez être sûr qu’il choisira celle qui a des écrans d’intros soignés, une UI calibrée et cohérente, une charte visuelle soignée et bien sûr les fonctionnalités qu’il attend.

Il y a également des rapports (InVision et McKinsey) qui montrent une forte corrélation entre des designs soignés et les retours sur investissements, et ça n’a pas échappé à certains CEO 💰 , comme le dit Ralf Speth (PDG de Jaguar) :

“Si vous pensez qu’un beau design est cher, vous devriez évaluer le coût d’un mauvais design.”

Pour continuer sur votre lancée

Nous avons vu l’histoire et défini l’UX/UI Design, mais comme tout domaine en pleine expansion, il y a souvent de nombreux termes qui se créent. Comment s’y retrouver entre “UX/UI Designer”, “product designer”, “visual designer” et autres termes de jargons ? C’est ce que je vous présente ici :

UX vs UI vs product design et autres noms

5 mai 2022  •  10 min

Le monde du design d'interfaces digital regorge de termes qui parfois décrivent la même chose, dans cet article je décrypte les plus communs.

Doko Zero
UI Designer avec des compétences en UX et développement web