Comment intégrer l’IA dans son workflow UX/UI
« On a déjà deux agents IA qui tournent en interne. »
Ce n’est pas en réunion que j’ai entendu ça. C’est en mission chez un client, dans leurs bureaux. Ce genre de phrase, je l’entends de plus en plus souvent maintenant, entre deux écrans, dans les couloirs, pendant la pause déjeuner. L’IA fait désormais partie du quotidien.
Quelques semaines plus tard, un autre client nous présente deux pages de maquettes générées par Claude, structure de page et premières intentions de contenu, pour expliquer ce qu’il voulait avant même d’ouvrir Figma.
C’est ce constat qui nous a poussés à écrire cet article, pour poser ce que ça change dans notre façon de travailler, et ce qu’on peut en tirer concrètement pour nos projets et nos clients.
Ce que j’ai trouvé en explorant, c’est que l’IA ne remplace pas le designer, elle redistribue son temps et son attention. Certaines tâches s’accélèrent, d’autres disparaissent, et de nouvelles compétences deviennent importantes. La principale d’entre elles, j’y reviendrai, est la capacité à formuler des demandes précises. Savoir parler à une IA, ça s’apprend et ça change tout à la qualité des résultats.
Section intitulée le-prompt-la-competence-cleLe prompt : la compétence clé
Avant de parler workflow et processus, un point essentiel, la qualité des résultats dépend de la qualité de la demande. C’est le cœur du sujet.
Un bon prompt, c’est un bon brief. Précis, contextualisé, avec une intention claire et des contraintes définies. L’erreur la plus fréquente, celle que j’ai faite moi-même au début, c’est de rester trop vague en espérant que l’IA devine l’intention derrière la demande.
ex : Prompt trop vague
« Génère un UX flow pour un site e-commerce. »
ex : Prompt structuré
« Génère un UX flow pour la page produit d’un site e-commerce de mode féminine, destiné à des femmes de 25–40 ans sur mobile. Inclure : découverte produit, sélection de taille, ajout au panier, paiement, et edge cases (taille indisponible, rupture de stock, code promo invalide). Format en étapes claires avec états d’erreur et micro-interactions. ».
La différence se joue sur la précision de la demande. Un prompt efficace s’articule autour de cinq dimensions. Elles font la différence entre un résultat générique et une base vraiment exploitable :
- La tâche : Ce que l’IA doit faire concrètement, générer un écran, proposer un flow, décliner un composant.
- Le contexte : Où s’intègre cet écran ou ce parcours dans l’expérience globale ? Quel est l’état précédent ?
- Les éléments clés du design : Les caractéristiques visuelles ou fonctionnelles importantes que l’IA doit intégrer dans sa proposition.
- Les comportements attendus : Comment réagissent ces éléments lors de l’interaction (hover, tap, scroll, états vides, erreurs…)
- Les contraintes : Le support, la mise en page, le style visuel, les guidelines de marque. Plus ces contraintes sont précises, plus le résultat est pertinent.
J’aime les métaphores, alors en voici une : l’IA ressemble à un nouveau collaborateur. Il ne connaît pas encore le contexte, les clients, les process. Sans brief précis, il produit quelque chose de générique. Bien briefé, il va vite et produit une base exploitable.
Apprendre à prompter, c’est apprendre à collaborer avec l’IA, formuler ce qu’on veut, donner le bon niveau de contexte, et itérer ensemble.
Section intitulée integrer-l-ia-a-chaque-etapeIntégrer l’IA à chaque étape
Maintenant qu’on a posé ce cadre, voyons comment ça se traduit dans le travail. J’ai organisé cette exploration en trois phases : explorer, concevoir et produire. L’IA n’y joue pas le même rôle à chaque étape.
Une précision importante avant de commencer : « plus vite » ne veut pas dire « sans effort ». Une partie du temps gagné en génération est réinvestie en correction, ajustement et validation. L’IA produit une base et non un livrable.
Explorer plus vite et plus largement
Un brief flou est l’une des principales sources de perte de temps en début de projet. Avant, cela voulait dire plusieurs allers-retours avant même de commencer à concevoir. Aujourd’hui, on peut envoyer le brief tel quel à un agent conversationnel, demander une structure claire avec l’utilisateur cible, le problème, les objectifs attendus et les questions de clarification manquantes, et avoir une base de travail en quelques minutes.
Sur les UX flows, même constat. L’IA est capable de générer rapidement plusieurs scénarios, explorer des alternatives et identifier des états qu’on aurait pu oublier (erreurs, compte vide, connexion perdue..). La décision reste entièrement humaine : simplifier, prioriser, arbitrer.
Concevoir et itérer sans blocage
Pour cette phase de conception, j’ai testé spécifiquement deux outils : Figma Make et Claude Design.
Figma Make permet de générer plusieurs propositions d’écrans à partir d’une description ou de frames, de tester des patterns qu’on n’aurait pas spontanément tentés, et d’explorer des déclinaisons visuelles rapidement. C’est un véritable moteur d’expérimentation. Par défaut, il génère des écrans génériques, sans personnalité, sans cohérence graphique. Cette limite se réduit selon ce qu’on lui fournit un prompt détaillé ou en faisant plusieurs itérations.
Claude Design va plus loin dans l’aboutissement. La richesse de l’interface et la finesse des ajustements possibles sont intéressantes. C’est à ce jour la solution qui produit les prototypes les plus aboutis parmi celles que j’ai testées. Si le prompt semble insuffisant, Claude Design propose automatiquement un questionnaire pour affiner la demande avant de générer.
Autre détail qui a son importance, Claude Design propose deux modes d’itération complémentaires : le chat pour les changements globaux, et les commentaires inline pour les ajustements précis sur un élément spécifique. En pratique, ça permet de générer rapidement des visuels utiles pour aligner une équipe, transformer une idée produit en prototype testable.
Dans les deux cas, ce que ces outils produisent est une base de travail, pas un livrable finalisé. Le designer reste celui qui la transforme en proposition exploitable.
Au-delà des écrans, l’IA change aussi la façon de rédiger les interfaces. Sur le microcopy, ces petits textes qui guident l’utilisateur à chaque étape, c’est une aide précieuse. En définissant le ton et le style de communication de la marque dans le prompt, on peut générer rapidement des textes cohérents pour tous les états d’interface : succès, erreur, chargement, état vide.
Produire et livrer plus efficacement
Le handoff, ce moment où le designer passe le relais au développeur, est souvent un moment de friction. L’IA ne le supprime pas, mais elle le fluidifie. En connectant Figma à Claude via le protocole MCP (Model Context Protocol), Claude peut lire directement la structure du fichier (composants, calques, propriétés…) et produire une base de documentation de specs. C’est une piste que je n’ai pas encore testée personnellement, mais qui mérite d’être mentionnée. La qualité du résultat dépendrait directement de la structure du fichier Figma : un fichier bien nommé avec des composants propres donnerait un résultat exploitable.
C’est d’ailleurs une règle qui vaut pour tout l’article : l’IA amplifie que ce qui est déjà structuré. Un design system solide n’est plus seulement un outil de cohérence visuelle, c’est ce qui rend le travail exploitable par l’IA.
Section intitulée et-cote-client-qu-est-ce-que-ca-change-vraimentEt côté client, qu’est-ce que ça change vraiment ?
Les deux anecdotes d’introduction ne sont pas des cas isolés, elles disent quelque chose d’important : le niveau de préparation et d’attente des clients change. Quand un client arrive avec des maquettes générées par IA pour illustrer son idée, il ne cherche pas à faire le travail du designer. Il cherche à être compris plus vite, à aligner plus tôt, à éviter les allers-retours.
Pour le designer, ça change la nature de la conversation. On ne part plus d’une page blanche commune, on part d’idées déjà mises en forme, parfois précises, parfois approximatives mais toujours révélatrices de ce que le client a en tête. Le client montre une direction, une intention mais pas une solution. C’est au designer de définir ce qu’il y a derrière.
La prochaine étape naturelle, que j’imagine, c’est l’atelier client en live : générer des variantes d’écrans directement en réunion pour itérer en temps réel sur une direction. L’enjeu est simple : aligner plus vite.
Section intitulée pour-conclurePour conclure
L’IA transforme réellement la pratique du design. Elle accélère certaines étapes, structure des réflexions qui prenaient du temps, et ouvre des possibilités d’exploration.
Elle ne connaît pas les utilisateurs, leurs habitudes, leurs frustrations, ce qui les fait décrocher. La créativité graphique, la sensibilité visuelle, la cohérence d’une marque, tout cela reste entièrement humain. Mais elle propose des directions qu’un designer seul n’aurait pas explorées, pas parce qu’elles sont meilleures, mais parce qu’elle n’a pas nos biais.
Sur un prochain sujet, nous pourrons approfondir un aspect particulier : comment configurer Claude avec des instructions personnalisées (system prompts, custom instructions) pour lui donner un contexte permanent et des compétences adaptées à la pratique du designer.