année de création : 2016
Créé par : Dylan Field & Evan Wallace
Intégration Webflow : Plugin officiel disponible
Notre point de vue sur Figma
Figma est devenu un standard universel parce qu'il résout deux problèmes que Sketch et Adobe XD n'ont jamais résolus : la collaboration en temps réel et l'accès web sans installation. Pour une agence qui passe ses fichiers entre designers, devs, clients et freelances, c'est non négociable.
Sur les projets Webflow, Figma joue un rôle particulier : il sert de source de vérité visuelle ET de cahier des charges de développement. Bien structuré, il rend l'intégration Webflow quasi mécanique. Mal structuré, il fait perdre des jours en allers-retours.
Quand on choisit Figma
- Tout projet de site Webflow. C'est notre standard, pas une option.
- Projet avec design system. Composants, variants, tokens via Tokens Studio, le tout versionné dans des fichiers de bibliothèque.
- Collaboration designer + dev en parallèle. Le mode Dev de Figma rend l'inspection des espacements, couleurs et typographies immédiate côté Webflow.
- Prototypage interactif. Quand on doit valider des micro-interactions ou des flows de navigation avant de développer.
Quand on déconseille Figma
- Génération d'assets vectoriels lourds. Pour des illustrations complexes ou des maquettes print, Adobe Illustrator reste plus puissant.
- Animation avancée timeline. Figma reste limité sur l'animation. Pour du motion design sérieux, on bascule sur After Effects ou Rive.
- Édition photo poussée. Figma sait recadrer et appliquer des filtres basiques. Pour de la retouche, Photoshop ou Affinity Photo.
Comment on l'utilise concrètement chez Justa
1. Structure de fichier standardisée
Chaque projet a la même architecture : page Cover, page Discovery (recherche, références), page Wireframes, page UI (par section du site), page Components (design system), page Handoff (annotations dev). Cette uniformité permet à n'importe quel membre de l'équipe de prendre la suite d'un projet sans onboarding.
2. Design tokens via Tokens Studio
Couleurs, typographies, spacing, radius, shadows sont stockés en tokens. Cela permet de faire évoluer le design system sans casser les écrans existants, et facilite le mapping vers les variables Webflow.
3. Plugin Webflow Labs pour le handoff
On utilise le plugin officiel Webflow pour exporter des structures HTML pré-stylées. Le résultat n'est jamais utilisable tel quel, mais ça accélère la création des composants Webflow d'environ 30 %.
4. Versioning sérieux
Chaque sprint est une branche, chaque livraison client est un snapshot nommé. On peut revenir 3 mois en arrière sur n'importe quel design.
Alternatives qu'on connaît aussi
- Penpot. Open source, gagne du terrain, à surveiller pour les clients à forte exigence de souveraineté logicielle.
- Sketch. Toujours utilisé par certaines équipes, mais l'écosystème s'est déplacé.
- Pencil.dev. Outil IA-First intéressant pour créer rapidement des variantes de mockups


