Figma Announcements

Figma announced a bunch of new features during Schema, their design system conference. Some of them are coming to early access, and others are releasing this week and in November.

Extended collections

You will be able to manage multi-brand design systems more easily with an extended collection that can inherit from the main collection, so it will be less of a pain to manage.

Slots

You can add slots to components so they can become more flexible. This way, you no longer need to create multiple variants for a card component, for example, but can just put any content in the slot.

Check designs

A built-in design linter that is based on a custom ML model that is trained while you use your library, so it will learn to understand how variables are used, for example. It will suggest replacing static values like colors, spacing, typography, ... with actual variables from your system.

Code Connect

Code Connect will now allow you to add per-component guidelines so your code generation will have more context to build better things. Example code from source files will now also be generated.

npm packages in Figma Make

This one is very exciting in particular, because it means you will be able to bring your existing production design system into Figma Make to build new prototypes.

Make Kits

Up until now, you were only able to export styles for Figma Make, which would apply fonts, colors, ... in your prototypes, but not your actual components. With Make Kits, you can prompt and build your components in code, so you can use it as a library for any Figma Make prototype with actual components. So, expect more consistent results with less prompting.

More variable modes

Professional plans will now be able to create up to 10 modes per library and up to 20 for Organization plans. This will let you create more variables, for example, for different themes or breakpoints.

Importing & Exporting variables

A built-in export for variables will soon be available. It will follow the first official version of the W3C spec for design tokens, which makes it interoperable with multiple other design tools.

Improved variables authoring

You can more easily see all variable collections you're subscribed to, create new ones inline, and the variables modal will now be displayed full-screen for easier editing.

Read all about the latest Figma updates

‍

‍

‍

Plugins for Figma Buzz

Another Figma update that was not part of Schema, but announced last week, was plugins for Figma Buzz. This will make Buzz much more powerful and unlock new ways to bring branding and marketing assets to the next level.

‍

‍

‍

Sketch Copenhagen beta

Sketch launched their next big update in beta, featuring a total redesign for macOS Tahoe (it is also available for older macOS versions), a new inspector, a more focused layer list, wrapping for stack layouts, and background removal.

Try out Sketch beta

‍

Post by @Sketch@mastodon.design
View on Mastodon

‍

‍

LottieFiles in Figma Buzz

LottieFiles' Figma plugin is now available in Figma Buzz. Allowing you to quickly add animations as MOV, GIF, and SVG to make your marketing materials come to life. It will also let you generate vector illustrations with just a prompt.

Learn more about LottieFiles in Figma Buzz

‍

‍

‍

Jitter in Figma Buzz

Jet another Figma plugin is now in Buzz, Jitter. It will let you import your Buzz design in Jitter and let you animate it, bringing motion to your social posts, ads, brand assets, or any marketing material.

Learn more about Jitter in Figma Buzz

‍

‍

‍

Webflow real-time collaboration

Real-time collaboration is now rolling out for everyone in Webflow. So no more having to handover editor access to someone else. You can now just work together like you're used to in your other tools. It will be rolling out over the coming weeks to everyone.

Read more about real-time collaboration

‍

‍

‍

In The Pocket's Figma MCP guidelines

We published our first Figma MCP guidelines to help get designers and engineers started to bring more context to AI models. It explains how to optimize your designs for AI, how to set up Figma MCP, and how to build and use Figma Make prototypes well to use them as more accurate context.

Explore our Figma MCP Guidelines

‍

‍