Optimiser son workflow, simplement
Lorsque vous travaillez en équipe, il est important d'organiser vos fichiers. Définir des règles spécifiques vous permettra de toujours savoir où trouver une information, et facilitera la vie de ceux qui récupèreront le projet, une fois votre mission terminée. Je vais donc vous donner les quelques astuces que je met en place de mon côté, pour optimiser la propreté de vos fichiers de travail.
Nommez vos pages
Mon fichier Figma standard est divisé en différentes pages qui m'aident à organiser les différentes phases de conception ( brouillon, révision, wireframes, interfaces, assets, composants et enfin archives ). La page de brouillon est mon espace de travail par défaut, où je suis libre d'essayer différentes idées et de travailler sur des écrans jusqu'à ce qu'ils soient prêts à être présentés. Lorsque je décide que quelqu'un doit réviser un écran spécifique, je le déplace sur la page de révision. Les interactions avec le fichier restent ainsi simples pour toutes les personnes concernées. La personne qui révise mes conceptions sait que seule la page de révision est importante pour elle. Si un écran est révisé et finalisé, il est déplacé vers la page concernée selon la phase de projet. Si nécessaire, j'ajoute également des notes importantes pour le développement. Les développeurs peuvent donc trouver toutes les informations relatives aux écrans sur la même page. La page assets me permet de gérer l'ensemble des à côté de la conception d'interface : les favicons, les images de partage, les visuels de communication pour les réseaux sociaux, etc...
Nommez vos plans de travail
Une fois que vous avez mis en place votre structure de fichiers de base, il est facile de savoir où chercher les choses. Mais si vous n'organisez pas les écrans sur la page elle-même, cela peut vite devenir chaotique. La chose la plus importante est de nommer l'écran ou du composant que vous êtes en train de concevoir. Je sais qu'il peut être difficile de penser à donner un nom lorsqu'on est en pleine conception, mais si vous prenez l'habitude de nommer les choses tout de suite, cela n'interrompra pas du tout votre travail.
Les noms de calques doivent également être spécifiques et faciles à comprendre. N'utilisez pas de noms génériques tels que "Homepage 01", "Homepage 02", etc. Essayez plutôt de résumer le contenu de l'écran en quelques mots. Par exemple, si j'ai deux idées pour la conception d'un dashboard, l'une avec trois colonnes et l'autre avec cinq colonnes, je nomme les écrans "Dashboard 3 columns" et "Dashboard 5 columns". Il est ainsi plus facile de comprendre ce que l'écran montre et quelle est la différence entre les deux idées. Et de fait, lorsque quelqu'un d'autre souhaite donner son avis sur une idée, il peut clairement s'y référer par son nom.
Utilisez les sections
Les sections sont une fonctionnalité relativement nouvelle sur Figma. Elles vous permettent de regrouper différents plans de travail entre eux. Cette fonction est très utile pour organiser des écrans qui vont ensemble. J'utilise souvent les sections pour regrouper différentes variantes d'un écran ou pour créer un groupe d'écrans appartenant à la même fonctionnalité.
Je recommande également l'utilisation de sections lors de la remise des conceptions en vue de leur mise en œuvre. Si vos sections sont bien identifiées, toutes les personnes qui travaillent ou consultent votre fichier Figma pourront trouver plus facilement ce qu'elles cherchent.
Utilisez les composants
Lorsque l'on travaille sur un design, il est souvent nécessaire de décliner plusieurs variants sur un élément. Si vous n'utilisez pas de composants, la mise à jour cohérente de tous les éléments peut représenter un travail considérable. Il est plus rapide d'essayer quelque chose de nouveau en utilisant des composants, car vous verrez les effets d'un changement sur l'ensemble de vos écrans. Je vous recommande donc de transformer vos éléments de conception en composants dès que possible.
Si vous souhaitez essayer différents rendus pour un composant, vous pouvez tirer parti de la fonction de variantes de Figma. Une fois que vous avez décidé de la variante que vous souhaitez utiliser, supprimez le style abandonné de vos variantes de composants pour que tout soit bien organisé.
Archivez vos tests
Il est souvent utile de disposer d'idées et d'itérations plus anciennes de vos interfaces. Il se peut que vous décidiez de revenir sur une idée plus ancienne ou qu'un client vous demande de comparer deux itérations. C'est pourquoi je ne supprime généralement aucune proposition, mais je place toutes les idées rejetées sur une page d'archives. De cette façon, je peux toujours revenir en arrière, si nécessaire, ou me servir d'un élément comme base pour un futur projet.
Veillez simplement à détacher tous les composants de vos écrans archivés si vous souhaitez geler la conception. ( J'en parle dans cet article )
Sur la page d'archive elle-même, veillez à utiliser une structure de base afin de pouvoir retrouver rapidement ce que vous cherchez lorsque vous revenez en arrière. Une bonne façon de procéder consiste à trier les idées par ordre chronologique et à placer les itérations les plus récentes en haut de la page. En fonction de la taille de votre projet de conception, il peut également être judicieux de diviser les écrans de chaque itération en sujets ou caractéristiques spécifiques.
