Design Figma

Explorer l'interface

Exploration

• Utiliser les outils d'IA dans Figma Design
• Utilisation des fichiers de design
• Découvrir UI3 : la nouvelle interface de Figma
• Concevez, créez des prototypes et explorez les propriétés des calques dans la barre latérale droite.

Utilitaires de fichier

• Utiliser le menu d'actions dans Figma Design
• Raccourcis clavier dans Figma

Créer des designs

Créer et modifier des calques

• Cadres dans Figma Design
• Outils de formes
• Masques

Travail avec des calques

• Identifier les objets correspondants
• Relations entre les parents, enfants et frères et sœurs
• Ajuster l'alignement, la rotation et la position
• Organisez vos canevas à l'aide de sections
• Mesurer les distances entre les calques
• Afficher les 6 articles

Typographie

• Ajouter une police à Figma Design
• Parcourir et appliquer les polices
• Ajouter des liens au texte
• Ajouter du texte en chinois, japonais ou coréen

Couleur, dégradés et images

• Ajouter des images aux fichiers de design

Propriétés supplémentaires

• Appliquer et ajuster les propriétés des tracés
• Ajuster le rayon des coins et le lissage

Utiliser la disposition automatique

• Utilisez le flux de disposition automatique de la grille
• Guide de disposition automatique
• Ajouter une mise en page automatique à un design

Créer des systèmes de design

Composants

• Créer des composants interactifs avec des variantes
• Découvrir les propriétés de composant

Variables

• Aperçu des variables, collections et modes
• Créer et gérer des variables
• Appliquer des variables aux designs

Créer et partager les bibliothèques

• Guide des bibliothèques dans Figma
• Publier une bibliothèque

Utiliser des bibliothèques

• Créer et insérer des instances de composant

Dev Mode

Explorer l'interface

• Guide sur Dev Mode
• Parcourir les designs dans Dev Mode
• Dev Mode pour les administrateurs

Inspecter les designs

• Guide d'inspection
• Comparer les modifications dans Dev Mode
• Ajouter des mesures et annoter les designs dans Dev Mode
• Les variables dans Dev Mode

Transformez vos designs en code

• Code Connect
• Utiliser les extraits de code dans Dev Mode
• Ajouter un lien vers les ressources de développement dans Dev Mode
• Figma pour VS Code

Dev Mode dans votre organisation

• Statuts et notifications Dev Mode
• Vue Focus de Dev Mode
• Vue Ready for Dev dans Dev Mode
• Gérer les paramètres Dev Mode d'une organisation

Créer des prototypes

Guides

• Guide de prototypage dans Figma
• Gestion des états des prototypes
• Utiliser des vidéos dans les prototypes
• Déclencheurs de prototype
• Actions de prototype

Créer des prototypes

• Créer des interactions
• Créer et gérer des flux de prototypes
• Défilement du prototype et options de défilement

Prototypage avancé

• Créer des animations avancées avec l'animation automatique
• Modes de variable dans les prototypes
• Actions multiples et logique conditionnelle
• Utilisation d'expressions dans les prototypes
• Utilisation de variables dans les prototypes

Afficher les prototypes

• Définir l'appareil de prototype et les paramètres d'arrière-plan
• Lisez vos prototypes

Importer et exporter

• Importez des fichiers dans le navigateur de fichiers
• Importer des fichiers Sketch
• Exporter depuis Figma
• Formats et paramètres d'exportation

Travailler ensemble sur les mêmes fichiers

Commentaires

• Ajouter des commentaires aux fichiers
• Gérez les notifications par e-mail pour les commentaires sur les fichiers

Outils multi-utilisateurs

• Consulter l'historique de visualisation de vos fichiers

Création de branches et fusion

• Guide de la création de branche
• Partager une branche
• Examiner les modifications d'une branche
• Fusionner la branche avec le fichier principal
• Fusions ou mises à jour incomplètes