Ce que change l'IA dans le processus de design

La promesse des agents IA dans le développement produit n'est pas uniquement une question de vitesse. L'accélération est réelle, mais construire vite un mauvais produit ne sert à rien. Ce qui change réellement, c'est la capacité à itérer plus tôt, plus souvent et sur des artefacts plus concrets.

Figma s'inscrit dans cette logique en s'ouvrant aux workflows agentiques via son serveur MCP. L'idée : permettre à des agents comme Cursor, Claude Code ou Codex d'interagir directement avec le canvas de Figma (c’est-à-dire l’espace de travail), d'y lire des composants, d'y écrire des frames, de manipuler des variables. Le tout sans que le designer ait à effectuer le travail de copier-coller entre deux environnements.

MCP, agents et skills : de quoi parle-t-on exactement ?

Avant d'entrer dans les workflows, trois concepts méritent d'être compris clairement.

• Un agent, c'est un système logiciel qui utilise l'IA pour atteindre des objectifs et accomplir des tâches. Dans le développement produit, un agent peut planifier un projet, écrire du code, interpréter des visuels ou orchestrer d'autres agents. Cursor, Codex et Claude Code en sont des exemples courants.
• MCP signifie Model Context Protocol. C'est un standard ouvert qui définit comment les agents communiquent avec d'autres logiciels, comme Figma. Un serveur MCP permet à un agent de récupérer du contexte depuis des sources externes pour prendre de meilleures décisions. Le serveur MCP de Figma permet concrètement de :
• Traduire du code en designs Figma
• Créer et modifier des éléments sur le canvas
• Retransformer ces designs en code

Ce pont bidirectionnel entre design et code est ce qui rend le workflow agentique avec Figma utile.

• Un skill, enfin, c'est un fichier texte contenant un ensemble d'instructions qu'un agent peut apprendre et réutiliser pour accomplir une tâche spécifique. Toute tâche répétitive qu'on reprompt régulièrement à son agent est un bon candidat pour devenir un skill. Les skills liés à ces workflows sont disponibles sur la page Figma Community et peuvent être installés en copiant leur lien GitHub dans l'agent.

Il existe aussi un skill particulier, /figma-use, aussi appelé « write to canvas ». Il permet à un agent de créer et de modifier un fichier Figma réel en utilisant les composants, variables et styles existants du projet.

Workflow 1 : importer un prototype codé dans Figma

Quand l'utiliser : quand un prototype fonctionnel existe en code et qu'on veut le ramener dans Figma pour le réviser, itérer ou partager.

Beaucoup d'équipes commencent aujourd'hui à designer directement dans le code, souvent dans un « prototype playground » : un environnement bac à sable avec du vrai code et des écrans issus de l'application de production, mais sans risque d'affecter le code de production ni les designs finaux. Ce workflow s'applique à cette situation, mais aussi à n'importe quel prototypage en code.

Étape 1 : importer le prototype dans Figma

Le skill /prototype-to-figma prend en charge l'import. Il capture un prototype qui tourne en local et place chaque...