Figma

Vue d'ensemble de Figma

Figma est à l’origine un outil de webdesign – le plus populaire – permettant à l'origine de concevoir et prototyper des interfaces web. Mais ces dernières années, l’outil a largement évolué. Aujourd’hui, Figma est devenu une solution tout-en-un, pensée pour collaborer autour du design, de l’idée initiale jusqu’à la mise en ligne.

On peut brainstormer, designer, prototyper, présenter, collaborer avec les développeurs, et depuis peu, créer des sites web directement depuis Figma (avec Figma Sites). L’outil s’est imposé comme "un standard", au sein des entreprises, des agences, des freelances, des équipes - en étant utilisé autant par les designers que les développeurs, les équipes produit, marketing, communication ou même commerciales.

Dans cette fiche, on a regroupé tout ce qu’il faut savoir sur Figma : ses fonctionnalités, ses tarifs, les meilleurs cas d’usage, des ressources pour apprendre à l’utiliser efficacement, et notre avis d’agence spécialisée sur l’outil.

Les nouveautés 2025

Comme chaque année, Figma dévoile ses nouvelles fonctionnalités et produits lors de son événement Config. Et comme chaque année, on décrypte ces annonces et on vous partage notre avis.

Lire l'article complet sur la config 2025

Outils et Fonctionnalités

Commençons par comprendre à qui est destiné l’outil et dans quel contexte l’utiliser. Figma s’est transformé en une suite complète (modèle à la Adobe), avec plusieurs modules adaptés aux différentes étapes d’un projet digital. Faisons un point sur les fonctionnalités de Figma et outils les plus utilisés.

(1) Brainstorming avec FigJam

Équipes concernées : Marketing, Produit, Design, Dév

Figma dispose d’un outil dédié au brainstorming : FigJam. Pensé comme un tableau blanc collaboratif, il permet de structurer des idées à plusieurs, en temps réel. On l’utilise pour :

• des ateliers de réflexion (design sprint, roadmap produit, kick-off projets, roadmap…)
• la création de user flows, sitemap, parcours clients, diagrammes, etc.
• des réunions visuelles, interactives, avec un support de collaboration en temps réel

FigJam intègre des fonctionnalités simples mais puissantes : post-it, dessins à main levée, stickers, timers, templates prêts à l’emploi… Une IA intégrée permet également, via un prompt, de créer des modèles prédéfinis pour débuter des ateliers (roadmap, mindmap, kick-off, stratégie marketing, etc.)

Un outil donc parfait pour faire émerger des idées avant de passer aux prochaines étapes d'un projet.

(2) Webdesign avec Figma Design File

Équipes concernées : Design, Product

Le cœur de Figma, c’est son interface de design UI / UX que ce soit pour un site web ou un produit (Saas). Elle permet de concevoir des interfaces web et mobile de A à Z :

• Wireframes UX
• Maquettes UI et responsive
• Prototypes interactifs

Avec un système de composants réutilisables, de styles globaux, de variables et d’auto layout, Figma offre tout ce qu’il faut pour construire des design systems robustes et scalables. Et comme Figma est un Saas (hébergé dans le Cloud), plusieurs designers peuvent travailler simultanément sur un même fichier. Bien sûr, la collaboration ne s'arrête pas là, grace aux fonctionnalités qui suivent.

(3) Créations graphiques avec Draw

Équipes concernées : Design, Graphistes

Figma Draw est le nouvel outil de dessin vectoriel lancé en 2025. Il s’adresse aux profils plus créatifs, qui souhaitent dessiner des illustrations, icônes ou visuels personnalisés directement dans Figma.

Quel avantage ? Il combine la précision d’un outil vectoriel (type Illustrator d'Adobe) avec la fluidité d’un croquis à main levée.

Quelques cas d’usage :

• Illustrations vectorielles et création de logos
• Icônes custom
• Créations visuelles intégrées à vos maquettes Figma

(4) Présentations avec Slides

Équipes concernées : Marketing, Sales

Slides, c’est l’alternative Figma à Google Slides ou PowerPoint. Directement intégré dans l’interface, il permet de créer des présentations professionnelles, en reprenant les styles, composants et visuels de vos fichiers design.

Idéal pour :

• créer des pitch decks alignés à la charte
• présenter un projet à une équipe
• créer des présentations commerciales pour un client ou investisseur

Tout est collaboratif, comme toujours dans Figma. Et le rendu très propre, car il est compatible avec l'ensemble des outils Figma. Ce qui permet facilement d'intégrer des visuels, designs, maquettes, prototypes dans vos présentations. Le tout, exportable en format PDF et ou PPTX.

(5) Intégration avec le Dev Mode

Équipes concernées : Développeurs

Le Dev Mode n’est pas un outil de développement en soi, mais une interface dédiée aux développeurs.

Cet outil transforme l’UI de Figma en un mode de lecture optimisé pour l’intégration. On y retrouve notamment :

• les propriétés CSS des éléments
• les espacements, les typographies, les codes couleurs
• des snippets de code (CSS, React…)
• l’export des assets (SVG, PNG…)
• l’inspection rapide des composants

Le tout avec une navigation simplifiée, sans risque de modifier le design. Le but : fluidifier la collaboration entre designers et développeurs, et accélérer l’intégration.

(6) Création de site internet avec Figma Sites (Nouveau)

Équipes concernées : Design, Développeurs

Lancé à la Figma Conf 2025, Figma Sites permet de publier un site web directement depuis Figma, sans passer par un outil tiers.

Encore en bêta, cette fonctionnalité ouvre de nouvelles perspectives :

• Création de sites web en "un clic" à partir de fichiers design
• Hébergement intégré
• Personnalisation via une interface visuelle et qui garde les logiques de Figma
• Mini CMS intégré pour la gestion des contenus dynamiques
• Mise en ligne rapide pour landing pages ou microsites

La sortie de ce produit était très ettendue et a bien sûr fait éco dans l'écosystème web. Pour autant, il est difficile à date d'affirmer que Figma Sites pourrait remplacer des CMS comme Webflow ou des frameworks front-end avancés. Mais c’est une avancée prometteuse pour accélérer les premières étapes de mise en ligne.

(7) Les extensions pour des usages plus spécifiques

Équipes concernées : selon les cas d’usage (Marketing, Design, Produit)

Figma, ce n’est pas que le design d’interfaces. L’outil propose aussi des modules plus récents ou plus “niche”, pensés pour répondre à des besoins spécifiques. On retrouve notamment :

Figma Make - un outil d’IA générative intégré [BETA] qui permet de créer des composants UI à partir d’un simple prompt textuel. On l’utilise pour générer rapidement des layouts, des animations, explorer des idées de design, ou gagner du temps sur des tâches répétitives dans le développement.

Figma Buzz - un outil [BETA]  pensé pour les équipes marketing et communication. Il permet de créer automatiquement des déclinaisons visuelles (formats réseaux sociaux, campagnes multi-canal, etc.) à partir d’un template Figma. Un gain de temps énorme pour adapter un même visuel à plusieurs supports ou réseaux sociaux.

Ces outils sont encore très récents (souvent en accès BETA), mais ils renforcent la direction prise par Figma : élargir l’expérience design à toutes équipes qui gravitent atour du produit ou projet - plus uniquement aux designers.

Tarifs et offres de Figma

L’un des points forts de Figma est de proposer un modèle freemium assez intéressant : la version gratuite permet déjà de travailler à plusieurs sur jusqu’à 3 fichiers de design, avec toutes les fonctionnalités de base (design files, prototypes, plugins, fonctionnalités de design system, composants, variables, styles, etc.). De quoi commencer à s'initier et parfois largement suffisant pour réaliser un projet web de bout en bout.

🎓 Vous êtes étudiant ou enseignant ? Figma propose des licences "Professionnel" gratuites. Il vous suffira de suivre ce lien.

Comparatif de Figma

(1) Figma vs Adobe XD, Sketch & Penpot

Critères	Figma	Adobe XD	Sketch	Penpot
Type d’outil	Web-based + App	Desktop (macOS/Windows)	Desktop (macOS uniquement) + Cloud via Workspace	100% Web-based (open source)
Collaboration	Temps réel multi-utilisateur, commentaires, curseurs visibles	Collaboration limitée (cloud asynchrone)	Partagée via Cloud Sketch mais pas en simultané natif	Temps réel, proche de Figma
Prototypage	Intégré avec interactions et transitions	Intégré, fluide	Basique, limité aux liens simples	Intégré, basique mais évolutif
Composants & Design System	Complet : composants, variantes, styles, variables	Support des composants mais moins avancé	Complet mais moins automatisé	WIP
Spécifications pour dev	Dev Mode, inspection, snippets, export, CSS/React	Moins fluide, export manuel	Nécessite des plugins tiers (Zeplin, Avocode)	WIP, très limité
Plugins & écosystème	Très riche, des milliers de plugins, templates, etc.	Écosystème restreint et fermé	Bon catalogue de plugins	Très limité, mais croissance rapide via GitHub
Accessibilité	Navigateur, Mac, Windows, Linux, Mobile (preview)	Mac/Windows uniquement	macOS uniquement (Cloud requis pour partager)	Tout navigateur
Interface intuitive	Très user friendly	Assez simple	Simple mais design old school	Minimaliste, moins clean que Figma
Prix (plan pro)	À partir de 16€/mois (Full)	Abonnement Adobe (~78€/mois via Creative Cloud)	À partir de ~10€/mois (licence annuelle)	Gratuit (open source)
Adoption / Communauté	Communauté très active	En déclin progressif	Forte communauté historique mais en perte de vitesse	Croissance rapide, très suivie par les devs

Dans l'ensemble, Figma reste aujourd’hui l’outil de webdesign le plus complet, collaboratif et évolutif du marché, avec le plus fort taux d'adoption.

(2) Figma vs Webflow & Framer

Critères	Figma	Webflow	Framer
Type d’outil	Design + hébergement [bêta]	Plateforme WXP toute en un : visual builder, CMS, hébergement, Multilingue, Analytics, A/B test, etc.	Visual builder + CMS limité + hébergement
Objectif principal	Designer, prototyper, et publier des micro-sites	Créer des sites sans limite : performants, scalables, sur mesure	Créer des petits sites animés et esthétiques rapidement
Niveau de complexité	Très faible (logique de design similaire à la création de maquettes sur Figma)	Moyen à élevé (plus technique, plus précis)	Faible à moyen (intuitif, plus simple que Webflow)
Capacités CMS	Très limité	CMS puissant, personnalisé et scalable	CMS simple, efficace pour des petits besoins
Personnalisation du code	Très limité (uniquement via embed code)	Accès complet au code (HTML, CSS, JS), export, custom scripts	Limité à des scripts globaux
Animations & interactions	Transitions simples et animations très limités	100% personnalisé : IX2 avancées, interactions fines, scroll, hovers, GSAP	Animations fluides intégrées (scroll, transitions, micro-interactions)
Responsive design	Adaptation automatique basique	Contrôle total par breakpoint précis et en cascade	Bon responsive, basé sur du flex mais moins de contrôle fin
SEO & performances	Aucune option avancée	Performant, optimisé SEO natif, sitemap, balises, vitesse	Optimisé pour Google, gestion des balises
Collaboration & workflow	Collaboration live dans Figma	Collaboration asynchrone mais fonctionnalité live à venir prochainement	Collaboration simple, prévisualisation instantanée
Niveau de contrôle visuel	Total sur le design statique	Pixel-perfect avec logique CSS	Haute qualité visuelle, mais plus limité techniquement que Webflow
Apprentissage / prise en main	Très accessible	Plus complexe au début	Très rapide à prendre en main (logique similaire à Figma)
Tarifs	A partir de la full licence $16 / mois / an	A partir de $14 / mois / an	A partir de $5 / mois / an

Vous l'aurez compris à lecture de ce tableau comparatif, à date, Figma reste une solution encore très limitée pour la création de sites web. L’outil permet de publier des pages simples, mais ne rivalise pas (encore) avec la puissance et la flexibilité d’outils comme Webflow ou même Framer. On suivra de près les prochaines évolutions de Figma Sites, mais pour des projets web sérieux, Webflow reste aujourd’hui la référence.

Un projet web à venir ? Echangez avec nos équipes

Des cas d'usage concrets de Figma

(1) Pour les designer UI/UX

Vous l'aurez compris, Figma est aujourd'hui l'outil de référence pour les webdesign UX / UI. Il permet de gérer le cycle de design, du wireframe à la maquette finale. Le tout, avec l'ensemble des éléments nécessaires à sa future intégration.

Les designers l'utilisent notamment pour :

• Créer des wireframes, maquettes UI (desktop, mobile, et autres supports)
• Organiser des fichiers clairs et structurés par page, par fonctionnalités, par éléments de design
• Concevoir et maintenir un design system évolutif (styles, composants, variables…)
• Prototyper des parcours utilisateurs complets, avec interactions et animations
• Collaborer en temps réel avec d’autres designers ou développeurs

Exemples concrets :

• Conception de site internet vitrine ou e-commerce
• Création d’un produit SaaS ou d’une app mobile
• Design d’un tunnel de conversion

(2) Pour les développeurs

Le dev mode a imposé Figma comme un vrai pont entre le design et le développement.

Les développeurs l'utilisent aujourd'hui pour :

• Inspecter précisément les maquettes et récupérer les propriétés (HTML, CSS, ..)
• Exporter les assets (images, icônes, SVG…) aux bons formats
• Suivre les variables (couleurs, typos, espacements…) définies dans le design system
• Accéder à des snippets de code (CSS, React…) générés automatiquement
• Collaborer avec les designers sans modifier les fichiers

Exemples concrets :

• Intégration front-end fidèle d’une maquette Figma
• Collaboration designer/développeur
• Implémentation d’un design system à partir des specs Figma

(3) Pour les Product Managers / Product Owners

Figma permet aux PM/PO de suivre, piloter et contribuer aux projets design, sans forcément toucher à la partie créative. L’outil facilite la prise de décision rapide, la centralisation des feedbacks et la visibilité sur l’avancement des interfaces.

Les PM l’utilisent notamment pour :

• Visualiser en temps réel les maquettes en cours de conception
• Laisser des commentaires directement dans le fichier Figma
• Préparer les specs produit à partir des wireframes et prototypes
• Coordonner les échanges entre design, dev et autres parties prenantes
• Participer aux ateliers de co-création via FigJam

Exemples concrets :

• Pilotage de la conception d’une nouvelle feature produit
• Centralisation des retours clients ou internes sur un prototype
• Préparation d’un sprint design/dev autour d’un tunnel d’onboarding

(4) Pour les équipes marketing / sales

Même sans être designer, les équipes marketing et commerciales peuvent utiliser Figma pour gagner en autonomie sur leurs supports visuels et assurer une cohérence avec le produit ou la marque.

Les équipes marketing & sales l’utilisent notamment pour :

• Créer ou adapter des visuels de campagnes (bannières, assets social media, etc.)
• Concevoir des présentations commerciales dans Figma Slides
• Réaliser rapidement des landing pages ou mockups à valider avec l’équipe design
• Collaborer avec les designers sur les contenus web (images, wording, CTA…)
• Créer des déclinaisons de visuels dans plusieurs formats

Exemples concrets :

• Création d’un pitch deck pour une équipe commerciale
• Adaptation rapide d’un visuel produit pour une campagne LinkedIn
• Préparation d’une landing page pour une offre marketing spécifique

(5) Pour les clients et parties prenantes

Figma facilite la collaboration avec les clients et les parties prenantes d'un projet, sans qu’ils aient besoin d'expertises particulières sur l'outil. Un simple lien suffit pour visualiser les maquettes en temps réel, laisser des commentaires, ou valider une version.

Les clients l’utilisent notamment pour :

• Consulter l’avancement du design à chaque étape du projet
• Laisser des feedbacks directement sur les projets
• Valider une interface ou un parcours utilisateur
• Suivre les itérations en temps réel
• Gagner en fluidité dans la communication avec les équipes design et produit

Exemples concrets :

• Validation des maquettes d'un site en refonte
• Feedback direct sur un prototype avant développement
• Suivi de projet en temps réel

Apprendre à utiliser Figma

Que vous souhaitiez découvrir Figma ou approfondir vos compétences, l'outil propose un écosystème complet de formations et d’apprentissage. Débutant ou designer confirmé, il existe des centaines de ressources gratuites (et de qualité !) pour aider à maîtriser Figma.

(1) Les ressources officielles de Figma

Figma diffuse (gratuitement) ses propres contenus de manière très complète :

• Best practices → un ensemble tips pour bien commencer sur Figma
• Ressource Library → des ressources pour aller plus loin dans l'utilisation de l'outil et du Webdesign en général
• Leur chaine YouTube → qui regroupe des demos, cours, webinar, etc.
• Figma Community → Des milliers de templates, fichiers, composants, et plugins à dupliquer pour apprendre en pratiquant

(2) La communauté Figma

Au-delà de la Figma Community, c'est toute une communauté de designers qui s'activent, sur les réseaux sociaux, YouTube, Twitch, etc. pour partager du contenu.

Parmis les plus célèbres on retrouve :

• Digidop Académie
• Basti Ui
• Flux Academy

Lire notre article pour en savoir plus

Faire appel à une agence ou un freelance pour son projet Figma

Même si Figma est un outil accessible, l'outil ne fait pas le design ... Et pour concevoir une interface performante, alignée à votre image de marque, vos enjeux SXO, CRO et prête à être intégrée de manière "clean" demande de l’expérience, une vraie méthodologie… et donc d'experts.

Si vous avez un projet en cours ou à venir, vous poserez alors surement cette question : dois-je faire appel à un freelance ou une agence ?

Voici quelques éléments de réponse pour vous aider :

Freelance

Faire appel à un designer freelance est souvent adapté si :

• Vous avez un projet ponctuel ou ciblé (maquette d’une landing page, amélioration d’un flow, etc.)
• Vous cherchez un profil flexible et autonome
• Vous avez déjà une équipe produit/développement en interne

Le bon freelance Figma peut gérer toute la phase UI/UX, vous livrer des fichiers propres et exploitables, et vous accompagner sur la création d’un design system de base.

Agence

Nous pouvons d'ailleurs discuter de votre projet : Contacter notre équipe

Une agence est plus adaptée si :

• Vous avez un projet web plus complet, une refonte de site ou la création d’un nouveau produit
• Vous avez besoin d’un accompagnement structuré, de la stratégie au design en passant par le développement
• Vous attendez une expertise pluridisciplinaire (UX, UI, SEO, Webflow, etc.)

Une bonne agence travaille avec une méthodologie efficace, mobilise plusieurs types de profils, et assure une continuité entre le design sur Figma et la mise en ligne du site.