Figma : ce qu'on en pense vraiment.

Pourquoi Figma est devenu notre outil de conception exclusif

Quand on conçoit un site pour un client, le design passe systématiquement par Figma avant d'arriver dans Webflow. Ce n'est pas un hasard. C'est le résultat de plusieurs années de pratique, de comparaisons avec d'autres outils, et d'une conviction claire : Figma est aujourd'hui la meilleure solution pour concevoir des interfaces web en équipe, itérer vite et collaborer avec les clients.

Voilà ce qu'on a appris après plus de 60 projets livrés.

Ce que Figma fait mieux que tous ses concurrents

Collaboration en temps réel

C'est la fonctionnalité qui a tout changé pour nous. Plusieurs personnes sur le même fichier, en même temps, sans conflit de version. Notre CMO rédige le copy directement dans les maquettes. Notre designeuse ajuste les composants en temps réel. Le client commente sans avoir besoin d'un compte payant. Tout le monde voit la même chose au même moment.

Avant Figma, on s'envoyait des PDF, des captures d'écran, des fichiers Sketch avec des numéros de version. C'était long, inefficace, source d'erreurs. Figma a éliminé tout ça.

Les composants et l'Auto Layout

Figma a introduit une logique de composants qui ressemble beaucoup à celle de Webflow. Un bouton créé une fois, utilisé partout, modifiable en un clic global. Des grilles et des espacements qui s'adaptent automatiquement au contenu. L'Auto Layout permet de construire des interfaces qui se comportent comme du vrai CSS, ce qui rend le passage à Webflow beaucoup plus fluide.

Pour une agence qui livre des sites Webflow, c'est un avantage décisif. On conçoit dans Figma en pensant déjà à l'intégration. Les composants Figma deviennent des composants Webflow. Les espacements Figma deviennent des variables Webflow. Le handoff est propre.

Les variables et le design system

Depuis l'introduction des variables dans Figma, on peut construire de vrais design systems avec des tokens de couleur, de typographie et d'espacement. Pour les projets récurrents ou les clients avec plusieurs sites, c'est une avancée majeure. On crée les variables une fois, on les applique partout, et on peut changer l'ensemble d'un design en modifiant une seule valeur.

La bibliothèque de ressources

Figma Community propose des milliers de ressources gratuites : kits d'UI, icônes, maquettes de wireframe, plugins. Notre équipe utilise régulièrement des plugins comme Unsplash pour les photos, Iconify pour les icônes, ou Content Reel pour les données de test. Ce qui aurait pris des heures à créer from scratch se monte en quelques minutes.

Ce que Figma ne fait pas bien

Aucun outil n'est parfait. Voilà les limites qu'on a rencontrées après des années d'utilisation.

• Les performances sur les gros fichiers. Quand un projet accumule des dizaines de pages et des centaines de composants, Figma peut devenir lent. Sur des configurations moins puissantes, les latences deviennent frustrantes. On a appris à structurer nos fichiers différemment pour éviter ça.
• Le prototypage reste limité. Figma permet de créer des prototypes cliquables, mais ils restent superficiels comparés à ce qu'on peut faire avec du vrai code. Pour présenter des micro-interactions complexes ou des animations avancées, on passe directement à Webflow plutôt que de simuler dans Figma.
• La courbe d'apprentissage de l'Auto Layout. C'est un outil puissant mais contre-intuitif au départ. Les membres juniors de l'équipe mettent du temps avant de maîtriser les comportements d'Auto Layout, surtout pour reproduire fidèlement des layouts CSS complexes.
• Le prix. Figma est passé d'un modèle freemium généreux à une tarification plus restrictive. Les équipes qui utilisaient intensivement le plan gratuit ont dû s'adapter. Pour une petite agence, le coût par éditeur peut représenter un budget non négligeable.

Notre workflow Figma vers Webflow

Voilà comment on intègre Figma dans notre process concret :

• Phase ARMO : on crée les directions artistiques dans Figma. Palettes de couleurs, typographies, style des visuels. Le client choisit une direction et on part de là.
• Phase maquettes : Pré-V1, V1, V2, VF. Chaque version est présentée en mode présentation Figma. Le client commente directement dans le fichier. On itère jusqu'à la version finale signée.
• Handoff développement : notre CTO inspecte les composants Figma, récupère les valeurs exactes (espacements, couleurs, typographies, rayons) et les intègre dans Webflow. On a développé nos propres conventions de nommage pour que le passage soit le plus fluide possible.
• Archivage : chaque projet client a son fichier Figma conservé. Si le client revient 2 ans plus tard pour une évolution, on repart de la source, pas d'une capture d'écran.

Notre retour après +60 projets

Figma est l'outil de design que tous les membres de l'équipe utilisent quotidiennement. Il a remplacé Sketch, Adobe XD, et les prototypes PowerPoint qu'on faisait encore il y a quelques années.

Ce qu'on a appris : la qualité d'un site Webflow dépend en grande partie de la qualité des maquettes Figma qui le précèdent. Un fichier Figma bien structuré, avec des composants propres et un Auto Layout cohérent, donne un site Webflow propre, maintenable, et facile à faire évoluer.

Si vous avez des questions sur comment on utilise Figma dans nos projets, on peut en parler.