A nice little update to the Figma mobile app. I like how the app is focused on real-world “jobs to be done“ instead of shoehorning the whole Figma experience into the phone.
Minor but helpful change to the color picker — limit the options only to the current page.
Vijay is doing his magic with a modular illustration built from components.
Meng To shows a website made entirely in Figma and exported to React with Locofy.ai, which I wrote about in issue #155. Responsive layout, breakpoints, pages, animations — everything just works. He gives a few tips on preparing your design for the seamless export to code.
That’s not all! Now, you can also select multiple pages by holding Shift to rename, delete, or move them in bulk.
I fully expected all big product announcements to be saved for Config, but we have an unexpected treat! Jokes aside, this is a very elegant solution based on how people already organize their files. Reminds me of how Twitter came up with retweets and the book The Best Interface is No Interface.
“When you name a page in Figma using only hyphens, en/em dashes, asterisks or spaces, that page will now automatically convert into a page divider.”
After his original video of a futuristic speedometer with a smoke effect got a ton of traction, Alex Barashkov published the Figma file and recorded a detailed 33-minute-long step-by-step tutorial on making it.
Cameron Moll shares his thinking on delight and utility: “Utility is the value a user derives from interacting with your product. […] Delight is the satisfaction a user derives from interacting with your product. […] Design, Product, Engineering must work closely to put utility first. But each of these — Design in particular — must also advocate for delight to transform product value from “need to” to “want to.” Prioritizing delight is another form of slowing down to speed up.” See more of his thoughts on delight.
Stripe puts their money where their mouth is. The new User Experience Assurance team is “focused on evaluating and improving user experiences across all of Stripe’s products. This team evaluates, measures, and tracks the experience quality of Stripe’s user journeys. You will work closely with product teams to ensure that Stripe products meet or exceed our high quality bar.”
Use the new “Set variable mode” prototype action to change the variable mode of the current page. See the new section in the help article or try it out in an updated Advanced prototyping playground file.
Is that a photo, a render, or a Figma file? Impressive job by Naseer Ahmed.
Mike Smith opens a Figma file for the recent hotel branding project, which includes a mood board and three different directions. Beautiful work from a local Philadelphia studio Smith & Diction.
Mike Rundle points out interesting implementation details in the Apple Design Resources – visionOS file.
A short explainer on bringing SVGs from Figma to Rive, where you can build functional graphics with rich interactivity and animation.
Chad with a timely reminder that the variables icon appears only if there are variables with the right type in your file.
“Did you know that 1⁄4 of mobile users tweak text sizes on their phones?” I didn’t know that! In this thread, Branimir shows how to set up accessible interface scaling with the latest typography variables.
Developer Advocate Jake shows Jason Lengstorf how to bring your code into Figma with Code Connect.
Lee Munroe and the design team at OneSignal learned how to create Figma plugins from scratch and shared the first steps for building something simple. Between an excellent Create Figma Plugin toolkit and ChatGPT, I recommend giving it a shot.
A reminder that Framework is happening on Tuesday, April 16th. Figma published the schedule for this 3‑hour-long event, which will be a great fit for anyone interested in variables, design systems, and design-to-code handoff.
Tom Lowry walks through recent updates to branches — the default zoom level of previews is increased to 150%, the full branch name is now visible on hover, better text legibility, transparent backgrounds for effects, a few changes to improve review of variables, and bug fixes.