Figma

Overview of Figma

Figma was originally designed as a web design tool — and quickly became the most popular one — allowing users to design and prototype web interfaces. But in recent years, the platform has evolved significantly. Today, Figma is an all-in-one solution built for collaboration, covering the entire design process from initial idea to launch.

You can brainstorm, design, prototype, present, collaborate with developers — and more recently, even build websites directly within Figma (thanks to Figma Sites). The tool has become a standard across companies, agencies, freelancers, and teams — used not just by designers, but also by developers, product managers, marketers, communication teams, and even sales.

In this guide, we’ve compiled everything you need to know about Figma: its features, pricing, best use cases, learning resources, and our expert agency opinion on the tool.

What’s New in 2025

Each year, Figma unveils its latest features and product updates during its annual Config event. And each year, we break down the announcements and share our expert insights.

Read the full article on Config 2025

Tools and Features

Let’s start by understanding who Figma is for and when to use it. Figma has evolved into a complete suite of tools (similar to Adobe’s model), offering several modules tailored to the different stages of a digital project. Here’s an overview of Figma’s most widely used features and tools.

(1) Brainstorming with FigJam

Teams involved: Marketing, Product, Design, Development

Figma offers a dedicated brainstorming tool: FigJam. Designed like a collaborative whiteboard, it helps structure ideas together, in real-time.

Use cases include:

• Ideation workshops (design sprints, product roadmaps, project kick-offs, etc.)
• Creating user flows, sitemaps, customer journeys, diagrams, etc.
• Interactive, visual meetings with real-time collaboration tools

FigJam includes simple yet powerful features: sticky notes, freehand drawing, stickers, timers, ready-to-use templates… An integrated AI also lets you generate predefined templates for workshops (roadmaps, mind maps, kick-offs, marketing strategies, etc.) using prompts.

A perfect tool to bring ideas to life before moving on to the next stages of a project.

(2) Webdesign with Figma Design File

Teams involved: Design, Product

At the core of Figma is its UI/UX design interface, whether you’re building a website or a digital product (SaaS). It allows you to design both web and mobile interfaces from A to Z:

• UX wireframes
• Responsive UI mockups
• Interactive prototypes

With a system of reusable components, global styles, variables, and auto layout, Figma gives you everything you need to build robust and scalable design systems.
And since Figma is a SaaS tool (cloud-based), multiple designers can work simultaneously on the same file.

Of course, collaboration doesn’t stop there — as you’ll see in the next features.

(3) Graphic designs with Draw

Teams involved: Design, Graphic Designers

Figma Draw is the new vector drawing tool launched in 2025. It’s designed for more creative profiles who want to draw illustrations, icons, or custom visuals directly within Figma.

The key benefit? It combines the precision of a vector tool (like Adobe Illustrator) with the fluidity of freehand sketching.

A few use cases:

• Vector illustrations and logo design
• Custom icons
• Visual assets integrated into your Figma mockups

(4) Presentations with Slides

Teams involved: Marketing, Sales

Slides is Figma’s alternative to Google Slides or PowerPoint. Fully integrated into the Figma interface, it allows you to create professional presentations using the same styles, components, and visuals from your design files.

Perfect for:

• Creating pitch decks aligned with your brand guidelines
• Presenting a project to your team
• Building sales or investor presentations

As with everything in Figma, collaboration is seamless. The output is clean and visually consistent, since it leverages all Figma assets. You can easily embed visuals, mockups, and prototypes directly into your slides — and export everything to PDF or PPTX.

(5) Integration with Dev Mode

Teams involved: Developers

Dev Mode isn’t a development tool per se — it’s a dedicated interface built specifically for developers.

This mode turns Figma’s UI into a streamlined read-only environment optimized for implementation. It includes:

• CSS properties of elements
• Spacing, typography, and color codes
• Code snippets (CSS, React, etc.)
• Asset export (SVG, PNG, etc.)
• Quick component inspection

All with a simplified interface and no risk of altering the design. The goal: to streamline collaboration between designers and developers — and speed up the implementation process.

(6) Website creation with Figma Sites (New)

Teams involved: Designers, Developers

Launched at Figma Config 2025, Figma Sites allows you to publish a website directly from Figma — without using any third-party tools.

Still in beta, this feature opens up new possibilities:

• One-click website creation from design files
• Built-in hosting
• Customization via a visual editor that retains Figma’s logic
• Lightweight CMS for managing dynamic content
• Fast publishing for landing pages or microsites

This long-awaited release has naturally created buzz across the web ecosystem. However, as of today, it’s still hard to say whether Figma Sites could truly replace CMS platforms like Webflow or advanced front-end frameworks. But it’s clearly a promising step forward for speeding up the early stages of going live.

(7) Extensions for more specific use cases

Teams involved: Depending on the use case (Marketing, Design, Product)

Figma isn’t just for interface design. The tool also offers newer or more “niche” modules, designed to address specific needs. Notable examples include:

Figma Make – an integrated generative AI tool [BETA] that lets you create UI components from a simple text prompt. It’s used to quickly generate layouts, animations, explore design ideas, or save time on repetitive development tasks.

Figma Buzz – a tool [BETA] designed for marketing and communication teams. It automatically creates visual variations (social media formats, multi-channel campaigns, etc.) from a Figma template. A huge time-saver when adapting one visual to multiple platforms or social networks.

These tools are still very new (often in BETA), but they reinforce the direction Figma is heading: broadening the design experience to all teams working around a product or project — not just designers.

Figma Pricing and Plans

One of Figma’s biggest strengths is its generous freemium model. The free version already allows teams to collaborate on up to 3 design files, with access to all core features (design files, prototypes, plugins, design system tools, components, variables, styles, etc.).

It’s a great way to get started with the tool — and in many cases, it’s more than enough to complete an entire web project from start to finish.

🎓 Are you a student or teacher? Figma offers free “Professional” licenses. Just follow this link.

Figma comparison

(1) Figma vs Adobe XD, Sketch & Penpot

Criteria	Figma	Adobe XD	Sketch	Penpot
Tool type	Web-based + App	Desktop (macOS/Windows)	Desktop (macOS only) + Cloud via Workspace	100% Web-based (open source)
Collaboration	Real-time multi-user, comments, visible cursors	Limited collaboration (asynchronous cloud)	Shared via Sketch Cloud but no native real-time	Real-time, similar to Figma
Prototyping	Built-in with interactions and transitions	Integrated, smooth	Basic, limited to simple links	Integrated, basic but evolving
Components & Design System	Complete: components, variants, styles, variables	Component support but less advanced	Complete but less automated	WIP
Dev handoff	Dev Mode, inspection, snippets, export, CSS/React	Less seamless, manual export	Requires third-party plugins (Zeplin, Avocode)	WIP, very limited
Plugins & ecosystem	Very rich, thousands of plugins, templates, etc.	Limited and closed ecosystem	Good plugin catalog	Very limited, but growing fast via GitHub
Accessibility	Browser, Mac, Windows, Linux, Mobile (preview)	Mac/Windows only	macOS only (Cloud required for sharing)	Any browser
Intuitive interface	Very user-friendly	Quite simple	Simple but old-school design	Minimalist, less polished than Figma
Pricing (pro plan)	From €16/month (Full)	Adobe subscription (~€78/month via Creative Cloud)	From ~€10/month (annual license)	Free (open source)
Adoption / Community	Very active community	Gradually declining	Strong historical community but losing momentum	Rapid growth, closely followed by devs

Overall, Figma remains the most complete, collaborative, and scalable web design tool on the market today — with the highest adoption rate.

(2) Figma vs Webflow & Framer

Criteria	Figma	Webflow	Framer
Tool type	Design + Hosting [beta]	All-in-one WXP platform: visual builder, CMS, hosting, multilingual, analytics, A/B testing, etc.	Visual builder + limited CMS + hosting
Main goal	Design, prototype, and publish micro-sites	Create limitless websites: high-performing, scalable, custom-built	Quickly create small animated and aesthetic sites
Complexity level	Very low (design logic similar to creating mockups in Figma)	Medium to high (more technical, more precise)	Low to medium (intuitive, simpler than Webflow)
CMS capabilities	Very limited	Powerful, customizable and scalable CMS	Simple CMS, efficient for small-scale needs
Code customization	Very limited (only via embed code)	Full code access (HTML, CSS, JS), export, custom scripts	Limited to global scripts
Animations & interactions	Simple transitions and very limited animations	Fully customizable: advanced IX2, fine interactions, scroll, hovers, GSAP	Built-in smooth animations (scroll, transitions, micro-interactions)
Responsive design	Basic automatic adaptation	Full control via precise and cascading breakpoints	Good responsiveness, based on flex but less granular control
SEO & performance	No advanced options	High performance, native SEO optimization, sitemap, tags, speed	Optimized for Google, tag management
Collaboration & workflow	Live collaboration within Figma	Asynchronous collaboration, live mode coming soon	Simple collaboration, instant preview
Visual control level	Full control over static design	Pixel-perfect with CSS logic	High visual quality, but more limited technically than Webflow
Learning curve	Very accessible	More complex at first	Very quick to learn (logic similar to Figma)
Pricing	From $16/month (annual plan)	From $14/month (annual plan)	From $5/month (annual plan)

As you can tell from the comparison table, Figma is still quite limited when it comes to building full websites. While the tool now allows you to publish simple pages, it doesn’t (yet) compete with the power and flexibility of platforms like Webflow—or even Framer. We’ll be keeping a close eye on how Figma Sites evolves, but for any serious web project, Webflow remains the go-to solution today.

Got a project coming up? Let’s talk with our team

Real-world use cases for Figma

(1) For UI/UX designers

You’ve got it—Figma is now the go-to tool for UX/UI web design. It allows teams to manage the entire design cycle, from wireframe to final mockup. All with the structure and assets needed for smooth integration later on.

Designers typically use it to:

• Create wireframes and UI mockups (desktop, mobile, and more)
• Organize files clearly, by page, feature, or design element
• Build and maintain an evolving design system (styles, components, variables…)
• Prototype full user flows, with interactions and animations
• Collaborate in real time with other designers or developers
  

Concrete examples:

• Designing a marketing or e-commerce website
• Building a SaaS product or mobile app
• Designing a conversion funnel

(2) For developers

Dev Mode has established Figma as a true bridge between design and development.

Developers now use it to:

• Inspect mockups with precision and retrieve properties (HTML, CSS, etc.)
• Export assets (images, icons, SVGs…) in the correct formats
• Follow variables (colors, typography, spacing…) defined in the design system
• Access code snippets (CSS, React…) automatically generated
• Collaborate with designers without altering the original files
  

Concrete examples:

• Pixel-perfect front-end integration from a Figma mockup
• Streamlined designer/developer collaboration
• Implementing a design system based on Figma specs

(3) For Product Managers / Product Owners

Figma enables PMs/POs to monitor, manage, and contribute to design projects—without having to get involved in the creative work.

The tool facilitates quick decision-making, centralized feedback, and clear visibility into interface progress.

PMs commonly use it to:

• View mockups in real time during the design process
• Leave comments directly in the Figma file
• Prepare product specs based on wireframes and prototypes
• Coordinate exchanges between design, dev, and stakeholders
• Participate in co-creation workshops via FigJam
  

Concrete examples:

• Managing the design of a new product feature
• Centralizing client or internal feedback on a prototype
• Preparing a design/dev sprint around an onboarding flow

(4) For marketing/sales teams

Even without being designers, marketing and sales teams can use Figma to gain autonomy over visual assets and ensure consistency with the product or brand.

Marketing & sales teams typically use it to:

• Create or adapt campaign visuals (banners, social media assets, etc.)
• Design sales presentations using Figma Slides
• Quickly build landing pages or mockups to validate with the design team
• Collaborate with designers on web content (images, copy, CTAs…)
• Create visual variations in multiple formats
  

Concrete examples:

• Creating a pitch deck for a sales team
• Quickly adapting a product visual for a LinkedIn campaign
• Preparing a landing page for a specific marketing offer

(5) For Clients and Stakeholders

Figma simplifies collaboration with clients and stakeholders on a project, even if they don’t have specific expertise with the tool. A simple link is enough to view mockups in real time, leave comments, or approve a version.

Clients typically use it to:

• Review the progress of design at every stage of the project
• Leave feedback directly on the project
• Validate an interface or a user journey
• Follow iterations in real time
• Streamline communication with design and product teams
  

Concrete examples:

• Validating mockups for a site redesign
• Giving direct feedback on a prototype before development
• Monitoring project progress in real time

Learn how to use Figma

Whether you’re new to Figma or looking to sharpen your skills, the platform offers a complete learning ecosystem. From beginners to experienced designers, there are hundreds of free (and high-quality!) resources available to help you master Figma.

(1) Official Figma resources

Figma provides (for free) a wide range of official learning resources:

• Best practices → A set of tips to get started with Figma the right way
• Resource Library → Deeper learning on the tool and web design in general
• YouTube channel → Demos, tutorials, webinars, and more
• Figma Community → Thousands of templates, files, components, and plugins you can duplicate and learn from by doing

(2) The Figma community

Beyond the Figma Community, an entire ecosystem of designers is active online. On social media, YouTube, Twitch, and more, many creators share tutorials, resources, and best practices around Figma.

Some of the most well-known include:

• Digidop Académie
• Basti Ui
• Flux Academy

Read our article to learn more

Hiring a Freelance Designer or an Agency for Your Figma Project

Even though Figma is an accessible tool, it doesn’t do the design work for you. Designing a high-performing interface that reflects your brand image, addresses SXO/CRO goals, and is cleanly structured for development requires experience, a solid methodology… and experts.

If you’re about to start a project (or already have one in progress), you’re probably asking yourself:

Should I hire a freelancer or a design agency? Here are a few elements to help you decide:

Freelance

Hiring a freelance designer is often a good fit if:

• You have a targeted or one-off project (e.g. landing page design, improving a user flow, etc.)
• You’re looking for a flexible and autonomous profile
• You already have an in-house product/dev team

A good Figma freelancer can handle the full UI/UX design phase, deliver clean, usable files, and help build the foundations of a design system.

Agency

We’d be happy to talk about your project: Contact our team

An agency is a better fit if:

• You have a more comprehensive web project, like a full website redesign or the launch of a new product
• You need structured support, from strategy to design and development
• You’re looking for multidisciplinary expertise (UX, UI, SEO, Webflow, etc.)
  

A good agency works with a proven methodology, brings together various expert profiles, and ensures smooth continuity between Figma design and the website launch.