Formation Figma Avancée
Perfectionnez-vous sur Figma : techniques avancées pour des interfaces complexes
Objectifs
À l’issue de la formation, vous pourrez :
- Comprendre et utiliser efficacement des fonctionnalités comme l'Auto-Layout, les contraintes,
et les variants pour des designs responsives et modulaires.
- Implémenter et gérer des tokens pour les couleurs, typographies, et espacements, assurant ainsi
la cohérence visuelle à travers les différents projets.
- Créer des prototypes détaillés avec des animations et des micro-interactions pour améliorer
l'expérience utilisateur.
- Collaborer efficacement avec des équipes de développement et d'autres designers en utilisant
des espaces d'équipe, des fonctionnalités de partage, et de gestion des permissions.
- Utiliser des plugins et widgets pour automatiser les tâches répétitives et optimiser les flux de
travail de design.
- Préparer et documenter efficacement les spécifications des projets de design pour une
transmission fluide aux équipes de développement.
Durée du stage
3 jours (soit 21 heures)
Lieu du stage
À distance (via Dendreo Live)
Public et pré-requis
Public :
Professionnels du design ayant une expérience avec Figma : UI/UX designers, chefs de projet digital,
concepteurs d'interface, responsables produit, et designers d'expérience utilisateur.
Pré-requis :
Maîtrise intermédiaire de Figma et expériences préalables en conception d'interfaces.
Pour participer à une formation Figma de niveau expert, les participants devraient être compétents et
avoir une expérience pratique avec les fonctionnalités avancées suivantes de Figma :
● Connaissance de l'interface de Figma : Savoir naviguer dans l'interface et utiliser les outils de
base.
● Manipulation de base des éléments : Être capable d'ajouter, déplacer, et redimensionner des
objets.
● Utilisation des calques : Comprendre comment organiser et gérer des calques dans Figma.
● Création et application des styles : Savoir créer des styles pour les textes et les couleurs.
● Introduction aux composants : Avoir une notion de base sur la création et l'utilisation des
composants.
● Fonctionnalités de collaboration : Connaissance des fonctions de partage et de commentaire
dans Figma.
Nombre de stagiaires par session
Entre 8 et 10 stagiaires maximum
Moyens pédagogiques et techniques
Profil du formateur :
Consultant expert en UI design
Moyens pédagogiques :
- Mise en application via des exercices guidés puis via des exercices semi-guidés.
- Le stage est 70 % pratique, 30 % théorique.
Moyens techniques :
- Séance de formation à distance
- Le support pédagogique est fourni à chaque participant, ainsi qu’un exemplaire du livre «UX
Design & Ergonomie des interfaces » - 7ᵉ édition
- Votre ordinateur portable
Suivi et évaluation
L'évaluation des compétences acquises est faite en continu pendant la formation lors des exercices
pratiques
Programme
Programme de la formation
JOUR 1 : Révision et renforcement des acquis avec Figma
1. Mise à jour des compétences :
○ Raccourcis et astuces pour travailler plus vite
○ Maîtriser les contraintes et l'Auto-Layout
○ Utilisation avancée des composants et des variants
Exercice pratique : Intégration des contraintes, Auto-Layout, composants et variants dans un projet
concret.
2. Collaboration efficace avec Figma :
○ Utiliser les espaces d'équipe et partager des fichiers
○ Gérer les permissions pour une collaboration sans faille
○ Organiser efficacement les pages et fichiers pour les workflows d'équipe
Exercice pratique : Appliquer les retours via les commentaires, suivre le cycle de vie du composant, et
comparer les modifications en restaurant une version antérieure.
JOUR 2 : Techniques de design avancées dans Figma
3. Les tokens de design :
○ Comprendre les design tokens et leurs bénéfices
○ Utilisation pratique des tokens pour les couleurs, typographies et espacements
○ Application des tokens aux animations et micro-interactions
Exercice pratique : Appliquer des tokens à des composants et écrans de prototypes, intégrer des
animations de base et créer des micro-interactions.
4. Projet réel de design :
Exercice pratique : Développer une application ou un site web en utilisant des composants dynamiques,
des contraintes, l'Auto-Layout et des tokens. Intégrer des micro-interactions pour tester et affiner les
prototypes.
JOUR 3 : Intégration et automatisation pour une collaboration efficace
5. Optimisation des flux de travail et livraison :
○ Présentation des plugins et outils compatibles avec Figma (storybook, zeroheight)
○ Stratégies pour optimiser les livraisons avec les équipes de développement
6. Évaluation et perfectionnement :
○ Présentation des projets par les participants et feedback personnalisé
○ Discussion sur les meilleures pratiques pour la livraison de projets de design