Aller au contenu

Ressources

Articles, guides, templates et retours d'expérience sur le design produit et l'IA.

Article

Claude Code et Figma MCP : concevoir et implémenter sans changer d'outil

Depuis quelques mois, j'utilise Figma MCP pour lire mes maquettes directement depuis Claude Code, générer des composants fidèles au design, et itérer en temps réel entre la maquette et le code. Ce workflow compresse le cycle conception-intégration de plusieurs jours à quelques heures. Je conçois dans Figma, puis Claude Code lit les specs des composants, les espacements, les tokens et la mise en page via MCP, et génère du code prêt pour la production, fidèle à l'intention initiale. Le plus intéressant n'est pas la vitesse. C'est la qualité de la boucle de feedback : quand je vois le résultat instantanément, je prends de meilleures décisions de design parce que je les évalue en contexte, pas de manière isolée.

Article

Concevoir un design system dans Figma, puis l'implémenter avec Claude Code

J'ai récemment mené une expérimentation complète : concevoir un design system entier dans Figma (tokens, composants, variantes, documentation), puis l'implémenter sur un site dédié en Astro et Tailwind, piloté intégralement par Claude Code. Le design system couvre les fondations (couleur, typographie, espacement, élévation), les composants atomiques (boutons, inputs, badges, tags) et les patterns composites (cartes, navigation, formulaires). Ce que cette approche change dans la relation entre le design et le développement est fondamental. Le design system devient une source de vérité unique que le designer et l'IA peuvent lire. Claude Code n'interprète pas des captures d'écran, il lit des données de design structurées. L'écart entre le design voulu et le résultat implémenté se réduit à presque rien.

Article

Utiliser Claude Code sur l'ensemble d'un projet de design produit

Du cadrage fonctionnel à la production d'écrans, du prototypage à la documentation, j'ai intégré Claude Code à chaque phase d'un projet de design produit pendant six mois. Pour le cadrage, il aide à structurer les exigences et générer des diagrammes de flux utilisateur. Pour le design, il lit les fichiers Figma et produit du code de composants. Pour le prototypage, il construit des applications fonctionnelles déployées sur Vercel en quelques heures. Pour la documentation, il génère des specs techniques et des supports de handoff. Ce qui fonctionne : l'accélération est réelle sur les tâches répétitives, la génération de code et l'itération rapide. Ce qui ralentit : des instructions ambiguës produisent des résultats ambigus, ce qui rend la capacité du designer à cadrer précisément encore plus critique. Ce qui change : la posture du designer passe de quelqu'un qui livre des écrans à quelqu'un qui orchestre une chaîne de production. Le craft ne disparaît pas, il évolue.

Condamine Studio

Agents IA et prompts

32 agents et frameworks de prompts pour le design, le développement, le marketing et la productivité.

Explorer la collection