A few updates to granting or managing access to teams and projects (currently being rolled out). These include improved UI for the teams and projects share dialog, roles for team members on a project, and audience setting on teams and users will have the ability to directly control the audience setting on projects.

A big release of ​“squeaky stairs” fixes to the prototyping! First, the inline preview now shows mobile prototypes in draggable and resizable device frames. For a deep dive on this, see the article Behind the feature: Inline device frames.

Second, there are multiple improvements to the editing speed — copy and paste noodles and interactions to a different element; delete noodles and associated interactions; delete a starting point by dragging the ​“flow label” outside of the frame; disable all shortcuts on a prototype; enable multiple ​“After Delay” events on every node; use the ​“Change to” interaction on a nested variant; auto-exit the Scale tool when switching to the Prototype tab; copy a link to the selected flow; resize the inline preview to the actual size of the prototype, and auto-focus on the input when creating a new flow.

Third, improvements to prototyping with variables — when copying and pasting an element with a local variable bound to it, Figma will create a new collection with the copied variable; overlays now inherit the mode of the frame linking to them; negative numbers support in the expression builder; support for ! or not in a boolean conditional check (yay!), and string values ​“true” or ​“false” can be bound to instance visibility in addition to booleans. Prototyping performance has also improved, cutting down loading spinners by 22%.

Finally, the width and height values can now be set to zero, so we don’t need to rely on the 0.001 hack anymore! For a nice roundup of the above improvements, see threads by prototyping PM Garrett Miller and designer Niko Klein.

Creating beautiful gradients in Figma just got easier! New controls for flipping and rotating gradients (see why they’re separate controls), displaying the gradient stop position in percentage (another yay from me!), and even better-looking defaults (although they’re bringing back the old behavior if you add a gradient on top of another fill).

Anthony DiSpezio shows how merge reviews now ignore top-level sections, allowing you to review changes at the frame or component level.

“Some Figma features require users to upload or retrieve content from our servers (e.g. publishing a library, adding media to comments), but customers might have strict firewall settings that block these actions. Searching for ​“Check network settings” in quick actions will open a network settings modal, which indicates whether any of these services are blocked. IT admins can update their firewall’s allowlist to restore access. This modal is also accessible via a visual bell if users run into errors trying to use features blocked by their firewall settings.”

The new Figma for Jira app is now generally available, with a couple of new features — searching for linked Figma designs in Jira issues using Jira Query Language, and creating design automations in Jira to notify you of changes to designs, transition issue statuses, and easily add labels to issues with designs.

Molly spotted a nice improvement to opening a plugin from the Community — now they can be opened in a recent file instead of creating a new empty file in Drafts.

After being introduced at Config 2023 last June, Dev Mode will move out of free beta on Wednesday, January 31. Last week, Figma showed improvements and features they’ve been wrapping up before the release. Annotations are a big one — ​“designers can share additional context, specs, and measurements that are connected directly to designs, and developers can easily see designers’ notes as they work, ensuring that they don’t miss any crucial callouts during handoff.” Teams that did this manually will save a ton of time and effort. (As the top comment on Reddit suggests, flow arrows are a missing piece for annotations and something I’d love to see brought from FigJam.)

The compare changes modal was redesigned to show diffs both visually and in code. This is one of my favorite features, and I wish it wasn’t limited to the Dev Mode. I duplicate frames to riff on ideas all the time, and the compare view is an incredible tool for reconciling the differences between the two versions.

Enterprise customers can set plugins to run by default in Dev Mode for all files in their organization — ​“for example, you may want to check that you’re using a design system correctly, show links to design systems documentation, include information about internal APIs to use, or confirm whether a design uses components that already exist in your codebase.” Finally, the Figma for VS Code extension was redesigned to run plugins and improve the navigation and discoverability of design files. Instead of having to pan around a large canvas, you can easily select from a grid of frames and see frames individually with a focused view.

You can now select incompatible modes on layers, to make it easier to diagnose layers that aren’t able to use the mode (via Jacob Miller).

Figma is changing how they refer to paid seats across all of the products (Figma Design, Dev Mode, and FigJam). The paid seats are used to be ​“Editor” seats, and now they are ​“Full” seats.

“Rolling out to all Enterprise accounts over the next week, org admins can now sort users by cost center into a new container called billing groups. This allows them to track costs while using workspaces for content organization and collaboration. As part of this roll out, license management will transition from workspace admins to billing group admins. Workspace admins will no longer upgrade and downgrade users in their workspace or participate in true up.”

“Rolling out to Enterprise accounts over the next week: Org admins on enterprise accounts can now designate workspaces as ​“hidden” for more control over their sensitive content. Users who are not a member of the hidden workspace won’t be able to see it, but can still interact with individual documents they’ve been added to.”

Jacob Miller, a Product Manager on the Design Systems team, unpacks the new features and answers questions about variables: ​“Our latest updates to variables in Figma allow for even more flexibility with updates to stroke weight, effects, layout grid, and layer opacity, along with nested instance variant binding. These upgrades not only boost design customization, they help align design and code like never before. Here, we share an overview of what we’re shipping with variables, how to use them in your current workflow, and where we’re going next with typography.”

Not mentioned in the article, but my favorite update is that now the variables authoring window can be resized! See also this thread by Luis, and Hugo’s accurate summary of the community’s reaction.

Nice update to the Community resource pages — a new image gallery, plugin videos, and picking a relevant category to better showcase what kind of resource it is and what it can do. Also, remixes can no longer be published as they were misleading when it came to the authorship of the original resources.

If you have a paid resource in the Community, monthly payout statements are now available in your Community profile. Just click ​“View payout statements” under the ​“Metrics” tab to download a CSV of your earnings on Community.

“In this livestream, Figma designer advocates, product managers, engineers, and designers will take you through everything we launched — from new on-canvas previews for the font picker, to fun new ways to collaborate in FigJam and time-saving prototyping updates.”

Users on Professional and Organization plans now can use a password that’s been autogenerated by Figma when setting a password on a file. Org admins in Enterprise organizations can choose whether to allow users to create custom passwords or require Figma-autogenerated passwords for greater security.

Vice President of Product, Sho Kuwamoto, explains why quality-of-life improvements are at the core of Figma: ​“I don’t want to be at a company that only invests in things that will make headlines. I want to make a product that I feel proud of. The truth is, people do resonate with little changes, and we know that because we pay attention to our users’ individual stories. Plus, when you celebrate the small things and give each one their moment, it gives people a chance to recognize how important each one is.”

The final week of LBU includes a number of quality-of-life updates.

The design editor. #22: On-canvas previews for the font picker (yay!) #23: Press Tab on a misspelled word to autocorrect the typo. #24: SF Symbols icons now render correctly. #25 and #26: Text boxes and containers (like frames and sections) can be used as snap targets. #27: Select text from the canvas in View-only mode. #28: A bug fix for the text shifts caused by changes in colors or text properties. #29: Nested component properties are visible in the playground and Dev Mode.

Collaboration tools. #30: Media in comments (yay!) #31: The full gamut of emoji reactions in comments. #32: Nominate someone to spotlight. #33: Mind maps in FigJam (whoa!) #34: Mobile app makes browsing files easier. #35 and #36: Importing Asana and Jira projects.

Prototyping experience. #37: A fix to ​“mouse enter” and ​“mouse leave” interactions. #38: The prototyping modal now pops up right when you need it. #39: Temporarily hide the edit modal by holding Shift. #40: Making it clear when you have multiple actions tucked into an interaction. #41: The inline preview can follow the current frame. #42: Sticky scrolling improvements (see more on this below).

On Enterprise plans, workspace and team admins now can set default modes for a variable collection. This allows new files to open with the default variables modes set by the admin.