#Auto Layout
Pros and cons of Spacer components
Dan Hollick shares a few pros and cons of using Spacer components vs. Auto Layout.
Why do people use Spacer components?
— Dan Hollick 🇿🇦 (@DanHollick) January 26, 2022
Personally, I prefer using Auto Layout wrappers and controlling spacing with gaps but there might be a use case I'm overlooking?
Made some pros and cons below 👇 pic.twitter.com/uHHJndbRrn
An idea for Auto Layout 4.0
Nice concept of what one of the features in Auto Layout 4 may be. I’d definitely love to see this!
10 Auto-Layout Tips in Figma
A few good tips on using Auto Layout by Danny Sapio.
5 tips for designing a responsive dashboard in Figma
Molly shares a few takeaways from recreating a responsive Asana dashboard in Figma.
💡5 tips for designing a responsive dashboard in Figma
— Molly Hellmuth (@molly_hellmuth) November 23, 2021
Responsive design seems to be one of the trickier topics for my students so I made a project for them (Recreate the Asana Dashboard in Figma). Below are some of my favorite takeaways from the project. pic.twitter.com/RHtIRQnLIm
Advanced Auto Layout Tutorial
Danny Sapio is showing how Auto Layout can be used to create a scalable and flexible interface.
Figma Guide for Auto Layout & Constraints
“Creating components with automated sizing behavior saves a lot of time during the process. They also let us think more like a developer that has to implement the real application. That is why it is essential to master Constraints and Auto Layout in Figma.”
How to design powerful components and buttons with Variants and Auto Layout
Dennis Cortes goes over his approach to building scalable components in Figma using Variants, Variant Groups, and Auto Layout. This video touches on the basics, from definitions of each feature to more advanced methods of building out different types of variants in Figma.
It’s time to fix “mixed” values for Auto Layout padding
Mariz brings a great point — the current implementation not only hides the values but also makes you click on another UI control to change them.
Hey @figmadesign, it is time to fix this "mixed" values for autolayout padding... just keep the values with commas or give us an editor for multiple values like you already have for border radius. pic.twitter.com/ISmgwxs6qi
— Mariz (@MarizMelo) September 29, 2021
Interactive Components & Auto Layout
Interactive Components (currently in beta) now work with Auto Layout, and that opens doors for some fun interactions.
Did somebody say...auto layout AND interactive components?
— luis. (@disco_lu) September 30, 2021
It's now live in Figma for everyone on the beta – can't wait to see what you all make 🪄
You can signup here if you're not yet enrolled: https://t.co/PYXoKapYVL pic.twitter.com/XkaHIoBlOr
How to Hack a Slider with Auto-Layout
Auto Layout chat bubble components for FigJam
“In this Figma Tip, we create an Auto Layout chat bubble to be used in FigJam. Chat bubbles outlined in this tip and some additional Auto Layout notecards can be downloaded and reused from a community file.”
Using Auto Layout to make a table
Over a year ago I made a 56(?!) second video on how to make a table using auto layout. Since then Figma has released a ton of amazing updates, like variants! Here's a 55 second video on a simple way to make a table with auto layout and variants pic.twitter.com/nZ33gPqSzq
— Figma:55 (@figma55) June 16, 2021
Figma tutorial: Auto Layout review card iterations
Placing objects over Auto Layout frames
Reverse layers order in Auto Layout
🔥 Hot #FigmaTip: using 180° rotation to change layers order in @figmadesign Auto Layout. pic.twitter.com/XTvq2QsB5S
— Eugene Fedorenko 🇺🇦 (@efedorenko) April 27, 2021
The difference between using Packed & Space Between in Auto Layout
If you use Auto Layout in @figmadesign, I wanted to quickly share the difference between using Packed & Space Between, which for me, has been one of the most useful and helpful features when building components! ↔️ pic.twitter.com/eDfijFpQdn
— Joey Banks (@joeyabanks) April 14, 2021
Auto Layout in Figma
Auto Layout order
(Now that I'm no longer working at Figma I can do this:)
— Rasmus Andersson (@rsms) March 30, 2021
Hey @figmadesign this is _so_ confusing. Can we plsss reverse the direction? pic.twitter.com/B0mj8tSUtO
Live-Building Figma Kits for Tailwind UI with Auto Layout and Layout Grids
Live-building Sign-in and Registration components for the official Tailwind UI Figma kits.
Segmented Control component
Using Auto Layout, Variants, and hidden layers to create a Segmented Control component in @figmadesign. 🎛↔️ pic.twitter.com/U53IPDcLay
— Joey Banks (@joeyabanks) February 17, 2021