Ajoutez une nouvelle fonctionnalité à votre app à partir de vos prototypes Figma
Jules Boiteux
Fondateur de Vibe Coding Academy
Transformez un prototype Figma en fonctionnalité sans l'aide d’un développeur.
Les équipes tech souffrent d’un goulot d’étranglement : trop de fonctionnalités restent enfermées dans Figma, faute de temps ou de ressources pour être développées. L’IA change cette réalité en accélérant fortement le passage du design au code.
Dans ce cours, vous apprendrez à utiliser le server MCP Figma dans Cursor pour transformer vos écrans Figma en code prêt à intégrer dans une application. Vous verrez aussi comment générer une app à partir d’un user flow conçu dans Figma Jam ou d’un prototype créé dans Figma Make. Nous utiliserons une app de démo, mais tout pourra être appliqué à vos apps existantes dans V0, Lovable ou Bolt.
Que ce soit pour créer un prototype avancé, amorcer un produit ou ajouter une nouvelle fonctionnalité, vous verrez à quel point MCP Figma fluidifie le workflow design → code.
Et surtout : aucune compétence en développement n’est requise. Vous pourrez produire un frontend professionnel sans être développeur.
À la fin, vous saurez :
– Installer le server MCP Figma ;
– Transformer un design (UI, Jam, Make) en code fonctionnel ;
– Itérer rapidement sur une fonctionnalité à partir de vos maquettes.
What you’ll learn
Comprendre le fonctionnement du workflow design → code avec Figma et Cursor, implémenter et utiliser le MCP Figma, utilisez le MCP Figma
Comprenez l'intérêt, et les cas d'usage d'un workflow consistant à convertir du design en code
Comprenez le fonctionnement et les fonctionnalités du server MCP Figma
Maîtrisez la configuration du serveur MCP Figma
Générez votre premier prototype avec Figma Make
Transformez un prototype Figma Make en Frame et convertissez-le en code
Prenez en main les fonctionnalités essentielles de Cursor
Lancez une application de démonstration en local
Découvrez l’agent IA intégré à Cursor
Learn directly from Jules
Jules Boiteux
Fondateur de Vibe Coding Academy, plateforme d’e-learning sur le vibe coding
Who this course is for
Product Designer
Product Manager / Product Owner
Software Engineer
✅ Ne plus attendre les développeurs
✅ Transformer vos écrans Figma en prototype
✅ Développer votre MVP sur la base de guidelines
❌ Une formation basée sur de la théorie
❌ Vous refusez d'utiliser les fonctionnalités IA de Figma
❌ Vous refusez d'appréhender un IDE
Prerequisites
Vous avez déjà créée des écrans dans Figma
"Pas besoin d'une connaissance poussée de Figma, mais vous devriez avoir déjà appréhendé l'outil Figma pour designer des écrans"
Vous devez avoir créée un compte sur Figma
Le serveur MCP de Figma est accessible sur tous les plans, y compris le plan gratuit. Toutefois, le plan Professional est recommandé
Vous devez disposer d'un éditeur de code type Cursor, VS Code, Windsurf,..
L’apprentissage est centré sur Cursor, mais s’applique tout aussi bien à d’autres éditeurs de code.
What's included
Live sessions
Learn directly from Jules Boiteux in a real-time, interactive format.
Un dépôt Github contenant le code d'une application de démo
"Pour mettre en pratique le cours directement. Le dépôt est public, et il est expliqué comment importer le code qu'il contient en local sur Cursor. Vous pourrez utiliser cette application pour ""jouer"" avec le serveur MCP Figma "
Une librairie de composants disponibles sous la forme d'un design system Figma
Le cours utilise directement une librairie de composants gratuites qui sera mise à disposition des étudiants
Une méthode complète
Pour l'appliquer directement dans votre entreprise: installation du serveur MCP, utilisation de Figma Make, Transformation en écran Figma, Transformation de ces écrans en code dans Cursor
Maven Guarantee
This course is backed by the Maven Guarantee. Students are eligible for a full refund up until the halfway point of the course.
Course syllabus
3 live sessions • 11 lessons
Week 1
Feb
18
Transformer vos écrans Figma en application | Session Live 1
Introduction au workflow design → code avec Figma et Cursor
Week 2
Feb
25
Transformer vos écrans Figma en application | Session Live 2
Rebranding d'une application à partir du server MCP Figma
Schedule
Live sessions
1 hr / week
Wed, Feb 18
11:30 AM—12:30 PM (UTC)
Wed, Feb 25
11:30 AM—12:30 PM (UTC)
Wed, Mar 4
11:30 AM—12:30 PM (UTC)
Un espace Slack unique pour échanger et apprendre ensemble
Frequently asked questions
€199
EUR