Figma

Script

Objectif

Créer un design file dans un projet et se repérer dans son interface et son espace de travail.

Principe

L'interface d'un design file s'articule autour d'un espace de travail central, entouré du menu et des outils, des panneaux Layers et Assets à gauche et des onglets Design et Prototype à droite.

Démonstration pas à pas

1. Renommer un projet d'équipe, supprimer le fichier de présentation et créer un design file.
2. Renommer le fichier puis parcourir le menu Figma, la barre d'outils et les boutons du haut (Share, Dev Mode, prototype, zoom).
3. Identifier les panneaux de gauche et de droite ainsi que l'aide accessible par le point d'interrogation.
4. Créer une frame iPhone comme repère, puis zoomer et se déplacer avec la molette, l'outil main ou la barre d'espace.
5. Afficher la grille de pixels (View, Pixel grid) et activer Snap to pixel grid.
6. Afficher les règles (Shift+R) et tirer des repères horizontaux ou verticaux.

À retenir

• Le zoom à la molette se fait à l'endroit où se trouve le curseur.
• La grille de pixels évite les demi-pixels et les décalages à l'intégration.
• L'interface et les langues proposées (anglais ou japonais au moment de l'enregistrement) peuvent avoir évolué depuis.