Figma

Figma est notre outil de design unique chez Justa. Tous nos projets clients y vivent : design system, maquettes, prototypes, handoff. Cette page décrit notre méthodologie Figma vers Webflow et les plugins qu'on utilise au quotidien.

Dernière mise à jour :

5/5/2026

Informations

année de création : 2016

Créé par : Dylan Field & Evan Wallace

Intégration Webflow : Plugin officiel disponible

Démarrer un design Figma

Contacter Justa

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

Nos derniers projets réalisés avec Figma

Je veux lancer mon projet avec Justa

Nous contacter

Découvrez d'autres outils

Logo de Relume
Relume

Pour accélérer le design et le prototypage avec l'IA

Logo Lenis, librairie de smooth scroll
Lenis

Lenis est notre librairie de smooth scroll par défaut sur les projets Webflow premium depuis 2023. Elle a remplacé Locomotive Scroll dans notre stack pour sa légèreté, sa compatibilité avec les API natives et son intégration parfaite avec GSAP ScrollTrigger.

Logo de Slack
Slack

Pour échanger sur l’avancée du projet

Logo Cloudflare, infrastructure web
Cloudflare

Cloudflare est notre couche d'infrastructure par défaut pour tous nos projets Webflow. On y gère les DNS, on y héberge nos scripts custom via Workers ou Pages, et on profite de son CDN gratuit. Cette page explique comment on l'articule avec l'hébergement Webflow natif.