Figma Config 2024

Figma Config 2024

Next year, the next Figma Config will be behind us. But it was not a regular product upgrade, updates announced by Dylan this year are super exciting. Let's start with a TL;DR and then explain how these announcements will impact every Figma user.

TL;DR

  • Figma will get a brand-new UI
  • Autolayout gets several improvements - the most significant one: suggest autolayout
  • We will have official UI Kits for iOS 18 and Material Design 3
  • Dev mode got lots of upgrades: cleaning up the ready-for-dev previews, updates with comments, and more
  • AI for Figma - generate designs, search the libraries with AI, rename layers, translate the copy, and much much more
  • Figma Slides - a new app that will seamlessly connect your Figma designs into Slides.

That's a summary; now it's time to dive deeper. If you haven't seen the keynote, grab the mug of your coffee and enjoy reading about the updates!

New Figma UI

The User Interface of our favorite design tool gets a huge update. It is called UI 3, and I must admit that this will finally be a style that feels aesthetic and clean to me. Past interfaces felt a bit clunky and raw. Figma clearly migrates to a more elegant style, and I really enjoy this direction.

The most significant change is that the top bar disappears. It will float at the bottom of the page. In general, the UI feels much more minimalistic, and you will be able to collapse panels super easily.

What's more, the Figma UI is becoming more contextual, with sections specific to the selected element. For instance, the components panel will get instance swap or properties at the top of it.

New Figma UI

Auto Layout

Figma improves its ability to make responsive designs every year. Among small improvements, there is one huge upgrade that everyone who starts their designs without Autolayout will enjoy.

Suggest autolayout will automatically group layers in Frames and apply the correct properties of auto layout for you within second.

Suggest auto layout

Dev mode

Working on developer handoff becomes much more manageable. The dev mode is ready for iterative work on specific designs with the new improvements. Once you update your components with the next iteration of modifications, you will be able to easily notify the developer about the changes.

Developers now have a much nicer view that unclutters the Figma canvas and shows only what was marked as "ready for dev" with all specs.

Design system lovers can connect Figma components with coded ones, which is great.

AI for Figma

This is the upgrade that we were waiting for. When we saw Dylan's T-shirt - we already knew that something in that matter would happen, and we were not disappointed.

Figma divided AI features into three categories:

  • Get started
  • Find what you need
  • Stay in the flow

Figma AI - Action panel

Get started

Get started is all about creating new designs and making initial modifications with AI. Based on a simple prompt Figma will generate UI for you. You are able to adjust corners, spacing, font and colors to make it feel yours.

You are able to generate mobile & web designs, and once they are done, you may iterate on them by writing prompt that edits them. You may for example add a next section or a form.

In the future, Figma plans to integrate existing design systems into UI generation.

Find what you need

This feature is about searching Figma assets with AI. Paste a screenshot and find a direct design made in Figma - it works in your workspace and for community files.

In addition, you may find an icon by drawing it or entering the text that was placed in the designs.

For many of us searching workspaces for the past works, this will be a huge time saver.

Stay in the flow

The category is all about smart AI powered features that helps you stay in context and focus on work. AI may suggest a text content replacement, create image, rewrite text or remove background.

What's more, you may check designs in other languages because AI may automatically apply it to your designs. It may also create prototypes for you, but the most useful feature will be...

AI will rename layers for you automatically. I think that thousands of designers have been waiting for this for a loooong time.

Figma Slides

It was a bit of a surprise, at the end of the keynote we got the "one more thing" - announcement of a new product. Figma Slides will allow you to create presentations that are deeply integrated with Figma.

The creators of the tool noticed that many of us use Figma instead of Keynote or PowerPoint. Thank God, they came up with the idea to integrate features useful for presentations.

Figma Slides allow you to organize presentations easily, theme them, animate slides like prototypes, and add speaker notes to them. Thanks to integration with Figma, you can have seamless design pasting and editing.

Next, AI will help you improve the copy, and you can embed prototypes directly on slides.

Finally, live pools and alignment scales will allow you to make your audience react to what you present.

It sounds like a pretty nice add-on to our design work.

Figma Slides Preview

Nothing comes for free

During the keynote we heard that all of the features and beta versions of AI and Figma Slides will be free this year. But unfortunately, next year Figma will start to charge extra for them.

The price for AI services is unknown. Figma Slides for individuals will cost you $3 per month.

AI will be trained based on your data

I appreciate that it was mentioned during the keynote. AI needs to be trained on something. Figma will use data generated by users to make it work better.

The good thing is that if you don't want your work to be part of AI training, you may simply opt out of this.

Summing up

I am definitely going to try out the new UI and AI tools when they are released. In my opinion, the changes and updates will make us work far more efficiently.

One thing I miss in this year's keynote is a shift into no-code tools. I suppose that this will be a direction for the future. However, with that number of improvements, we may feel more than satisfied.

What features do you like the most? What do you think of AI add-ons and Figma Slides? Feel free to let me know.

Thanks for reading!