Approfondissement
S’initier à la création assistée par IA avec Figma Make pour générer, itérer et structurer des prototypes fonctionnels exploitables
1 jour / 7 heures
Prix : 750 € HT
Réf. : W14
Compétences visées
Utiliser Figma Make pour concevoir des interfaces UI/UX assistées par IA, structurer des prompts efficaces, affiner les résultats générés et préparer les livrables pour un usage collaboratif.
Objectifs
- Identifier les usages, principes et limites de Figma Make
- Structurer des prompts efficaces pour générer des interfaces
- Générer et itérer des interfaces avec Figma Make
- Récupérer le design généré et le retravailler dans Figma
- Affiner et livrer un prototype pour l’intégration
- Lire et partager le code généré par Figma Make
Public concerné
Cette formation s’adresse aux UI / UX / Product designers ou à des profils hybrides design / produit / front-end
Prérequis
Il est nécessaire d’être autonome dans Figma (frames, auto-layout, composants) pour suivre cette formation
Programme
Identifier les usages, principes et limites de Figma Make
- Situer Figma Make dans l’écosystème Figma
- Distinguer prototypage IA vs design prêt à développer
- Différencier IA intégrée et IA générative
- Analyser les types de génération possibles (UI, interactions, composants)
- Comprendre la logique prompt → génération → itération
- Identifier les cas où privilégier l’IA ou le design manuel
-> Quiz récapitulatif
Structurer des prompts efficaces pour générer des interfaces
- Structurer un prompt orienté UI/UX
- Préciser fonctionnellement et/ou visuellement une demande
- Intégrer les contraintes, le contexte, des références
- Identifier les biais de génération et les erreurs fréquentes
-> Exercices : reformuler plusieurs prompts à partir d’un même besoin produit pour tester leurs effets
Générer et itérer des interfaces avec Figma Make
- Générer un écran à partir d’un brief produit
- Modifier un écran existant par prompt ou interface
- Ajouter des interactions et états (hover, click, navigation)
- Lire, tester et critiquer les résultats générés
-> Exercice : générer un écran principal, le simplifier et ajouter des interactions / des états
Récupérer le design généré et le retravailler dans Figma
- Analyser la structure des calques générés
- Nettoyer et réorganiser les éléments
- Harmoniser les styles et transformer en composants
- Préparer un design collaboratif lisible, modulaire et évolutif
-> Exercice : transformer un écran généré en un design exploitable en équipe
Affiner et livrer un prototype pour l’intégration
- Évaluer l’UX du prototype généré
- Réaliser des ajustements visuels cohérents
- Structurer un fichier Figma prêt pour le handoff dev
- Identifier les tâches relevant encore de l’humain
-> Exercice : affiner l’écran généré avant la livraison
Lire et partager le code généré par Figma Make
- Accéder au code généré dans Make
- Comprendre la différence avec l’inspecteur Figma
- Lire le code des composants et interactions
- Partager le code avec les développeurs
-> Exercice : extraire et partager le code généré d’un écran complet
Consolider les apprentissages et anticiper les usages
- Récapituler les étapes et bonnes pratiques
- Construire une check-list
- Identifier les limites éthiques et pratiques du travail avec IA
- Découvrir quelques ressources pour aller plus loin
-> Exercice : créer une checklist d’usage de Figma Make
Nos prochaines sessions
Artistes / Auteurs affiliés à la maison des artistes ?
Découvrez nos conditions préférentielles
Profil de l’intervenant
UI Designer avec plus de 10 ans d’expérience en animation de formation.
Ressources
- Supports de cours dématérialisés
- Abonnement de 3 mois à tuto.com
- Accès illimité par mail à la hotline Swash
Tuto.com
Chaque participant bénéficie de 3 mois d'abonnement à tuto.com
Modalités en présentiel
Parcours pédagogique :
Quiz de positionnement ❯ 1 jour présentiel ❯ Évaluation des acquis
Méthode pédagogique :
Expositive + démonstrative : exposés théoriques, démonstrations, mise en pratique, feedbacks personnalisés
Moyens techniques :
- 1 poste par participant (Mac ou PC, selon votre choix), équipé de Figma, fourni par nos soins
- Poste de l’intervenant relié à un grand écran ou vidéoprojecteur
Modalités en distanciel
Parcours pédagogique :
Quiz de positionnement ❯ 1 classe virtuelle synchrone ❯ Évaluation des acquis
Méthode pédagogique :
Expositive + démonstrative : exposés théoriques, démonstrations, mise en pratique, feedbacks personnalisés
Moyens techniques :
- Classe virtuelle créée par nos soins
- Chaque apprenant participe à la session avec son ordinateur, connecté à Internet, et équipé :
- d’un micro et d’une caméra
- de l'application Figma
Méthodes d'évaluation
- Validation des acquis pendant la formation grâce à des quiz et à la réalisation d’exercices pratiques
- Suivi d'acquisition des objectifs pédagogiques par l'intervenant
- Évaluation à chaud (remplie en fin de formation) et à froid (à 60 jours)
