Mingzhi Cai shares some insights on building components that benefit the team: ​“After revamping our Figma component library with Auto Layout and component properties last year, my team and I boosted the total insertion of Figma components across our department by over 200% in the second half of 2022. There’s a 48% increase in users saying in the survey that this component library makes their work ​“much faster.”

Davo Galavotti’s talk at last year’s The Future of Design Systems Conference. He shows how to use Figma and a few plugins like Automator and Scripter to automate repetitive tasks and streamline the design process to improve efficiency and productivity. (Disclaimer: The Future of Design Systems Conference sponsors this issue, but this link is not sponsored.)

Designer Advocate Mal shows how to use the new memory control features: ​“To keep you informed of your memory usage, and any potential issues that may arise, we’ve adjusted our memory banners and alerts to live in the sidebar along with your pages and layers. We’ve also introduced a Memory use tool to surface memory consumed in your files by Page Content and Imported Components as well as the ability to show memory usage in the layers panel for all layers.”

FigJam now got a dedicated iPad app. I hope they’re setting the ground for a full-featured Figma for iPad app? Anyway, the new icon is dope!

State management is now standardized for prototypes using interactive components, scrolling, and video so that Figma can memorize the state, share it across the frames, and offer a way to reset. See a deep dive by noodles expert Niko on how to use the new features. (Also, this is my kind of joke.)

Tutorial Tim shows how to use the AI plugin Wireframe Designer.

Mal with a quick demo of Shaper, Magic Marker, and A Selector plugins.

The all-new LottieFiles is the hottest release of this week: ​“Create production-ready animations within Figma and export them as a Lottie. Apply animated presets to a single frame or string together multiple frames to create your fun animation. Bring the power of motion to your designs with LottieFiles for Figma.”

“When you select multiple objects across multiple frames, holding Shift now gives you the option to align those objects as groups within their respective frames.”

“When you have multiple vertices selected in vector edit mode, you can now type Mixed + [value] into the X or Y input box to add the same value to each vertex.”

After adding screen readers support to Figma prototypes last year, now it’s introduced to FigJam. With this update, screen reader or keyboard users can move focus around the canvas, as well as between different menus and screens, to create, edit, and read out content. I love how these improvements make FigJam better for everyone: ​“Users can now navigate FigJam files using the Tab key to jump between objects on the canvas, as well as between text nodes for efficient editing. Hold Shift-Tab to tab in reverse.”

The accessibility team also shared a few tips on making FigJam files more accessible: provide ​“alt” text to images, use Sections to group content, numbered lists to describe order, and underscores to communicate fill-in-the-blanks.

Let Destroyer recursively detach instances, remove Auto Layouts, and detach Styles within your current selection so you can iterate faster. When working collaboratively and wishing to quickly try out an idea, it’s always a hassle to detach the component and remove Auto Layouts.

Include is a tool built by eBay to make annotating for accessibility easier — easier for designers to spec and easier for developers to understand what is required. The intent is to have accessibility considerations included during the design phase of any project and to help with the designer-developer collaboration.

In this Study Hall, Miggi shows how to make Interactive Component carousel galleries.

A big update to FigJam — custom templates for your team, stamp your teammates’ faces to files and tag them with @mentions, emoji picker opens by typing a colon (“:”), custom color palettes (coming soon), UserTesting and Great Question integrations, Productboard widget, and new tunes! Also, explore new world-class teams’ templates and see a thread by Cai on the Figma design team’s rituals and templates they use in daily work.

In addition to a bigger release, there are a bunch of good quality-of-life improvements: toggling between thin and thick markers with Command–B (lovely animation!), an addition of Paste to replace (Command–Shift–V) command to FigJam, and connecting two objects by simply clicking on one object followed by clicking on another.

Fascinating comments from Sho Kuwamoto, Figma’s VP of Product, on how plugins are implemented. Each plugin runs in a security sandbox — ​“We actually took a JavaScript VM, compiled it down to WebAssembly, and then we run that VM inside of the browser. So it’s a completely separate engine than the native JS engine. For security reasons, we don’t want two scripts running inside that VM, because then the two scripts could potentially have access to each other. And we don’t want to run two instances of this VM, for memory reasons.” 🤯

A new plugin for manipulating design elements to achieve interesting visual effects. ​“The plugin provides a wide range of features, including effortless horizontal and vertical movement, adjustments to size in both dimensions, rotation, duplication, and more.” See the demo video to come up with ideas for specific use cases.

Great examples of automating grunt work with the Automator plugin.

A new video from Figma is going back to basics — what components are, why we use them, and how to create them. See also a couple more new tips on Component properties and Variants.