Figma : ce qu'on en pense vraiment.

On utilise Figma pour concevoir chaque site qu'on livre. Voilà comment on l'intègre dans notre workflow Webflow, ce qu'il fait mieux que ses concurrents, et ce qu'on aurait voulu savoir avant de commencer.

Partager sur :

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. On explique tout ce processus dans notre guide convertir une maquette Figma en site Webflow.

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.

Pourquoi Figma et Webflow forment un duo si efficace

Figma et Webflow partagent la même philosophie : le visuel d'abord, le code géré proprement en dessous. Cette parenté n'est pas anodine. Les concepts d'Auto Layout dans Figma correspondent presque un pour un aux logiques de flexbox et de grid dans Webflow. Les composants Figma trouvent leur équivalent direct dans les composants Webflow.

Concrètement, un designer qui maîtrise Figma apprend Webflow beaucoup plus vite, parce que la logique structurelle est la même. C'est pour ça qu'on utilise ce duo en exclusivité chez Wenoble. Si vous voulez comprendre pourquoi on a fait de Webflow notre outil de production unique, notre fiche Webflow détaille tout, et notre guide C'est quoi Webflow ? pose les bases pour les débutants.

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.

Questions fréquentes sur Figma

Figma est-il gratuit ?

Figma propose un plan gratuit qui permet de créer et collaborer sur un nombre limité de fichiers. Pour un usage professionnel avec plusieurs projets et éditeurs, il faut passer sur un plan payant facturé par éditeur. Le plan gratuit reste suffisant pour découvrir l'outil ou pour un projet ponctuel.

Peut-on transformer une maquette Figma directement en site ?

Pas automatiquement de manière fiable. Il existe des plugins d'export, mais le code généré est rarement propre ou maintenable. Chez Wenoble, on reconstruit chaque maquette proprement dans Webflow, en s'appuyant sur les valeurs exactes du fichier Figma. C'est plus long, mais le résultat est un site performant et évolutif.

Figma remplace-t-il Photoshop ou Illustrator ?

Pour le design d'interface web et mobile, oui, largement. Figma n'est pas fait pour la retouche photo avancée ou l'illustration vectorielle complexe, domaines où Photoshop et Illustrator restent supérieurs. Pour concevoir des sites et des applications, Figma est aujourd'hui le standard.

Faut-il Figma pour travailler avec une agence Webflow ?

Pas de votre côté. En tant que client, vous pouvez consulter et commenter les maquettes Figma via un simple lien, sans compte ni logiciel à installer. C'est justement l'un des grands avantages de Figma pour la collaboration : la validation des maquettes se fait sans friction.

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.

Figma est aujourd'hui utilisé par la majorité des équipes design dans le monde, un statut confirmé par des sources indépendantes comme G2 où il cumule des dizaines de milliers d'avis. Notre expérience terrain le confirme : c'est devenu un standard incontournable.

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

Tu souhaites résumé l'article avec une IA :

Portrait en noir et blanc d'un homme portant une veste sombre et une chemise blanche.Homme souriant avec barbe et moustache portant un t-shirt gris devant un fond marron.
Portrait d'un homme souriant portant une chemise blanche et une cravate beige.Un homme souriant debout devant une porte vitrée dans un cadre professionnel.
Homme souriant en pull noir assis devant un fond flou avec des lumières chaudes.
Portrait en noir et blanc d'un homme d'âge moyen au regard direct.Homme souriant portant des lunettes et une chemise bleue avec un fond dégradé violet et orange.
Femme souriante portant des lunettes et un pull à motifs noir et blanc, appuyée sur une table en bois.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.Portrait d'une femme aux cheveux longs noirs, portant un haut noir et des boucles d'oreilles.
Homme souriant portant des lunettes, chemise bleue et gilet noir devant un mur blanc.Portrait en noir et blanc d'un homme barbu regardant par une fenêtre, porté un pull à côtes.
Homme portant une casquette verte et une chemise dans une voiture décapotable.
Femme souriante avec un gros chignon portant un manteau marron, éclairée par une lumière orangée.
Portrait d'une femme souriante aux cheveux bruns, portant une robe jaune à motifs, en extérieur.Femme souriante aux cheveux bouclés et lunettes, posant avec la main sur la joue.Femme souriante aux cheveux blonds longs portant un pull rouge, en extérieur avec un fond flou.
Portrait d'une femme souriante avec cheveux blonds et vêtements clairs devant un rideau beige.
Homme avec cheveux bouclés noirs et barbe courte, regardant devant, en plein air avec ciel bleu et arbres.Personne en veste orange tenant un fusil agenouillée dans la neige avec maisons et montagnes en arrière-plan.Femme souriante aux cheveux courts, vêtue d'un haut rayé et d'une veste noire, debout en intérieur.
Portrait d'une femme souriante aux cheveux longs, portant une chemise blanche dans un intérieur flou.Homme souriant portant un pull-over blanc sur un fond neutre.Un homme travaille sur un ordinateur portable dans un endroit avec une fenêtre en arrière-plan.
Portrait d'une femme souriante aux cheveux courts devant un arbre en arrière-plan flou.Un homme assis sur un canapé dans un salon éclairé par une lampe chaleureuse.Portrait d'une femme souriante avec des lunettes noires et une chemise violette devant un fond vert flou.
Un homme souriant portant un blazer se tient devant un panneau du Royal College of Physicians.Portrait d'un homme aux cheveux bruns courts portant une chemise blanche sur fond bleu.Une femme organise des tables dans un espace intérieur avec des étagères en arrière-plan.Esthéticienne appliquant un soin sur le visage d'une cliente allongée en institut.Jeune homme souriant tenant un biscuit, avec un arbre et un buisson en arrière-plan.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.
Portrait en noir et blanc d'un homme portant une veste sombre et une chemise blanche.Homme souriant avec barbe et moustache portant un t-shirt gris devant un fond marron.
Portrait d'un homme souriant portant une chemise blanche et une cravate beige.Un homme souriant debout devant une porte vitrée dans un cadre professionnel.
Homme souriant en pull noir assis devant un fond flou avec des lumières chaudes.
Portrait en noir et blanc d'un homme d'âge moyen au regard direct.Homme souriant portant des lunettes et une chemise bleue avec un fond dégradé violet et orange.
Femme souriante portant des lunettes et un pull à motifs noir et blanc, appuyée sur une table en bois.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.Portrait d'une femme aux cheveux longs noirs, portant un haut noir et des boucles d'oreilles.
Homme souriant portant des lunettes, chemise bleue et gilet noir devant un mur blanc.Portrait en noir et blanc d'un homme barbu regardant par une fenêtre, porté un pull à côtes.
Homme portant une casquette verte et une chemise dans une voiture décapotable.
Femme souriante avec un gros chignon portant un manteau marron, éclairée par une lumière orangée.
Portrait d'une femme souriante aux cheveux bruns, portant une robe jaune à motifs, en extérieur.Femme souriante aux cheveux bouclés et lunettes, posant avec la main sur la joue.Femme souriante aux cheveux blonds longs portant un pull rouge, en extérieur avec un fond flou.
Portrait d'une femme souriante avec cheveux blonds et vêtements clairs devant un rideau beige.
Homme avec cheveux bouclés noirs et barbe courte, regardant devant, en plein air avec ciel bleu et arbres.Personne en veste orange tenant un fusil agenouillée dans la neige avec maisons et montagnes en arrière-plan.Femme souriante aux cheveux courts, vêtue d'un haut rayé et d'une veste noire, debout en intérieur.
Portrait d'une femme souriante aux cheveux longs, portant une chemise blanche dans un intérieur flou.Homme souriant portant un pull-over blanc sur un fond neutre.Un homme travaille sur un ordinateur portable dans un endroit avec une fenêtre en arrière-plan.
Portrait d'une femme souriante aux cheveux courts devant un arbre en arrière-plan flou.Un homme assis sur un canapé dans un salon éclairé par une lampe chaleureuse.Portrait d'une femme souriante avec des lunettes noires et une chemise violette devant un fond vert flou.
Un homme souriant portant un blazer se tient devant un panneau du Royal College of Physicians.Portrait d'un homme aux cheveux bruns courts portant une chemise blanche sur fond bleu.Une femme organise des tables dans un espace intérieur avec des étagères en arrière-plan.Esthéticienne appliquant un soin sur le visage d'une cliente allongée en institut.Jeune homme souriant tenant un biscuit, avec un arbre et un buisson en arrière-plan.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.
Portrait en noir et blanc d'un homme portant une veste sombre et une chemise blanche.Homme souriant avec barbe et moustache portant un t-shirt gris devant un fond marron.
Portrait d'un homme souriant portant une chemise blanche et une cravate beige.Un homme souriant debout devant une porte vitrée dans un cadre professionnel.
Homme souriant en pull noir assis devant un fond flou avec des lumières chaudes.
Portrait en noir et blanc d'un homme d'âge moyen au regard direct.Homme souriant portant des lunettes et une chemise bleue avec un fond dégradé violet et orange.
Femme souriante portant des lunettes et un pull à motifs noir et blanc, appuyée sur une table en bois.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.Portrait d'une femme aux cheveux longs noirs, portant un haut noir et des boucles d'oreilles.
Homme souriant portant des lunettes, chemise bleue et gilet noir devant un mur blanc.Portrait en noir et blanc d'un homme barbu regardant par une fenêtre, porté un pull à côtes.
Homme portant une casquette verte et une chemise dans une voiture décapotable.
Femme souriante avec un gros chignon portant un manteau marron, éclairée par une lumière orangée.
Portrait d'une femme souriante aux cheveux bruns, portant une robe jaune à motifs, en extérieur.Femme souriante aux cheveux bouclés et lunettes, posant avec la main sur la joue.Femme souriante aux cheveux blonds longs portant un pull rouge, en extérieur avec un fond flou.
Portrait d'une femme souriante avec cheveux blonds et vêtements clairs devant un rideau beige.
Homme avec cheveux bouclés noirs et barbe courte, regardant devant, en plein air avec ciel bleu et arbres.Personne en veste orange tenant un fusil agenouillée dans la neige avec maisons et montagnes en arrière-plan.Femme souriante aux cheveux courts, vêtue d'un haut rayé et d'une veste noire, debout en intérieur.
Portrait d'une femme souriante aux cheveux longs, portant une chemise blanche dans un intérieur flou.Homme souriant portant un pull-over blanc sur un fond neutre.Un homme travaille sur un ordinateur portable dans un endroit avec une fenêtre en arrière-plan.
Portrait d'une femme souriante aux cheveux courts devant un arbre en arrière-plan flou.Un homme assis sur un canapé dans un salon éclairé par une lampe chaleureuse.Portrait d'une femme souriante avec des lunettes noires et une chemise violette devant un fond vert flou.
Un homme souriant portant un blazer se tient devant un panneau du Royal College of Physicians.Portrait d'un homme aux cheveux bruns courts portant une chemise blanche sur fond bleu.Une femme organise des tables dans un espace intérieur avec des étagères en arrière-plan.Esthéticienne appliquant un soin sur le visage d'une cliente allongée en institut.Jeune homme souriant tenant un biscuit, avec un arbre et un buisson en arrière-plan.Femme aux cheveux bouclés et lunettes roses regardant vers le bas avec un léger sourire.

Maintenant, on passe à l'action ?

Un échange gratuit pour voir comment on peut structurer ton acquisition ensemble.