Aller au contenu principal
Retour aux formations
FigmaDesign SystemTokensVariablesDev ModeMCP

Figma expert & Design System

Améliorer sa productivité sur Figma, construire et maintenir un Design System avec les variables et tokens. Maîtriser le Dev Mode et le prototypage itératif pour mieux communiquer ses intentions design aux développeurs.

Outils
Figma
GitHub
Storybook
Zeroheight
Anthropic
Sur devisDemander un devisUne question ? Contactez-nous
Durée2 jours (14h)
FormatPrésentiel/Distanciel
NiveauIntermediaire a Avance
Participants2 à 8 personnes
Figma expert & Design System

À propos de cette formation

Améliorer sa productivité sur Figma, construire et maintenir un Design System avec les variables et tokens. Maîtriser le Dev Mode et le prototypage itératif pour mieux communiquer ses intentions design aux développeurs.

Ce que vous apprendrez

Structurer ses variables et design tokens sur Figma
Creer des composants complexes et flexibles avec variables et modes
Adopter la bonne architecture de construction de librairie pour le Dev-Mode
Specifier ses composants pour Dev-Mode et le MCP
Integrer l'IA dans son workflow de design system
Integrer un composant de la librairie avec le MCP de Figma

Programme détaillé

  • Introduction à la méthodologie des "design tokens" et conseils pour bien débuter.
  • Créer et structurer ses variables sur Figma, organiser et éditer les collections, importer des tokens via un json.
  • Analyser son design et savoir le transcrire en composants et variables conformes aux spécifications front-end.
  • Adopter la bonne architecture de construction de librairie et de composants pour le Dev-Mode
  • Créer les taxonomies de tokens et les alias
  • Penser les composants pour le multi-thème et les différents supports
  • Appliquer les tokens aux composants pour les interactions
  • Scoping et préparation de la documentation pour les développeurs.
  • Comprendre la notion de contexte et de pattern design liés aux tokens sémantiques
  • Utiliser les slots components de Figma pour gagner en flexibilité
  • Utiliser l'IA pour documenter petit à petit les évolutions et poser les bases d'un langage commun
  • Intégrer les contraintes des développeurs dans son approche systémique (framework, langages, profils ..)
  • Manipuler les variables de types boolean et créer des prototypes conditionnels basés sur les modes
  • Intégrer le dev-mode pour mieux collaborer avec les développeurs.
  • Savoir spécifier et rédiger une documentation technique à destination d'un agent IA.
  • Intégrer et itérer sur ses conceptions avec Figma Make.
  • Introduction au MCP et aux méthodologies de Hand-off avancée
  • Intégrer un composant de la librairie avec le MCP de Figma dans une application.

À qui s'adresse cette formation

UX/UI
Product designers
Design System Managers

Votre formateur

Romain DAO

Romain DAO

Design Engineer & Formateur Figma

Spécialiste Figma et Design System depuis plus de 15 ans. Content creator et partenaire privilégié Figma en France, j'aide les équipes produit à construire des interfaces performantes et des systèmes de design durables. +30 000 personnes formées via ma communauté.

En savoir plus sur Romain

Questions fréquentes

Formez-vous au cœur de Paris

Chaque formation est disponible en présentiel à Paris 15e (jusqu'à 8 designers, ambiance conviviale), en intra-entreprise dans vos locaux, ou à distance en visio.

À Paris, 15e

Accueillez votre équipe dans notre espace de formation — jusqu’à 8 designers, ambiance conviviale et studieuse.

Chez vous (intra)

Je me déplace directement dans vos locaux pour former votre équipe sur place.

À distance

Formation en visio, même qualité d’accompagnement, où que vous soyez.

Formations similaires

D'autres formations qui pourraient vous interesser

Voir toutes les formations

Travaillons ensemble

Je vous accompagne de la stratégie à la conception Figma, en passant par la mise en place de votre Design System et la formation de vos équipes.

Demander un devis