UX ou UI : qui fait quoi, et dans quel ordre ?
La confusion entre UX et UI coûte cher, parce qu'elle inverse l'ordre du travail. L'UX (expérience utilisateur) répond à des questions de structure : qui utilise ce produit, pour accomplir quoi, en combien d'étapes, avec quelles informations sous les yeux à chaque instant ? Elle produit des personas, des parcours, une architecture de l'information, des wireframes volontairement gris et laids — pour que la discussion porte sur la logique, pas sur la couleur d'un bouton. L'UI (interface utilisateur) vient ensuite habiller cette structure : grille, typographies, couleurs, iconographie, états d'interaction, micro-animations. Elle porte la marque et la crédibilité.
Notre séquence de travail : recherche (interviews courtes, analyse des parcours existants), wireframes basse fidélité validés vite, prototype cliquable testé sur cinq utilisateurs par profil, puis design haute fidélité et design system, enfin passation au développement avec revue de design pendant l'implémentation. Le point de contrôle qui change tout : ne jamais passer à la couche visuelle tant que le parcours n'est pas validé sur un prototype. Corriger un parcours sur un wireframe coûte une heure ; le corriger après le développement coûte un sprint.
| Phase | Question traitée | Livrable | Erreur fréquente |
|---|---|---|---|
| Recherche (UX) | Qui utilise le produit, pour quoi faire ? | Personas, parcours, audit des frictions | Sauter l'étape et concevoir pour soi-même |
| Structure (UX) | Quelles étapes, quelle information, dans quel ordre ? | Architecture de l'information, wireframes | Débattre des couleurs avant d'avoir validé le parcours |
| Prototype (UX) | Est-ce que ça marche pour de vrais utilisateurs ? | Prototype cliquable testé (5 utilisateurs par profil) | Tester seulement à la fin, quand tout est développé |
| Interface (UI) | À quoi ça ressemble, quel niveau de finition ? | Design haute fidélité, états, micro-interactions | Habiller une structure encore bancale |
| Système (UI) | Comment rester cohérent sur la durée ? | Design system, tokens, documentation | Livrer des écrans sans les règles qui les gouvernent |