Compétences visées

À venir...

Contenu 

Découvrir Figma

• Décrire le logiciel Figma et ses principaux usages : illustration vectorielle, UX Design (wireframe), UI Design
• Identifier 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

Prendre en main le logiciel

• Nommer et explorer les différentes zones de l’interface Figma
• Connaître les conventions d’usage dans les outils de design
• Mémoriser les raccourcis principaux
• Ajuster les préférences

Designer des formes pour des interfaces web/app

• Créer des espaces de travail (frames) et des calques
• Insérer des formes prédéfinies, créer des formes personnalisées
• Sélectionner, positionner, transformer, supprimer des éléments : taille, couleurs fond et contour, dégradés, motifs, transformation, rotation…
• Ajouter des effets : ombre interne ou externe, flou
• Maîtriser et modifier les courbes de Bézier
• Utiliser les opérations booléennes (union, subtract, intersect, exclude)
• Utiliser les masques
• Ajouter et agencer des titres, des paragraphes
• Importer et éditer des éléments vectoriels (logo, icône, illustration…) et matriciels (image)

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 des plugins et services complémentaires indispensables spécifiques à Figma

Créer un prototype avec des animations de transition

• Définir la première frame du prototype
• Créer des connexions entre les différents écrans
• Maîtriser les différentes possibilités d'interactions et d'animations
• Ajouter un lien externe

Exporter et partager son projet Figma

• Visionner ses écrans sur un mobile
• Exporter ses écrans en fichiers pdf, jpg et png
• Partager ses écrans sur le cloud
• Exporter les éléments pour la production (code et assets)