Figma - concevoir des design d'interface

Objectifs

Prendre en main l'outil Figma
Créer des styles de couleur et de texte sur Figma
Créer des composants sur Figma
Optimiser les maquettes pour faciliter les déclinaisons responsive : gérer les contraintes, utiliser les grilles et la fonctionnalité d'auto-layout
Créer un prototype interactif avancé : utiliser les différents modes d'interaction et d'animation
Préparer les exports et transmettre les éléments graphiques aux développeurs

Programme de la formation

1. Prendre en main l'outil figma
Créer et nommer une frame
Ajouter et éditer un texte
Ajouter et éditer une forme
Ajouter des commentaires
Partager le fichier et ajouter des collaborateurs
Atelier pratique : créer des wireframes en utilisant l'ensemble des fonctionnalités de figma
2. Créer des styles sur figma
Créer et éditer des styles de couleur
Créer et éditer des styles de texte
3. Créer des composants sur figma
Créer des composants
Créer et éditer des instances
Redimensionner des composants
Nommer les composants
4. Optimiser les maquettes pour faciliter les déclinaisons responsive : gérer les contraintes, utiliser les grilles et la fonctionnalité d'auto layout
Gérer les contraintes
Utiliser l'auto layout
Ajouter une grille
Atelier pratique : créer une librairie de composants en utilisant les fonctionnalités avancées de figma.
5. Créer un prototype interactif avance : utiliser les différents modes d'interaction et d'animation
Faire des connexions entre les frames
Comprendre les différentes interactions : smart animate
Paramétrer et partager un prototype interactif
6. Préparer les exports et transmettre les éléments graphiques aux développeurs
Faire des exports
Télécharger / importer un fichier
Inspecter sur figma
Partager une librairie et créer une team
Atelier pratique : décliner les différents écrans et créer un prototype avancé

Validation et sanction

Attestation de formation

Type de formation

Non certifiante

Sortie

Sans niveau spécifique