The number of installs or downloads used to be the only metric in the Community, but over time it was replaced with how many times a resource was used. Now you can also rate and review Community resources. It’ll be interesting to see which of the most used resources are also the most loved ones.
“On the Enterprise plan, workspace admins can now brand the workspaces they manage to reflect their group by adding custom icons to workspaces. Organization admins can do this for any workspace in the organization as well.”
That’s pretty cool, especially if your team has multiple products with distinct color palettes! “Introducing custom color palettes in FigJam: you can now create custom color palettes for your team, so your files can match your team’s own aesthetic or company branding (Organization and Enterprise plans only).”
So excited about this release! I spent a good chunk of my Config talk discussing workarounds for using wide gamut colors in Figma, and this update addresses them all. See this thread by Qi Linzhi on the engineering challenges of implementing support for Display P3.
The next thing I hope for is a more precise way to select colors. Figma relies on hex values in the UI, but they’re supposed to be limited to sRGB and aren’t representative of what you’ll see in the browser. The Dev Mode uses the correct color(display-p3 R G B)
syntax as an output, but that doesn’t help much with input. Besides that, I’d like to see when the color is outside of the sRGB range and what is its closest fallback. OkLCH isn’t the easiest color space to use, but OkLCH picker gets that part right.
Ridd shares a free annotation components library to help designers communicate more effectively and nail down the handoff process. Comes with a video lesson on organizing Figma files using the helpers library.
…and one more list, but for advanced prototyping!
At Smashing Meets Figma event, Christine Vallaure showed how to add real data to your Figma designs, and various ways to include Google Sheets and API data via Kernel.
Miggi on using sections in Figma for prototypes and how to preserve the state of a given flow.
Designer Advocate Mallory mapped out a helpful list of resources like YouTube videos, playgrounds, community files, plugins, and articles to get started with Variables.
“In this livestream, Jake, Lauren, and Emil dive into Dev Mode, the newest space in Figma built for developers.”
Molly shares her 3 favorite tips from the Config talk “Designer and developer workflows unlocked using Dev Mode” — using “Compare changes” (my favorite as well, and the first thing I showed my team!), testing components in the Playground, and switching between the design and Dev Mode by pressing the Shift‑D shortcut.
💡 Start using Figma's new dev mode with these 3 tips!
— Molly Hellmuth (@molly_hellmuth) July 28, 2023
Config's deep dive on dev mode with @Avantika789, @laurenbandres, @jennylea_, and Jake Albaugh is CHALK FULL of amazing tips!
Keep reading for my favorite 3.. pic.twitter.com/xf8dM6nYfb
Carly Ayres from Figma sat down with the people working across design systems tooling both inside and outside Figma to understand what the rise of tokens and features like variables mean for the future of design systems.
Emily Brody, Product Marketing Manager at Figma, writes about the go-to-market strategy for the Dev Mode and how the team prepared for the launch and triaged bugs, requests, and feedback during the first two weeks.
Security improvements to public links — auto-generated passwords on all plans and expiring public links on the Enterprise plan.
A new tutorial from Vijay Verma on creating an animation for a loader indicator shaped like a glass filled with liquid. The prototype uses a few variables and conditions, and he shares them in the cheat sheet in the thread.
Another quick @figma tutorial to create this animation using variable and conditions 🥤. Small video to create this included. And get the code cheatsheet shared below. ✨ pic.twitter.com/VSiyS9jLSu
— vijay verma (@realvjy) July 19, 2023
Sam Gordashko collected resources on variables and advanced prototyping for the Design System University community, based on topics designers often struggle with.
Christine Vallaure wrote about one of the most under-the-radar new features of the Dev Mode — units conversion. Now, you can design with pixels and then translate them to rem or other relative units in code. (Thanks for sharing the friend link with Figmalion, Christine!)
Luis Ouriach with an introduction to variables and a primer on how to structure your variable collections for single and multi-brand systems.
Mark Steinruck shows how to scope variables for certain components to appear unchanged in light and dark modes.
Here’s a short video explaining how I’m using @figma variables and scoping to have certain components with a dark background appear unchanged in light and dark modes. #figma #variables #scoping pic.twitter.com/jXd2UL0rgV
— Mark Steinruck (@msteinruck) July 17, 2023
Niko shares how advanced prototyping came from a vision in June 2022 to reality at Config 2023. The team had to ship variables, multiple actions, expressions, and conditionals simultaneously to make it happen. This release is a huge achievement and the team should be celebrated for it.
With @figma's #Config2023 being a few weeks in the past, I wanted to share a thing I'm proud of: The way we talked about our Config launch a year ago super closely maps to how we actually ended up talking about it at Config. pic.twitter.com/i24dV5X8vp
— Niko (@nikolasklein) July 22, 2023