Figma est un outil de conception puissant et est le premier choix de la plupart des concepteurs UX/UI en tant que programme de conception. Vous pouvez créer tellement de choses dans Figma, et c'est un programme facile à apprendre.
En tant que designers, nous cherchons souvent à gagner du temps, nous passons donc nos précieuses heures à créer du bon travail plutôt qu'à parcourir les menus. Nous avons compilé une liste de raccourcis Figma utiles qui rationaliseront votre flux de travail.
Ce simple raccourci à une touche est un moyen rapide de mettre à l'échelle vos éléments. Frappez le K touche, puis sélectionnez l'objet que vous devez redimensionner. Tout ce que vous avez à faire est de cliquer et de faire glisser un point d'ancrage et votre objet reste à l'échelle tout en le redimensionnant selon vos besoins.
L'outil Frame est un outil très utilisé dans Figma lors de la création de plusieurs panneaux de cadre pour les conceptions de prototypes. Frappe F sur votre clavier affiche l'outil en un clic, vous permettant de dessiner ou de dimensionner votre cadre rapidement.
Vous pouvez dessiner le cadre directement en cliquant et en faisant glisser votre curseur, ou une fois l'outil Cadre sélectionné, vous pouvez saisir les tailles souhaitées dans les cases de dimension du menu du cadre à droite.
3. Basculer entre les modes de conception et de prototype
Le Changement + E raccourci vous permet de basculer entre le mode Conception et le mode Prototype. Le même raccourci fonctionne quel que soit le mode à partir duquel vous démarrez et vers lequel vous basculez. Voir notre guide du débutant sur Figma apprendre les différences entre ces modes.
Alternativement, il existe des raccourcis plus spécifiques à cet effet. Autre (Les fenêtres) / Option (Mac) + 8 peut être utilisé pour passer du mode Prototype au mode Conception, tandis que Autre (Les fenêtres) / Option (Mac) + 9 passe du mode Conception au mode Prototype. Évidemment, Changement + E c'est plus facile, mais c'est bien d'avoir des options.
4. Sélectionnez l'élément le plus profond en un clic (sélection approfondie)
Lors de la conception en plusieurs couches ou avec des images intégrées, il peut être difficile de sélectionner rapidement un élément. Pour gagner du temps en cliquant ce qui semble être une douzaine de fois pour sélectionner votre calque le plus bas, utilisez plutôt ce raccourci.
Sur un Mac, maintenez Commande + Cliquez sur l'élément, et sous Windows, Ctrl + Cliquez sur. Une simple touche permet d'économiser des minutes de clics insensés pour sélectionner un élément de la couche inférieure.
5. Sortir d'un niveau après avoir sélectionné l'élément le plus à l'intérieur
Une fois que vous avez réussi à sélectionner l'élément le plus profond de votre conception, vous réaliserez peut-être que vous vouliez sélectionner un élément d'un niveau plus proche, c'est facile. Une fois que vous avez trouvé l'élément le plus profond, appuyez sur Changement + Entrer pour reculer d'un niveau. Vous pouvez le faire pour tous les niveaux.
6. Réduire tous les calques
Lors de la conception dans Figma, votre panneau de calques commencera à s'étendre et aura potentiellement l'air un peu désordonné, surtout lorsque vous convertir HTML en un dessin Figma. Pour réduire vos calques, appuyez simplement sur Autre + L (Windows) ou Option + L (Mac).
Si vous avez sélectionné un élément lors de l'utilisation de ce raccourci, le calque avec cet élément restera ouvert. Sélectionnez n'importe où sur le plan de travail pour désélectionner tous les éléments et utilisez le raccourci pour réduire tous les calques.
7. Afficher ou masquer les grilles de mise en page
L'utilisation de grilles de mise en page est le meilleur moyen de s'assurer que votre conception atteint certaines proportions et peut être mise à l'échelle correctement pour divers appareils. Bien qu'ils soient utiles, vous ne voulez pas toujours que les grilles s'affichent.
L'activation et la désactivation des grilles de mise en page sont différentes sur un Mac et sur Windows. Sur un Mac, appuyez sur Ctrl + g pour l'activer ou le désactiver. Si vous utilisez Windows, il s'agit d'un raccourci à trois touches; Ctrl + Changement + 4. Ils sont différents, mais ils font la même chose.
8. Placer plusieurs photos à la fois
Si vous avez conçu une mise en page avec des formes d'espace réservé prêtes pour vos images, il peut être frustrant d'insérer les images une par une. Ce raccourci vous permet de placer plusieurs photos et de sélectionner simplement l'espace réservé (ou n'importe où sur votre plan de travail) pour placer chaque photo individuelle.
Pour les utilisateurs de Mac, appuyez sur Commande + Changement + K pour ouvrir la fenêtre de dialogue pour trouver vos images. Sous Windows, c'est Ctrl + Changement + K pour que vous puissiez trouver et placer plusieurs photos dans votre conception Figma. Si tu créer un modèle principal dans Figma, c'est un excellent raccourci à utiliser.
9. Copier n'importe quelle image au format PNG
Lorsque vous utilisez des images dans votre conception Figma, vous pouvez avoir un assortiment de formats de fichiers, mais peut-être que votre client a besoin de PNG. Vous pouvez copier n'importe quelle image au format PNG, quel que soit son format d'origine.
Sélectionnez votre image choisie et appuyez sur Commande + Changement + C sur Mac et Ctrl + Changement + C sous Windows pour le copier au format PNG. Vous pouvez facilement utiliser ce raccourci pour assurer un format d'image de haute qualité, surtout si vous êtes créer des présentations avec Figma.
10. Eyedrop une couleur de n'importe où
La suppression d'une couleur est une fonction pratique lorsque vous transférez une couleur d'une partie de votre dessin à une autre. Ce raccourci clavier rapide vous permet d'ouvrir la pipette en une seconde et d'échantillonner une couleur depuis n'importe où sur votre plan de travail.
Sur Mac, appuyez sur Ctrl + C, et sous Windows c'est la touche alphabétique je. Une fois que vous avez appuyé sur les raccourcis clavier, déplacez la cible de la pipette sur la couleur que vous souhaitez utiliser et cliquez une fois pour échantillonner la couleur.
11. Ouvrez l'onglet Ressources
L'onglet Ressources abrite les menus Composants, Plugins et Widgets. Bien qu'il n'y ait pas de raccourcis pour ouvrir ces menus individuellement, le raccourci Ressources permet de gagner du temps: Changement + je. Tu peux utilisez des plugins pour créer et ajouter des maquettes à vos conceptions Figma.
Gagnez du temps avec les raccourcis Figma
Les concepteurs utilisent généralement des raccourcis dans leur travail pour gagner du temps et de l'énergie, et travailler dans Figma n'est pas différent. Ces raccourcis Figma ne font qu'effleurer la surface des raccourcis que vous pouvez utiliser dans le programme.
Ces raccourcis ne sont pas évidents ou faciles à trouver, alors apportez vos nouvelles connaissances à Figma et délectez-vous des informations que de nombreux concepteurs mettent des mois ou des années à comprendre.
