Design UI : 10 bonnes raisons d’utiliser Figma
Quand il s’agit d’énumérer les outils de conception qui s’offrent à un designer d’interfaces, nous avons aujourd’hui principalement ces outils : Sketch, Adobe XD, Invision Studio, Figma. Chacun a ses propres spécificités et atouts, mais il y en a un qui se démarque du lot à mon avis. Vous l’aurez peut-être deviné, il s’agit de Figma !
Figma est une application web qui permet la création d’interfaces pour le web et le mobile. Disponible dans le navigateur, elle peut aussi être téléchargée sous la forme d’une application standard. Comme elle fonctionne entièrement en ligne, elle nécessite bien sûr un accès à internet. Si vous ne connaissez pas encore Figma, ou hésitez encore à franchir le cap, voici 10 arguments pour vous convaincre de l’adopter :
3 applications en 1
Alors que nous utilisons souvent plusieurs applications au quotidien (Sketch, Invision, Zeplin…), Figma regroupe toutes les fonctions dont une équipe de production a besoin : conception, présentation, prototypage et inspection de code à elle toute seule. Petit plus non négligeable : l’utilisation est gratuite pour 3 projets et 2 éditeurs, avec toutes les fonctionnalités essentielles.
Courbe d’apprentissage rapide
Si vous êtes déjà familier avec Sketch, la prise en main de Figma ne nécessitera pas un temps d’apprentissage démesuré, compte tenu des nombreuses similarités de l’interface et des outils entre les deux applications.
Travail collaboratif
La principale différence entre Figma et les autres outils de design réside dans le travail collaboratif. En d’autres termes, vous pouvez être plusieurs designers à travailler en même temps sur un seul et même fichier. Plus besoin de se partager des fichiers VXX, ou de “merger” des éléments dans un document final. Tout ce que vous faites est automatiquement sauvegardé et visualisable en temps réel. Cela peut cependant être un peu déroutant pour certains, car on appréhende d’être “observé” en train de travailler, mais il faut voir les bons côtés : la transparence et le partage facilitent la collaboration à tous les niveaux !
Présentations et retours simplifiés
Comme je le disais un peu plus haut, plus besoin d’exporter le design une fois le travail effectué : la présentation se fait dans l’outil, et il est possible aux personnes de votre équipe de laisser des commentaires directement sur les maquettes. Finis donc les exports d’écrans et le jonglage entre Sketch et Invision.
Partage ciblé
Vous avez la possibilité de partager un projet entier, une page, ou seulement un “artboard” via le partage au moyen d’un seul et unique hyperlien. Adieu aux indications laborieuses pour guider votre interlocuteur, il suffit de le mener directement là où vous le désirez !
Flexibilité des composants
Appelés symboles dans Sketch, les “components” de Figma sont beaucoup plus flexibles à l’utilisation. Alors que la gestion des propriétés de style d’un symbole peut vite être limitée dans Sketch, Figma traite chaque propriété de manière individuelle. Cela permet de modifier indépendamment les éléments, depuis le calque de chaque instance.
Compatibilité
Comme Figma est entièrement en ligne, n’importe quelle machine disposant d’un navigateur web peut partager, ouvrir ou éditer un fichier Figma. Alors que Sketch n’est disponible que sur Mac, Figma creuse ici un fossé considérable grâce à sa large accessibilité.
Transfert au développeur facilité
L’inspection des propriétés s’effectue à même l’outil, et on peut afficher les extraits de code pour n’importe quel élément sélectionné, aux formats CSS, iOS ou Android.
Puissance des librairies partagées (Team Libraries)
Si l’on souhaite créer un “Design System” au sein d’une entreprise, Figma se révèle être l’outil de prédilection. Une fois la librairie créée et partagée au sein de l’équipe, chaque personne peut avoir accès et récupérer les éléments dont elle a besoin, sans avoir à se soucier de savoir s’il s’agit de la bonne et dernière version. (Cette fonctionnalité n’est toutefois pas disponible dans la version gratuite.)
Prototypage épuré et intuitif
⇨ YouTube, “Figma Tutorial: Smart Animate and Drag Triggers.”
Les principales fonctionnalités de prototypage sont intégrées et faciles d’utilisation. Nul besoin d’exporter les écrans pour voir le rendu de votre prototype. De plus, la fonctionnalité “Smart Animate” permet de créer avec une grande facilité des animations sophistiquée entre deux écrans. Wow.
À vous de jouer !
