How to use Figma Frames & Autolayout?

🍿 Watch rest of the Figma Course -    • Basics of Figma Series | Ansh Mehra  

This is Episode 2 of Foundations of Figma where we will cover how to practically use Frames, Constraints and Autolayout along with all the tips and tricks you'll need to use Figma like a professional.

Foundations of Figma is the most practical and actionable Figma course you'll find on the internet with proper homework and resources at the end of every video.

🌏 Keep up with Design and AI:
🔗   / anshmehra.in  
🔗 https://www.anshmehra.com/
🔗   / ansh  

🚀 Complete Roadmap to a UX Design Career:
→ https://learnuiux.in/

🏆 Learn about Prompting and AI Tools:
→ https://www.howtoprompt.in/

Resources mentioned in the video 👇🏽

🔌 Figma Community Files:
https://www.figma.com/community/file/...

🔌 Article - Responsive grids and how to actually use them
https://uxdesign.cc/responsive-grids-...

🔌 Article - Space, grids, and layouts
https://www.designsystems.com/space-g...

🔌 Article - Everything you need to know as a UI designer about spacing & layout grids
  / everything-you-need-to-know-as-a-ui-design...  

🔌 Quick Responsive Workflows
   • Quick responsive workflows  

🔌 Figma Help Centre:
https://help.figma.com/hc/en-us

🔌 Responsive Plugin:
https://www.figma.com/community/plugi...

🔌 Sorter Plugin:
https://www.figma.com/community/plugi...

🔌 Find all shortcuts:
https://shortcuts.design/

🔌 Figma Web and App Design Type Styles & UI Typography Systems on Figma | UX Design System Tutorial:
   • Figma Web and App Design Type Styles ...  

🔌 Step by Step Roadmap for how to become a UX Designer (Updated 2023)
   • How To Become a UX Designer (Step by ...  

🔌 is this the end of UX Design? Will AI take over soon?
   • How to Plan UX Design Career with AI?  

🔌 How to use Notion - Beginners Tutorial (2023)
   • How to use Notion - Beginners Tutorial  

🔌 What is UX/UI Design? Learn Figma for free in Hindi/English
   • What is UX/UI Design? Learn Figma for...  

Do comment your reviews here or on Twitter (@AnshMehraaa) or share a story on Instagram (@anshmehra.in)

Timestamps
0:00 - Intro
0:33 - Syllabus
1:25 - Video Overview
1:55 - Groups vs Frames
2:35 - Horizontal & Vertical Constraints
10:11 - Why Frames?
15:25 - Nested Constraints
20:26 Responsive & Adapted Design
28:45 - Basics of Autolayout
48:50 - Practical Implementation
55:22 - Resources to Learn Figma
57:51 - Homework

⚡️ Checkout Zuddl (Events hosting platform for Conferences and Marketers)
→ https://www.zuddl.com/