Le design UX/UI décide de la façon dont un produit digital fonctionne (l’expérience utilisateur) et de son apparence et de son comportement à l’écran (l’interface utilisateur). Pour un décideur, la question n’est pas la définition mais le retour : un design UX/UI bien fait augmente la conversion, réduit les demandes au support et rend le développement moins cher, parce que moins d’écrans sont construits deux fois. D’après notre expérience, son coût a baissé depuis deux ans, car l’IA prend désormais en charge la production répétitive (variantes de composants, premiers jets, préparation des images, tests), tandis que la recherche, le concept, la direction artistique et la finition restent un travail humain, et c’est là que l’argent doit aller. Ce guide explique clairement les deux moitiés, quelle recherche mérite d’être payée, comment parcours, wireframes et interfaces s’articulent, pourquoi un design system compte, à quoi s’attendre en coût et en délai, et comment choisir un partenaire design.
Quelle est la différence entre UX et UI ?
Le design de l’expérience utilisateur traite de la structure et du comportement : ce que les gens cherchent à faire, les étapes qu’ils suivent, ce qu’ils doivent savoir à chacune et là où ils se bloquent. Ses livrables sont des conclusions de recherche, des parcours utilisateurs, des arborescences et des wireframes.
Le design d’interface traite de la présentation : typographie, couleur, espacements, composants, états et mouvement. Ses livrables sont des écrans finis, des prototypes et une bibliothèque de composants.
Les deux ne s’achètent pas séparément avec succès. Une belle interface sur un parcours confus perd quand même les gens ; un parcours logique avec une interface négligée inspire la méfiance. On parle de product design quand un même groupe tient les deux, avec les objectifs commerciaux du produit.
Quelle recherche est rentable ?
La recherche est la partie d’un projet que l’on coupe le plus souvent, et celle dont l’absence coûte le plus par la suite. Le but n’est pas un rapport épais. C’est de remplacer les hypothèses par des faits avant que quiconque ne construise quoi que ce soit, et de le faire en jours, pas en mois.
Ce qu’il faut décider en premier
- Qui sont les principaux utilisateurs, et quelles tâches comptent le plus pour eux et pour l’entreprise.
- Ce que vous savez déjà : statistiques de fréquentation, tickets de support, appels commerciaux, études précédentes, raisons que donnent les clients qui partent.
- L’hypothèse la plus risquée du projet, et le moyen le moins cher de la vérifier.
Une poignée d’entretiens courts avec de vrais utilisateurs, lus à côté des statistiques et des questions au support, révèle en général la plupart des problèmes importants d’un parcours, et cela suffit pour commencer à concevoir en confiance.
Ce qui peut attendre
Les grandes enquêtes, les longs documents de personas et les phases de cadrage d’un mois justifient rarement leur coût sur un projet petit ou moyen. Commencez par une recherche ciblée, puis testez en concevant. Si le produit est nouveau, traitez la première version comme de la recherche, elle aussi.
Chez Odduel, l’IA fait le tri : elle transcrit et regroupe les notes d’entretien, résume les tickets et repère les motifs dans les retours. Les designers passent leur temps à parler aux utilisateurs et à décider, et les conclusions sont vérifiées par les personnes qui étaient dans la pièce. La même répartition du travail traverse nos projets de développement IA : la machine fait le volume, les personnes font le jugement.
Parcours, wireframes, interfaces
Le design va de l’abstrait au concret en trois étapes. Chacune répond à une question que vous devriez pouvoir poser en revue.
| Étape | La question à laquelle elle répond | Ce que vous relisez |
|---|---|---|
| Parcours utilisateur | Quelles étapes suit une personne pour accomplir une tâche ? | Un schéma du chemin, avec les sorties |
| Wireframe | Que contient chaque écran, et dans quel ordre ? | Des maquettes grises avec du vrai contenu |
| Interface | À quoi cela ressemble, et comment cela réagit ? | Des écrans finis et un prototype cliquable |
- Les parcours. Un parcours cartographie les étapes pour accomplir une tâche : s’inscrire, demander un devis, passer commande. Il révèle les étapes inutiles avant qu’un seul écran soit dessiné, et c’est là que l’essentiel de la conversion se gagne ou se perd.
- Les wireframes. Des maquettes peu détaillées qui fixent la structure et les priorités. Elles coûtent peu à modifier et gardent la discussion sur le contenu et l’ordre plutôt que sur la couleur.
- Interfaces. Le design visuel complet, fondé sur la marque. Chaque état (vide, chargement, erreur, succès) est conçu au lieu d’être laissé à l’interprétation du développeur. Si la marque n’est pas encore fixée, lisez d’abord notre guide du branding.
Un exemple. Nothing To Eat, une marque de sandwichs à Amsterdam, avait besoin d’un site qui vend avant d’expliquer. Le parcours a été réduit à une décision : un visiteur qui veut commander est envoyé directement au menu, sur la même page, et tout le reste se tient autour de ce chemin plutôt que devant. Une page, une tâche, chaque état d’écran dessiné avant le début du développement.
Qu’est-ce qu’un design system, et en avez-vous besoin ?
Un design system est une bibliothèque partagée de composants, de règles et de tokens (couleurs, tailles de texte, espacements) utilisée aussi bien par les designers que par les développeurs. C’est ce qui garde un produit cohérent à mesure qu’il grandit et que de nouvelles personnes le rejoignent.
Ce qu’il apporte à l’entreprise :
- De la vitesse. Les nouvelles pages et fonctionnalités s’assemblent à partir de pièces testées.
- De la cohérence. Boutons, formulaires et messages se comportent de la même façon partout.
- De la qualité. L’accessibilité et la performance sont intégrées une fois pour toutes dans chaque composant.
- Un coût de changement plus bas. Une mise à jour de la marque s’applique à un seul endroit.
Un design system n’a pas besoin d’être vaste pour être utile. C’est aussi là que l’IA a le plus visiblement changé notre travail : les variantes d’un composant, son code et ses tests sont produits en quelques heures, puis relus. C’est pourquoi nos projets de création de sites web et de développement d’applications partent d’un système plutôt que d’un écran vide. Notre guide du développement de site web suit ce système jusqu’au développement.
Tests
Les tests ferment la boucle entre le design et la réalité. Les méthodes utiles, de la moins chère à la plus lourde :
- Les tests de cinq secondes sur une page clé : de quoi les gens se souviennent-ils ?
- Les tests sur prototype cliquable avec quelques utilisateurs par série, avant qu’une ligne de code existe.
- Les contrôles d’accessibilité selon les critères WCAG 2.2 : contraste, navigation au clavier, libellés, focus.
- Les statistiques après la mise en ligne : où les gens quittent-ils un parcours ?
- Les tests A/B pour les pages à fort trafic, où de petites différences comptent.
Testez tôt avec des prototypes sommaires : modifier un wireframe coûte des minutes, modifier une fonctionnalité codée coûte des jours. Les contrôles automatiques, y compris ceux fondés sur l’IA, attrapent une bonne part des problèmes sur de nombreux écrans à la fois ; ils n’attrapent pas tout, aussi nous ajoutons des passes manuelles au clavier et au lecteur d’écran avant toute mise en ligne.
Pourquoi intégrer l’accessibilité dès la première maquette fonctionnelle ?
L’accessibilité fonctionne bien mieux comme principe de conception dès le premier wireframe que comme contrôle final, et c’est désormais une exigence légale pour de nombreux produits : la directive européenne sur l’accessibilité s’applique à un large éventail de produits et services numériques vendus dans l’UE depuis le 28 juin 2025.
Concevoir accessible, c’est :
- Un contraste qui respecte les ratios WCAG pour les textes et les commandes.
- Des tailles de texte qui restent lisibles sur petit écran et au zoom.
- Un chemin au clavier dans chaque parcours, avec un état de focus visible.
- Des libellés et des consignes qui ne reposent pas sur la seule couleur ni sur le seul texte indicatif du champ.
- Des animations que l’on peut réduire pour les personnes qui en ont besoin.
- Des erreurs expliquées en toutes lettres, à côté du champ, avec un moyen de les corriger.
Rien de tout cela ne limite le bon design. Cela tend plutôt à l’améliorer, parce que la clarté pour les personnes en situation de handicap est aussi la clarté pour quiconque utilise son téléphone en plein soleil. Intégrez ces règles au design system et chaque nouveau composant en hérite ; le coût de la conformité baisse à chaque page.
Combien coûte le design UX/UI et combien de temps il prend
Nous ne publions pas de grille tarifaire, parce que deux produits avec le même nombre d’écrans peuvent demander plusieurs fois plus ou moins d’effort. Ce qui fixe le chiffre, c’est le nombre de parcours et de types d’écrans distincts, la profondeur de la recherche, l’inclusion ou non d’un design system et le nombre de personnes qui valident chaque série.
Ce que l’IA a changé, c’est la production : les variantes de composants, les états de chaque écran, la préparation des images et la première passe des spécifications prennent désormais des heures plutôt que des jours. D’après notre expérience, un projet ciblé, comme la refonte d’un parcours clé, prend quelques semaines à partir d’un brief validé ; le design complet d’un produit ou d’un site se déroule par phases sur deux mois environ, la recherche et les tests prenant la part du calendrier que la production occupait autrefois. Notre guide combien coûte un site internet détaille le budget global. Si vous remplacez un produit existant plutôt que d’en lancer un, une refonte de site web se cadre autrement, parce que le contenu, les données et les positions dans les moteurs de recherche existent déjà.
Comment travailler avec un partenaire de design ?
Ce qu’un bon partenaire design apporte, et ce que vous pouvez attendre de lui :
- Un processus clair de la recherche à la livraison, avec des points de revue définis.
- Un design dans la réalité du navigateur : des mises en page responsives, du vrai contenu, chaque état couvert.
- Un travail étroit avec les développeurs, pour que ce qui est conçu puisse être construit et que ce qui est construit corresponde au design. Chez Odduel, les développeurs sont dans le projet dès le premier wireframe, ce qui nous permet de concevoir pour notre propre développement ou de passer le relais au vôtre.
- Une documentation : composants, règles et décisions consignés pour ceux qui viendront ensuite.
- Une connaissance des pratiques actuelles sans courir après les modes.
Demandez-leur comment ils utilisent l’IA. Une réponse crédible couvre la synthèse des recherches, les variantes rapides pour explorer et les contrôles automatisés. Les designers doivent prendre chaque décision finale. Nous détaillons notre propre réponse dans notre article sur l’IA dans le design et le développement web. Demandez à voir la recherche menée sur un projet passé, et des produits en ligne qu’ils ont conçus, pas seulement des images de portfolio. Notre note sur le choix d’une agence digitale liste les autres questions utiles. Notre article sur le démarrage avec une agence décrit les premières semaines.
Questions fréquentes
Quel budget prévoir pour le design UX/UI ?
Cela dépend du nombre de parcours et de types d’écrans, de la profondeur de la recherche et de l’inclusion ou non d’un design system. Le design est une part modeste du coût total d’un projet digital et fait économiser bien plus en reprises évitées. Demandez un devis détaillé par livrable, pour pouvoir comparer les chiffres de deux agences.
Combien de temps prend le design UX/UI avec Odduel ?
Un projet ciblé, comme la refonte d’un parcours clé, prend quelques semaines à partir d’un brief validé. Le design complet d’un produit ou d’un site prend plus de temps et se déroule par phases. L’IA raccourcit l’analyse de la recherche et la production, donc une plus grande part du temps va aux tests et aux ajustements.
Quelle est la différence entre design UX et design UI ?
Le design UX décide de ce que fait un produit et dans quel ordre : les parcours, la structure, le contenu de chaque écran. Le design UI décide de son apparence et de ses réactions : typographie, couleur, composants et mouvement. Un bon produit a besoin des deux, dans un même périmètre.
Ai-je besoin d’un design system pour un petit produit ?
En général oui, en version réduite. Quelques dizaines de composants documentés et un jeu de tokens gardent un produit cohérent à mesure qu’il grandit et rendent chaque nouvelle fonctionnalité moins chère à ajouter. Il se construit dans le premier design, pas comme un projet à part.
Comment l’IA change-t-elle le coût et le calendrier ?
Elle accélère la synthèse de la recherche, l’exploration initiale, la production des composants et les contrôles de qualité, ce qui raccourcit les projets et réduit le coût. Le jugement sur ce dont les utilisateurs ont besoin et sur la sensation que doit donner le produit reste aux designers, et chaque résultat est relu par une personne avant de vous parvenir.
Si un produit ou un site ne donne pas ce qu’il devrait, la cause tient en général à une poignée de parcours. Notre service de design UX/UI commence là : la recherche là où elle paie, des prototypes que vous pouvez tester, des interfaces construites pour votre marque et un système sur lequel vos développeurs peuvent s’appuyer, depuis Barcelone et São Paulo. Ou parlez-nous de votre projet.
