Objectifs de la formation
Cette formation vous permet d'identifier et d'utiliser une méthodologie optimisée dans la construction des fichiers Figma, d'optimiser votre workflow avec une sélection des meilleurs plugins Figma et d'exporter et de partager vos projets UX/UI Design.
Public
Graphiste, webdesigner, UI Designer, UX Designer, chef de projet ou toute personne devant utiliser Sketch dans le cadre de la conception et création d'interface.
Durée
14 heures en présentiel sur 2 jours
Pré-requis
Avoir une bonne maîtrise des fonctionnalités de base de Figma.
Formateur
Formateur Expert en design d'interface, UX/UI Design.
Méthode pédagogique
8 participants maximum, un poste par stagiaire et un support de cours est remis à la fin du stage. La formation est constituée d'explications théoriques, de démonstrations suivies d'exercices de mise en pratique.
Modalité de validation des acquis
Évaluation en ligne des acquis via un questionnaire. Attestation de fin de stage. Émargement quotidien d'une feuille de présence.
Programme Figma Perfectionnement
Préambule sur Figma- Rappeler les fonctionnalités phares du logiciel Figma, ses spécificités par rapport aux autres solutions
- Découvrir les dernières actualités du logiciel Figma
Acquérir une méthodologie optimisée dans la construction de fichiers .fig- Organiser son projet de l’UX à l’UI : web design vs app mobile
- Acquérir une bonne convention de nommage (fichiers, pages, frames, calques, styles, composants…)
- Mettre en place des grilles (grid, columns, rows) et des repères
- Mettre en place des styles de forme, de texte, d'effets, de grille partagés
- Créer des composants et exploiter les fonctionnalités de l’override (textes, images, composants imbriqués)
- Exploiter les contraintes de redimensionnement
- Ajouter et gérer des librairies partagées par plusieurs documents
- Organiser ses composants
- Profiter des ressources et modèles externes spécifiques à Figma
- Profiter d’une sélection des meilleurs plugins et services spécifiques à Figma
Optimiser votre workflow avec une sélection des meilleurs plugins Figma- Disposer de faux contenu (textes et images)
- Accéder directement aux banques d'images et d'icônes
- Créer et importer des contenus personnalisés (textes et images)
- Mettre à jour le contenu importé
- Renommer, réorganiser les calques et frames en masse
- Automatiser les transformations des éléments sur les différents devices
- Automatiser les positions des éléments en fonction du contenu
Créer un prototype avancé avec des animations- Maîtriser les différentes possibilités d'interactions et d'animations
- Différencier Navigate To, Open Overlay et Swap With
- Créer un système de navigation à plusieurs niveaux
Exporter et partager son projet Figma- Visionner ses écrans sur un mobile
- Exporter ses écrans en fichiers pdf, jpg et png ou sur le cloud
- Exporter les éléments pour la production (code et assets)
- Profiter des options de collaborations
- Exporter les éléments sur Zeplin
- Organiser son projet de l’UX à l’UI : web design vs app mobile
- Acquérir une bonne convention de nommage (fichiers, pages, frames, calques, styles, composants…)
- Mettre en place des grilles (grid, columns, rows) et des repères
- Mettre en place des styles de forme, de texte, d'effets, de grille partagés
- Créer des composants et exploiter les fonctionnalités de l’override (textes, images, composants imbriqués)
- Exploiter les contraintes de redimensionnement
- Ajouter et gérer des librairies partagées par plusieurs documents
- Organiser ses composants
- Profiter des ressources et modèles externes spécifiques à Figma
- Profiter d’une sélection des meilleurs plugins et services spécifiques à Figma
Optimiser votre workflow avec une sélection des meilleurs plugins Figma- Disposer de faux contenu (textes et images)
- Accéder directement aux banques d'images et d'icônes
- Créer et importer des contenus personnalisés (textes et images)
- Mettre à jour le contenu importé
- Renommer, réorganiser les calques et frames en masse
- Automatiser les transformations des éléments sur les différents devices
- Automatiser les positions des éléments en fonction du contenu
Créer un prototype avancé avec des animations- Maîtriser les différentes possibilités d'interactions et d'animations
- Différencier Navigate To, Open Overlay et Swap With
- Créer un système de navigation à plusieurs niveaux
Exporter et partager son projet Figma- Visionner ses écrans sur un mobile
- Exporter ses écrans en fichiers pdf, jpg et png ou sur le cloud
- Exporter les éléments pour la production (code et assets)
- Profiter des options de collaborations
- Exporter les éléments sur Zeplin
- Maîtriser les différentes possibilités d'interactions et d'animations
- Différencier Navigate To, Open Overlay et Swap With
- Créer un système de navigation à plusieurs niveaux
