- Avec l’émergence des outils de prototypage IA, les designers passent de simples maquettes statiques à des workflows où ils réalisent eux-mêmes des prototypes interactifs et jusqu’à l’implémentation réelle en code
- Dans de grandes startups comme Perplexity ou Vercel, les designers utilisent désormais des outils d’IA comme Cursor, Claude, Lovable et V0 pour écrire du code frontend et aller jusqu’au déploiement en production
- Côté branding, ils construisent directement avec Lovable des outils de génération de systèmes graphiques qu’ils livrent ensuite aux clients, afin d’automatiser l’extension des motifs et la maintenance de la marque
- L’intuition produit (product intuition) et les fondamentaux du design graphique (couleurs, espacement, jugement visuel) restent des compétences clés, l’IA jouant surtout le rôle d’accélérateur d’exécution
- Le rôle du designer s’élargit, passant du simple « dessin de rectangles » à la « communication de vision et à la prise de décision », où la clarté des idées et la rapidité de jugement comptent davantage que la seule maîtrise des outils
Workflow de branding basé sur des outils d’IA
- Nick Patterson (en charge du branding chez Lovable, Craft, Maven, etc.) a utilisé Lovable pour créer en une heure un outil de génération de système graphique de marque
- Dans un projet de branding pour le processeur de paiement Flow Glad, il a conçu un outil Pattern Architect fondé sur des motifs géométriques islamiques
- Un outil interactif permettant au client d’ajuster en temps réel le rayon, la densité des étoiles, l’épaisseur des lignes, l’espacement, etc.
- En l’espace d’un sprint de deux semaines (10 jours), plusieurs versions de l’outil de génération de motifs ont été développées puis remises au client
- Il devient possible de présenter des visuels très aboutis dès l’étape du moodboard
- Autrefois, cette phase reposait surtout sur des références du travail d’autres designers ; désormais, les créations internes occupent le centre du moodboard
- Dès le deuxième jour, le travail d’intégration de la typographie et de motifs de style plan de métro était déjà en cours
- Une nouvelle forme de handoff consistant à livrer l’outil lui-même au client
- Après la construction de la marque, le client reçoit l’outil afin de pouvoir étendre et modifier lui-même les motifs
- Lorsque le client demande un « point intermédiaire », il peut exprimer son intention en ajustant directement les paramètres
- Cela aide les entreprises qui vont vite à implémenter et à faire évoluer immédiatement leur marque
Utilisation concrète des outils de prototypage IA
- Pranati Perry (design lead de Vercel V0) utilise V0 pour la génération d’assets et le prototypage d’interactions
- Création d’un composant de cartouche pour son portfolio : génération d’un SVG dans Figma → transformation en outil dynamique dans V0
- Avec un seul prompt, modification des couleurs de dégradé d’un SVG, ajout de texte dynamique, effets de transparence, etc.
- Génération d’animations en sprite et préparation à la création d’un jeu RPG sur le web
- Workflow de design produit : avant (Pre) - pendant (During) - après (Post)
- Avant : exploration d’idées dans Figma et V0 ; Figma n’est plus l’unique source du design UI
- Pendant : écriture de code de production avec Claude, les designers implémentant eux-mêmes la majeure partie du design
- Après : Vercel Agent laisse automatiquement des commentaires sur les PR pour aider à la revue de code
- Périmètre d’usage de V0
- Prototypes complexes comme un flux de facturation : au lieu du prototypage spaghetti dans Figma, les flux de modales sont définis en langage naturel
- Outil de génération d’effet de cube tramé pour des publicités de conférence Next.js et des en-têtes d’e-mails (travail du brand designer Dan)
- Une fois l’animation du bouton CTA finalisée dans V0, elle est transmise directement à l’ingénieur design
- Tendances d’usage de V0
- Au départ, surtout utilisé pour les landing pages, les graphismes et les shaders
- Plus récemment, les équipes sales et PM s’en servent pour créer des logiciels personnels à usage métier
- Les PM produisent des mockups interactifs pour compléter les PRD, allant au-delà des prototypes statiques avec connexion à des données live et intégration de l’IA
Intégration des outils d’IA dans le design produit
- Henry Modiset (VP of Design chez Perplexity) définit le rôle du designer comme résolution de problèmes + communication d’une vision
- Les outils d’IA servent d’outils de communication interactifs, centrés non pas sur une maquette d’app parfaite mais sur la visualisation d’une direction
- Ils permettent d’explorer des idées rapidement et à moindre coût avant de solliciter les ingénieurs
- État de l’usage de l’IA dans l’équipe design de Perplexity
- Équipe brand design : expérimentation et combinaison de tous les outils selon les principes de vélocité (velocity) et volume (volume)
- Équipe product design : écriture quotidienne de code de production avec Cursor et Claude Code
- Certains designers ajustent les animations dans un sandbox de prototypage avant de les transmettre aux ingénieurs
- Équipe game design : collaboration entre designer de mécaniques de jeu, designer UI et designer chargé de la génération musicale
- Outil le plus adopté : Cursor
- C’est l’outil le plus complètement intégré du point de vue du design produit
- Pour explorer des éléments plus ciblés (une animation spécifique, par exemple), des outils de type sandbox comme V0 ou Lovable sont utilisés
- L’équipe brand a mis en place un pipeline allant de Midjourney à Sora (vidéo), puis à la génération musicale et enfin à Frame.io
- Spectre technique des designers
- Ceux qui ont plusieurs années d’expérience en code de production utilisent l’IA comme principal accélérateur
- Les designers sans expérience en programmation commencent à apprendre le code pour affiner les animations et ajouter des détails de marque
- Gunnar (designer), qui n’avait aucune expérience du code, écrit désormais des composants UI Svelte avec Cursor
Comment les designers contribuent à la codebase
- L’implémentation devient désormais un prérequis de base (table stakes) pour les designers
- L’accélération de l’implémentation libère davantage de temps pour la pensée créative
- Des tâches de suivi de fonctionnalités qui prenaient autrefois 2 à 3 semaines peuvent désormais être ramenées à une semaine
- Bien définir le périmètre du prototype est essentiel
- Prototyper l’intégralité d’un flux est inefficace ; mieux vaut générer une PR à mi-parcours puis basculer vers l’implémentation réelle
- Les outils d’IA sont particulièrement efficaces pour le prototypage d’interactions ciblées
- Pour les cas limites, décrire les conditions en langage naturel est plus efficace que fabriquer chaque maquette manuellement
- Approche de la revue de code et de l’apprentissage
- Il faut dépasser le « blind coding » et évoluer vers une véritable compréhension du code écrit par les LLM
- Il faut traiter le LLM comme un « stagiaire » : des consignes techniques précises améliorent la qualité des résultats
- En indiquant dans Claude Memory « je suis designer et je veux apprendre comment le code fonctionne », on crée aussi des opportunités d’apprentissage
- Pour ne pas gêner les ingénieurs, l’objectif est de minimiser son empreinte (footprint)
Évolution du rôle du designer et critères de recrutement
- Compétences clés du designer à l’ère de l’IA
- L’intuition produit (product intuition) : la capacité à décider quoi construire et à dire « non » à la plupart des idées
- « Pourquoi les gens utiliseraient-ils cela ? Est-ce intuitif ? Comment cela s’insère-t-il dans le marché ? Est-ce assez attractif pour mériter une place sur l’écran d’accueil ? »
- Les fondamentaux du design graphique : couleur, espacement, définition des caractères, et la capacité à juger ce qui est bon ou mauvais
- Signaux recherchés par Perplexity au recrutement
- Une expérience de designer fondateur ou de freelance solo : des profils habitués à prendre des décisions de manière autonome
- Des talents combinant intuition produit et double compétence en direction artistique
- Une volonté d’apprendre en continu : comme les outils évoluent vite, l’adaptabilité est essentielle
- Redéfinition du rôle du designer
- Rester enfermé dans le « dessin de rectangles » signifie ne pas avoir de pouvoir
- Les outils d’IA permettent de communiquer beaucoup plus puissamment la vision que l’on a en tête
- L’avantage central du designer qui code : « il est plus simple de construire directement que d’expliquer ce que j’ai en tête »
- Il est désormais possible de produire en quelques jours des résultats interactifs et profonds
Structure de collaboration et conseils pratiques
- Un environnement où PM et designers peuvent tous prototyper
- Dans le pire des cas, cela crée de la confusion ; dans le meilleur, cela produit de meilleurs logiciels
- Il faut repartir des premiers principes : concevoir un logiciel avec un outil d’images statiques n’est pas rationnel
- Les prototypes interactifs constituent une manière plus naturelle de concevoir des logiciels
- Nécessité d’une culture de décision claire et d’une définition de la propriété
- Quand tout le monde peut fabriquer, une plus grande rapidité de décision devient nécessaire
- La force du designer : savoir choisir une direction dans l’incertitude
- Conseils d’application concrète
- L’idée compte pour 80 %, l’usage de l’outil pour 20 %
- Il y a encore 2 ou 3 ans, on codait sans IA ; aujourd’hui, le changement est devenu difficile à imaginer
- Une conversation en langage naturel peut transformer une liste d’idées en prototype
- Il est important d’apprendre par l’erreur, et une culture d’entreprise qui offre un terrain d’expérimentation est indispensable
Conclusion — Le spectre du design élargi par l’IA
- L’IA n’agit pas seulement comme un outil d’accélération pour les designers, mais comme un médium qui élargit l’éventail des productions créatives
- Le designer évolue désormais d’utilisateur d’outils à créateur d’outils, en franchissant les frontières entre code, IA et graphisme
- L’ère du design après Figma s’oriente vers la conception d’« idées interactives plutôt que d’images statiques »
- Avec la démocratisation de l’IA, la question n’est plus tant “qui peut implémenter ?” que “que veut-on construire ?”
Aucun commentaire pour le moment.