Figma
Inclure dans drupal.fr

Il y a encore quelques années, la conception d'une interface numérique ressemblait à un parcours du combattant. Le designer travaillait de son côté sur un logiciel lourd, exportait des dizaines de versions de maquettes (du fameux Maquette_VFinale_Definitive_V3.pdf), et les envoyait par e-mail aux développeurs et aux clients. 

Puis Figma est arrivé et a bouleversé les codes.

Souvent réduit à un simple « outil pour dessiner des interfaces », Figma est en réalité bien plus que cela. C'est aujourd'hui une plateforme de collaboration en temps réel, pensée pour centraliser le travail de toute une équipe : designers, développeurs, chefs de projet et clients. On vous en dit plus dans la suite de cet article.

Le "google Docs" du design 

La plus grande révolution de Figma repose sur sa nature : c'est un outil entièrement basé sur le cloud. Il n'y a plus de fichiers lourds à s'échanger ni de problèmes de versions. 

Tout comme plusieurs personnes peuvent rédiger un document simultanément sur Google Docs, toute une équipe peut se connecter au même fichier Figma en temps réel. Vous pouvez voir les curseurs de vos collègues se déplacer sur l'écran, observer un designer ajuster une mise en page pendant qu'un rédacteur corrige un texte directement dans la maquette. Cette transparence accélère drastiquement les itérations et élimine la frustration des échanges asynchrones.

Coté clients, cela permet de voir en temps réel le travail effectué par le designer. 

Côté équipes, cela permet de travailler à plusieurs sur un seul et même fichier, pour maximiser les temps de réalisation. 

La fin des allers-retours chaotiques

Avant, recueillir les avis d'un client ou d'un chef de projet nécessitait de faire des captures d'écran, de les coller dans une présentation, et de tenter de déchiffrer des retours du type : « Peux-tu bouger le bouton bleu un peu plus en haut à gauche de l'image 3 ? ». 

Figma a intégré un système de commentaires contextuels, permettant de simplifier les allers-retours. N'importe quel collaborateur et/ou client disposant du lien peut cliquer précisément sur un élément de l'interface (un bouton, un titre, une image) et y laisser une note. Le designer reçoit une notification, peut répondre dans le fil de discussion, et marquer le commentaire comme "résolu" une fois la modification effectuée. Tout l'historique des décisions est centralisé au même endroit.

Le "Dev Mode" : l'outil révolutionnaire pour les développeurs

Historiquement, le passage du design au développement (le handoff) a toujours été un moment de friction. Les développeurs devaient "deviner" les espacements ou utiliser des outils tiers pour extraire les couleurs et les typographies.

Aujourd'hui, Figma intègre un Dev Mode (Mode Développeur) spécialement conçu pour les équipes techniques. En un clic, l'interface change : 

  • Les développeurs peuvent inspecter n'importe quel composant pour en extraire instantanément le code (CSS, iOS, Android)
  • Ils peuvent télécharger les assets (images, icônes) dans les bons formats 
  • Ils accèdent directement aux variables du Design System (les fameux Design Tokens vus dans notre précédent article) pour s'assurer que l'intégration sera pixel-perfect 

Prototypage intégré : tester avant de coder

Pourquoi attendre qu'un site soit entièrement développé pour se rendre compte qu'un parcours utilisateur ne fonctionne pas ?

Figma permet de lier les maquettes entre elles pour créer des prototypes interactifs et cliquables. Sans écrire une seule ligne de code, il est possible de simuler le comportement d'un menu déroulant, les transitions entre deux pages, ou des animations complexes. Cela permet de présenter un résultat ultra-réaliste aux clients ou de mener des tests auprès de vrais utilisateurs en amont du projet. Un gain de temps et d'argent inestimable.

FigJam : un tableau blanc virtuel

FigJam

L'écosystème Figma s'est agrandi avec FigJam, un espace de tableau blanc interactif. Avant même de dessiner la première maquette, les équipes peuvent s'y réunir pour faire des brainstormings, cartographier des parcours utilisateurs (User Journeys), coller des post-its virtuels ou définir l'architecture de l'information du futur site. 

C'est l'outil parfait pour les ateliers de co-création et de brainstormings, particulièrement pour les équipes en télétravail.

Vous l'aurez compris, Figma n'est plus seulement le territoire exclusif des UX/UI designers. Il est devenu le hub central où gravite l'ensemble du cycle de vie d'un projet digital. En adoptant une plateforme qui favorise la transparence, fluidifie les retours et facilite le travail des développeurs, Figma transforme radicalement la façon dont les collaborateurs travaillent ensemble. 

Ajouter un commentaire

Le contenu de ce champ sera maintenu privé et ne sera pas affiché publiquement.
Vous aimerez aussi