Aninix is a powerful UI animation plugin for Figma: “Easily create motion design systems, export animations for promos, and provide animation inspector for developers.”
Prototyper is a new plugin from the team behind Automator, offering powerful prototyping with JavaScript right in Figma, similar to the old days of Framer Classic. A really powerful combo for exploring ideas and building prototypes in higher fidelity.
Figma dropped a new tutorial: “With component properties, you can define which parts of a component can change. And instead of creating separate variants, you can use component properties to reduce the number of components needed. This takes the guesswork out of designing for anyone using these components and they can quickly make adjustments as Figma keeps component property controls in one place.”
Miggi shows how to use images as masks.
Super useful tip: double-click on the icon of an object in the Layers panel to jump to it. (Double-clicking on a name will trigger renaming.)
No fucking way. I’ve just learned that if you double click the Frame/Autolayout/text (whatever it is) icon in the layers panel, Figma will jump to it. 🤯 pic.twitter.com/HmgWoHHCYQ
— James 🤌🏻 (@jamesm) June 20, 2022
Middle-clicking or ⌘-clicking on the hyperlink goes directly to the target.
Did you know you can now middle-click on a @figma hyperlink to directly jump to target?
— Mr. Biscuit (@SShuaiqi) June 18, 2022
Also If you don't like clicking on the middle mouse button you can also ⌘click on the hyperlink pic.twitter.com/k0TdZWUesO
A short overview of the most important parts of Figma for developers.
Most times we're too busy looking at Figma as a designer. Ever wondered how Figma works with View-only access?
— manocado 🥑 (@onowomano) June 18, 2022
This thread is mostly for Devs, or anybody else that uses Figma without Edit access 🙃
🧵 pic.twitter.com/Na8kDCUfd6
Generative Art by Pawel Kontek is one of the coolest plugins I’ve seen in a while. It’s currently in beta and I can’t wait to play with it after it comes out!
"Ultrasound Hummingbird" in @figma. Playing around with manipulated #generativeart on the output of my next Figma plugin. Sign up here for the upcoming beta: https://t.co/HfaNrEN6lg @FigmaPlugins @FigmaHunt @fof_artists pic.twitter.com/7VJ9za4yiL
— Pawel Kontek (@PawelKontek) June 12, 2022
Cool update to a LottieFiles plugin: “Instantly change the colors of your animation. Apply your own custom colors, or try out our carefully curated preset color palettes.”
That’s a pretty badass collection of shortcuts — I didn’t know most of them!
Supafast!
🌁 Animating carousels in @figma, supafast! pic.twitter.com/1PYgLmsJ6g
— Zander Whitehurst (@zander_supafast) June 13, 2022
This deep dive into the making of the feature is my favorite kind of a blog post on Figma’s blog: “Building spring animations took our engineering team back to the classroom — to make animations that are both natural and accurate, we borrowed principles from physics. We’re excited to share the mechanics behind the movement, and the story of how spring animations bounced their way into Figma.”
Neat shortcut: ⌘-click on the Auto Layout padding field to adjust all paddings.
Neat @figma easter egg: ⌘ + click in an auto-layout padding field to adjust all paddings. pic.twitter.com/UCt34URAqi
— Mordechai Hammer (@_mordechai) June 7, 2022
Rasmus Andersson shows how to make a simple font in Figma.
Sunday funday: Make your own font in @Figma.
— Rasmus Andersson (@rsms) June 5, 2022
Copy this file to get started: https://t.co/e9SyhPZpqL pic.twitter.com/rM6ctpKB3h
Andrei Iancu shared two more kits with loading animations — see also his really cool Kit 3 with delayed steps.
“Check out our nine Google Fonts pairings and start using them in your design projects. The pairings are hand-picked from Google Fonts catalog and open-sourced for everyone to use.”
“We’re excited to talk about yet another awesome new feature: Component properties. Join us as product manager Jacob Miller and designer advocate Chad Bergman share more on how you can reduce variant explosion in your design systems and improve developer handoff.”
“Learn all about the redesigned Auto Layout. We’ll walk you through how to use the new properties panel and on-screen controls, as well as showcase the new layout features like absolute positioning, negative spacing, and more.”
“Tune in to hear Clara, Amanda, and Qi walk through how to get started and unlock more font styles. From optical sizing to slant, learn how variable fonts give you more design control and expression.”
Layout FM podcast host Rafa is joined by special guests Joel and Oscar from Figma to talk about their work designing AutoLayout V4.