Figma AI.

L’IA aux côtés du système de design

Dans un produit conçu en équipe, il ne suffit pas de dessiner un bouton ressemblant : il faut employer le bon composant et les états nécessaires. Figma AI aide à travailler avec le contexte existant du design : rechercher des éléments, effectuer des modifications répétitives, retoucher des images et affiner les maquettes. Il s’agit de fonctions intégrées à Figma, et non d’un modèle universel distinct aux fonctions identiques dans tous les modes.

Conception, images et prototypes

La page actuelle décrit un agent d’IA, la retouche d’images, des outils de texte et Figma Make pour transformer une idée ou un design en prototype et en application web. L’accès varie selon les produits et les formules. Les fonctions nouvelles ou en accès anticipé ne doivent pas être considérées comme automatiquement incluses pour chaque membre.

Pour les contenus visuels, des fonctions permettent de supprimer l’arrière-plan, de modifier et de générer des images. Pour une interface fonctionnelle, d’autres détails comptent : cohérence des composants, états au survol et d’erreur, textes longs et comportement selon les tailles d’écran. Un aperçu réussi ne suffit pas à confirmer toutes ces propriétés.

Exemple : harmoniser un écran de paramètres

Prenez l'écran de démonstration avec les notifications et demandez de préparer plusieurs options de regroupement des paramètres. Indiquez quels composants et textes ont déjà été approuvés et lesquels peuvent être modifiés. Ne mettez pas les données réelles des utilisateurs dans des exemples uniquement par souci de crédibilité.

Après la modification, vérifiez que les noms des paramètres, le sens des interrupteurs et l'état par défaut ont été conservés. Dans le prototype, parcourez le chemin dans les deux sens. Examinez séparément le focus clavier et l'affichage sur petit écran : la conformité visuelle au système de design ne garantit pas l'accessibilité.

Conservez la variante approuvée dans le système commun de composants. Sinon, la prochaine retouche d'un écran voisin risque de créer à nouveau des interrupteurs, des espacements et des noms légèrement différents pour un même paramètre.

Ce qu'apporte MCP et où fonctionne l'agent externe

Le serveur MCP officiel transmet aux agents le contexte structuré de la mise en page et, dans les modes pris en charge, vous permet de modifier le contenu de la toile. La documentation distingue le rôle du serveur et celui de l’agent AI : les informations sur les composants et les styles ne sont pas automatiquement transformées en code de production fini.

Figma Make et les intégrations programmatiques répondent à des besoins différents. Transmettre une maquette au développeur, créer un prototype interactif et modifier un véritable dépôt de code exigent chacun des vérifications et des droits adaptés. La documentation développeur précise les limites liées au client, à la licence utilisateur et à la fréquence des appels.

Crédits, licences utilisateur et contrôle de l’équipe

Figma utilise un système de crédits d’IA. Ils sont inclus dans les formules et les licences utilisateur, mais leur nombre, leur fréquence de renouvellement et les actions disponibles varient. Certaines petites fonctions ne consomment pas de crédits ; le coût des tâches confiées à un agent dépend de leur complexité et du contexte. Vérifiez les limites et les prix exacts dans le tableau en vigueur.

Les administrateurs peuvent gérer l’accès à l’IA et les conditions d’utilisation des contenus. Avant d’importer un projet confidentiel, vérifiez les paramètres de l’organisation et l’autorisation de transmettre le contexte à un agent externe. Après la génération, procédez aux vérifications habituelles du design et des aspects techniques : l’assistant d’IA n’en dispense pas.

Pour quelles tâches convient-il

• Affiner l'interface en tenant compte du système de design
• Préparer un prototype interactif dans Make
• Modifier les images et le texte à l'intérieur de la conception
• Transmettre un contexte structuré à un agent via MCP