Claude Design : le nouveau produit d'Anthropic qui veut court-circuiter Figma

Anthropic a fait perdre 7% à Figma en une journée. Pas avec une levée de fonds, pas avec un pivot. Avec un produit. Claude Design a été lancé le 17 avril 2026, trois jours après que Mike Krieger, le CPO d'Anthropic, ait quitté le board de Figma. Et l'outil pose frontalement la question que Figma, Lovable et v0 laissaient en suspens : à quoi ressemble un outil qui fait vraiment le pont entre l'idée et la mise en production ?

Chez Scroll, on accompagne depuis plusieurs mois des projets qui arrivent avec un prototype IA en main (Lovable, Bolt, v0 principalement), qu'il faut finir d'ingénierer pour qu'ils tiennent en production. Claude Design répond précisément à la partie du problème que les autres outils laissaient ouverte : l'extraction du design system depuis un codebase existant et le handoff direct vers du code via Claude Code.

Cet article passe en revue ce que Claude Design fait vraiment, où il se situe face à Figma, Lovable et v0, les limites qu'on voit déjà, et ce qui se passe concrètement quand un prototype Claude Design arrive chez une agence pour être mis en production.

Ce que fait (vraiment) Claude Design

Claude Design est un générateur de visuels interactifs par IA, édité par Anthropic et disponible dans l'onglet Design de Claude.ai. Vous décrivez ce que vous voulez (une landing, une app, un pitch deck, un one-pager marketing) et l'outil produit une première version en quelques secondes. Le résultat n'est pas une image statique : c'est du HTML vivant, cliquable, testable, qu'on raffine ensuite à la voix, au commentaire inline ou au slider.

Le différenciateur clé tient en une ligne : Claude Design peut lire votre codebase et vos fichiers Figma pour extraire automatiquement votre design system, puis appliquer ce système à tout nouveau projet. Là où Lovable et v0 peuvent importer un design Figma mais ne déduisent pas un design system cohérent à partir d'un repo GitHub, Claude Design le fait nativement.

Le produit est propulsé par Claude Opus 4.7 et disponible pour les abonnés Pro, Max, Team et Enterprise. Les plans Team et Enterprise peuvent nécessiter une activation côté administrateur. Le statut est celui d'une research preview : les fonctionnalités évoluent, et l'accessibilité des prototypes produits reste à valider par des audits indépendants.

Ce qu'il y a sous le capot : 6 fonctionnalités qui changent la donne

La génération de prototypes à partir d'un prompt. Le cœur du produit. Description naturelle, première version HTML interactive en sortie. Les early users rapportent des résultats visuellement aboutis sur les landings et les maquettes d'apps simples. Sur les flows plus complexes (dashboards, workflows métier, interfaces avec beaucoup de conditions), la qualité dépend largement de la précision du prompt, et l'outil demande plusieurs itérations pour aboutir.

L'extraction du design system. Au premier lancement, Claude analyse votre repo GitHub et/ou vos fichiers Figma pour en déduire palette, typographies, composants, espacements, grille. Un utilisateur (@eMeRiKa sur X) a partagé un test où il pointe Claude Design sur le repo d'un lecteur Markdown iOS et obtient un prototype qui match visuellement l'app existante sans prompt supplémentaire. C'est ce qui rend l'outil potentiellement plus utile qu'un générateur de page blanche pour les équipes qui ont déjà une identité visuelle installée.

L'édition inline. Trois modes coexistent : commentaire sur un élément (« augmente le contraste du CTA »), édition directe du texte comme dans un éditeur classique, et sliders pour ajuster en live l'espacement, les couleurs, la layout. Ce dernier point compte : il évite la régénération complète à chaque itération, et donc les tokens qui explosent.

Les imports multi-sources. Claude Design accepte en entrée un prompt texte, des images (captures, inspirations), des documents DOCX/PPTX/XLSX, une URL à scraper, ou un codebase entier. On peut transformer un cahier des charges Word en maquette, ou dire « refais cette section de la homepage de stripe.com avec notre branding », et obtenir un rendu cohérent.

Les exports : Canva, PDF, PPTX, HTML, Claude Code. C'est la polyvalence qui distingue Claude Design d'un outil purement dev comme v0. Un marketeur peut exporter vers Canva et l'éditer en équipe. Un founder peut pitcher en PDF. Et surtout, un développeur peut envoyer le package vers Claude Code avec une instruction, et récupérer du code à retravailler.

Voix, vidéo, 3D, shaders, appels IA intégrés. Un prototype peut embarquer un chatbot fonctionnel, un lecteur vidéo, un élément 3D, dès la maquette, pas en placeholder. Gadget sur certains projets, utile sur ceux qui vendent une fonctionnalité IA : on peut montrer le produit en action au lieu d'un mockup figé.

Pour qui c'est vraiment pensé

Anthropic cite cinq profils : designers expérimentés, product managers, founders, marketeurs, account executives. La liste est correcte, mais elle cache l'enjeu stratégique : la vraie cible, ce sont les non-designers. Les gens qui n'ont jamais ouvert Figma. Les founders qui préparent leur premier pitch deck. Les PM qui voulaient un mockup pour valider un flow mais qui n'ont personne sous la main pour le faire.

Pour un designer senior qui maîtrise Figma, Claude Design est un accélérateur d'exploration : intéressant mais pas révolutionnaire. Pour un founder ou un PM qui démarre, c'est potentiellement la première fois qu'il peut produire seul un support visuel qui ne ressemble pas à un slide 2015.

C'est cette extension du périmètre utilisateur qui met le marché du design collaboratif sous pression. Figma reste inattaquable sur la partie multi-joueurs et vectorielle avancée. Mais le segment « j'ai besoin d'un mockup crédible vite, sans équipe design », qui représente une part non négligeable des projets naissants, peut basculer vers Claude Design.

Claude Design face à Figma, Lovable et v0

Chaque outil joue sur une zone différente du parcours. Les comparer sans nuance donne des fausses équivalences. Voici ce qu'il faut retenir de chacun.

Figma reste la référence du design collaboratif vectoriel. Gratuit jusqu'à 3 fichiers, 16$/mois par éditeur ensuite. Son moat tient en trois mots : multi-joueurs, composants, librairies. Figma Make (la fonction IA de Figma) génère des prototypes à partir d'un prompt, mais sans extraction de design system ni handoff natif vers du code de production. Les équipes design installées ne basculeront pas vers Claude Design. Elles ajouteront Claude Design à leur stack pour l'exploration rapide.

Lovable génère des apps full-stack fonctionnelles, avec BDD et auth intégrées. C'est l'outil le plus proche d'un « MVP en un prompt ». Il importe désormais des designs Figma via un lien partagé, mais ne déduit pas de design system depuis un codebase. Sa force : la couche backend fonctionne dès la première itération, ce que Claude Design ne fait pas (Claude Design produit du front, Claude Code génère le back en second temps). Sa faiblesse : les limites qu'on voit apparaître après le prototype, côté scaling, sécurité et qualité du code.

v0 de Vercel est le plus orienté dev parmi ces outils. Il importe aussi depuis Figma, et produit du code React/Tailwind directement utilisable. Moins polyvalent sur les exports (pas de Canva, pas de PPTX), mais plus robuste sur la partie code généré. Complémentaire de Figma pour les équipes dev-centric.

Claude Design se positionne à l'intersection : extraction de design system depuis un codebase, prototypes interactifs avec voix/vidéo/3D/appels IA, exports multi-formats, handoff vers Claude Code. La promesse est de couvrir plus largement que chacun de ses concurrents, au prix d'une consommation de tokens élevée et d'une absence de collaboration temps réel.

Trois verdicts nets ressortent de ce match. Claude Design ne remplace pas Figma pour l'édition collaborative en équipe. Il ne remplace pas Canva pour les assets sociaux rapides. Mais il annule l'étape bancale entre le mockup et le code. Et c'est précisément là que beaucoup de projets patinent aujourd'hui.

Le vrai pari : fermer la boucle « idée → page en ligne »

Le positionnement produit d'Anthropic devient clair en empilant les briques. Claude pour la conversation et le raisonnement. Claude Code pour le dev avec 1 million de tokens de contexte. Claude Cowork pour la collaboration d'équipe autour de documents. Claude Design pour le visuel et le prototype. Les MCP pour tout connecter (Webflow, Supabase, n8n...).

Anthropic ne construit pas un concurrent de Figma. Anthropic construit un ensemble intégré pour fabriquer des produits numériques. Dans cette logique, Claude Design est la brique qui manquait entre l'idée et le code. La démission de Mike Krieger du board de Figma trois jours avant le lancement (commentée notamment dans TechCrunch) confirme que la stratégie est assumée.

Le handoff Claude Design vers Claude Code est la pièce cruciale. Une fois le design validé, Claude Design empaquette le tout dans un bundle qu'on passe à Claude Code avec une instruction unique. Claude Code reprend alors le design system, les composants, la structure, et produit du code.

Sur le papier, c'est la promesse que peu d'outils ont réellement tenue. Aucun outil de vibe coding n'a réussi jusqu'ici à faire passer de l'idée à la prod sans rupture. En pratique, le handoff reste encore à auditer : le code produit par Claude Code est fonctionnel, mais demande la même revue qu'un autre code IA (sécurité, scaling, tests).

Les angles morts qu'on voit déjà

Le coût en tokens. C'est le premier sujet qui remonte chez les early users. Une review publiée par VibeCoding rapporte un témoignage où deux sessions de design ont consommé 58% de la limite hebdomadaire Pro. Les outputs de Claude Design sont riches (HTML complet, interactions, assets), et cette richesse coûte. Sur le plan Pro à 20$/mois, quelques sessions intensives vident rapidement le quota. Anthropic pousse vers Max (100-200$/mois) pour un usage régulier, ce qui repositionne Claude Design comme un outil d'équipe plus que d'essai individuel.

La collaboration temps réel absente. Claude Design est single-seat conversationnel. Deux designers ne peuvent pas éditer le même projet simultanément. Le partage se fait par URL scopée à l'organisation, avec droits view ou edit, mais aucun curseur live, aucun commentaire en direct façon Figma. Si votre culture design est multi-joueurs, c'est une limite structurelle, pas un oubli temporaire.

Le design system extrait reste une inférence. Claude Design ne lit pas votre design system, il le déduit. Sur les edge cases (variants rares, tokens contextuels, composants scoped), l'inférence se trompe régulièrement. Sur un projet existant, prévoir une phase de re-prompting pour corriger le mapping. Sur un projet from scratch, le design system généré est cohérent mais générique, et ne prendra pas la personnalité d'une marque sans intervention humaine.

Le code généré n'est pas production-ready. « Fonctionne en démo » est différent de « tient 10 000 utilisateurs ». Les pièges récurrents qu'on voit sur les projets Lovable et v0 pourront se retrouver ici : scaling de la base de données, sécurité, gestion de l'auth, migrations, intégrations tierces, tests, monitoring. Claude Design + Claude Code accélère la génération. Pas la validation.

Accessibilité, SEO, performance : les angles aveugles. Les prototypes générés sont visuellement convaincants. En pratique : l'accessibilité (ARIA, contraste, navigation clavier, lecteurs d'écran) n'est pas auditée automatiquement, le SEO on-page (hiérarchie des titres, schema, meta, sitemap) est absent du scope, et les Core Web Vitals (LCP, INP, CLS) ne sont pas optimisés. Sur un produit qui doit ranker, convertir et durer, ces trois angles morts deviennent des sujets à traiter avant la mise en ligne.

Du prototype Claude Design au produit en prod

Ce qu'on dit aux personnes qui nous contactent avec un prototype IA en main est toujours la même chose : clarifier à quel niveau elles en sont avant de décider des étapes suivantes.

En phase de validation. Vous testez une idée, vous pitchez à des investisseurs, vous faites tourner un concept en interne, vous avez besoin d'un one-pager marketing pour une campagne courte. Dans ces cas, le prototype Claude Design est le livrable final. Exportez en PDF, en Canva ou en URL, partagez, itérez. C'est exactement le cas d'usage pour lequel l'outil a été pensé.

En phase de passage à l'échelle. Votre produit doit servir plus de quelques centaines d'utilisateurs simultanés, ranker sur Google et sur les AI engines, gérer des données sensibles (auth, paiement, RGPD), s'intégrer à un SI existant, ou être maintenu sur plusieurs années. Là, le prototype Claude Design est un point de départ. Pas un produit. Le passage à la prod demande un travail d'ingénierie et de design system qui dépasse ce que l'outil peut faire seul.

Entre les deux. C'est le cas le plus fréquent. Le prototype fonctionne, il plaît, il pourrait passer en prod, mais certaines zones semblent fragiles : le design system généré manque de variants, l'auth tient avec un élastique, la BDD n'a pas été pensée pour monter en charge. Faire auditer avant d'investir des semaines de développement évite la dette technique qu'on retrouve dans beaucoup de projets Lovable repris après coup.

Dr Lovable est le service Scroll pensé pour ces situations. Le nom garde la marque du premier cas d'usage, mais le périmètre couvre aujourd'hui l'ensemble des reprises de prototypes IA : Lovable, Bolt, v0, Framer AI, et désormais Claude Design. C'est un service de conseil et de reprise qui se décline en trois niveaux selon l'avancement du projet : consultation courte pour savoir où vous en êtes, reprise structurelle pour remettre un prototype sur les rails, et accompagnement continu pour avancer en parallèle du développement.

Sur un projet qui arrive avec un prototype Claude Design, le travail comprend généralement : audit du design system extrait par Claude et consolidation de ce qui manque, revue du code produit par Claude Code avec refactor de l'auth, de la BDD et de la sécurité, mise en conformité accessibilité et SEO technique, intégration aux outils métier existants (Supabase, Directus, Airtable, Webflow, CRM, ERP), et mise en prod avec du monitoring en place. L'idée est de finir ce que l'IA a commencé, avec les garde-fous qui manquaient.

Si vous avez un prototype Claude Design en chantier et que vous vous posez la question de la suite, parlons-en. Qu'il s'agisse de Claude Design, Lovable, v0 ou un autre outil, la démarche est toujours la même : mesurer l'écart entre ce que vous avez et ce qu'un produit en production exige, puis décider ensemble ce qui a du sens.

Claude Design va accélérer de nombreuses équipes qui n'avaient pas les moyens de produire des visuels propres. Il va aussi produire une nouvelle vague de prototypes qui vont sembler prêts, et qui ne le seront pas. Exactement comme Lovable l'a fait il y a deux ans, et Bolt il y a dix-huit mois. Nos agences, la nôtre comprise, utilisent ces outils tous les jours. L'enjeu n'est pas de choisir entre l'IA et l'expertise humaine, mais de savoir à quel moment l'une prend le relais de l'autre pour qu'un projet tienne vraiment.