Figma - Design & collaborate tool

Facilitate progress in design work from any location at a faster pace.

Make your creations come to life with convenient and immersive viewing options. Provide feedback on designs and review them on the go using comments and push notifications.

With the Figma mobile app, you can:

- View and respond to comments on both Figma and FigJam

- Receive push notifications for new comments and responses

- Access, browse, and share files and prototypes

- Navigate team and project folders

- Mark files as favorites for quicker access

- Play back prototypes without being tied to your desktop

- Activate hot spots in prototypes for smoother navigation

- Sync selected frames from your desktop to your mobile device

Guide to prototyping in Figma

Figma’s prototyping features allow you to create interactive flows that explore how a user may interact with your designs.

Prototypes are a fantastic way to:

    Preview interactions and user flows

    Share and iterate on ideas

    Get feedback from collaborators

    Test interactions with users

    Present your designs to stakeholders

    Flows and starting points

With prototyping in Figma, you can create multiple flows for your prototype in one page to preview a user's full journey and experience through your designs.

A flow is the network of frames and connections in a single page. A prototype can map out a user's entire journey through your app or website, or it can focus on a specific segment of it via its own flow. For example: your prototype covers all possible interactions on an eCommerce site. Within the prototype, you have flows for creating an account, adding items to a cart, and checking out.

Figma creates a flow starting point when you add your first connection between two frames. There are a few other ways to add a flow starting point to your prototype:

    With the starting frame selected, click  in the Flow starting point section of the right sidebar.

    Right-click on the frame, then click Add starting point.

    Duplicate a frame with an existing starting point.

    When it's time to test your designs, you can share the entire prototype or copy the link to a flow starting point.

Note: A top-level frame can be part of multiple flows, but can only have one starting point. Frames nested within a top-level starting frame can have connections that navigate the user around multiple flows. For example, Log in and Sign up buttons can be nested in the same starting point frame, then be connected to frames in separate flows for each experience.

Create connections

    Select the hotspot for the connection.

    Click  to create the connection.

    Drag it to the destination.

If there are no existing connections, Figma will make the first frame a starting point.

Tip! You can create connections from multiple objects to the same destination frame at the same time—saving you time and effort when building out your prototype flows. To do so, select multiple starting hotspots on your canvas, then click and drag the  icon to the destination.

    Create interactions and animations

    Open the Prototype tab in the right sidebar

    Add interactions

    Set interaction details

    Apply an animation

    Preview your animation

    Adjust prototype settings

    Select a Device and Model

    Preview your prototype

    Select Background color

    Set the prototype's Starting Frame

What's new from Config 2024

Config is Figma’s annual design conference for people who build products, where we bring the community together for two days of exciting feature launches and talks from industry professionals.

In this article, we’ll walk you through each feature we announced at Config 2024. Some of these features are in beta, so we’ll indicate their availability and keep this article up to date if there are any changes.

Use AI in Figma Design

Your creativity is unblocked with Figma AI. Go from first draft to final product faster, find what you’re looking for, and stay in the flow.

Use AI tools in Figma to:

    First Draft: Transform ideas into editable designs in a couple of minutes. This helps you explore a wider range of design possibilities and iterations quickly, and reduces the amount of effort needed to manually create early explorations from scratch.

    Visual Search and Asset Search: Use images and designs to search for similar designs and components made by your team or organization. Find the components you need from the Assets tab without having to memorize their names.

    Rename Layers: Organize your file by giving all your layers meaningful names with a click.

    Make Prototypes: Quickly turn your mocks into an interactive prototype.

    Rewrite Text: Rewrite text for a different tone, translate text to another language, and shorten text to fit your designs.

    Generate Images and Remove Backgrounds: Generate and edit unique images using a written prompt. Remove an image’s background to isolate the main subject.

When it comes to building AI, we want to be transparent about what we’re doing and what it means for you. 

A new view into Dev Mode

The following Dev Mode features are available now, but may be limited by plan or seat. Click the link for each feature below to learn more.

To help teams ship better products efficiently, we’re evolving Figma Design and Dev Mode to support the needs of both design and development. Designers maintain the freedom to explore ideas and iterate quickly, while developers have more clarity and guidance on what’s ready to build, what’s changed in a file, and how to build it.

Improve your handoff process with Dev Mode features like:

    Status Updates: Designs can now be assigned a progress status, and teammates can get notified of changes. Handoff between designers and developers happens multiple times throughout a project, making it important to communicate when a feature is ready to be built.

    Ready for Dev View: Ready for Dev View helps developers quickly find everything that is ready to be built in one place.

    Focus View: Show only the design you’re inspecting while hiding other designs to minimizes on-canvas distractions.

    Code Connect: Code Connect is officially out of beta! Code Connect is a tool for design systems and engineering teams to bring component code into Dev Mode. When inspecting a component with connected code snippets, developers will see design system code from their libraries instead of auto-generated code.

Present your ideas with Figma Slides

Figma Slides is in open beta and available to everyone.

While in beta, Figma Slides is free. In early 2025, Figma Slides will be available on free and paid plans, starting at $3 or $5 per user/month depending on your plan. We'll let you know in advance when that's happening.

Figma Slides is the first presentation tool built for designers and teammates. Figma Slides pairs the power and precision of Figma Design with easy-to-use presentation tools to bring your narrative to life and drive alignment.

With Figma Slides, you can:

    Choose from flexible templates to create powerful presentations for any audience

    Use multiplayer and collaboration features to co-create decks, and present together with shared presenter notes and co-presenting controls

    Create live slides with polls, alignment scales, and voting to capture stakeholder feedback and driving decision-making

    Customize your slide deck designs using the Figma Design tools you already know and love

A fresh look for Figma Design

Figma's redesign, also called UI3, is currently in beta. Learn how to get access to UI3 →

We’ve redesigned Figma for ease, ergonomics for your workflow, and consistency across Figma products. Starting with a more approachable interface and new ways to find your favorite tools, our goal is for Figma to continue to be how you bring your imagination to reality. And this is just the beginning.

Design with more ease

The following updates are available in Figma Design to everyone.

From responsive prototyping and a more intuitive Auto Layout, to getting started with UI Kits in the asset tab, your favorite features in Figma now work the way you’d want them to.

UI Kits

We’ve brought Apple Design Resources, Google Material Design, and Figma Design systems straight to your assets tab, so you can start designing without needing a design system of your own. With these high-quality components, styles, and variables, you’ll be able to bring your ideas to life and share them with others in no time.

On iPad, you can also utilize FigJam to:

- Sketch with the Apple Pencil for more fluid exploration and iteration of ideas

- Share initial concepts with your team for collaborative brainstorming

- Annotate designs for sharing feedback

- Capture ideas whenever inspiration strikes

Exciting new features are set to be released soon!

For any feedback, you can report issues directly in the app through your account settings.