Course Hive
Search

Welcome

Sign in or create your account

Continue with Google
or
Responsive Design Beginner's Tutorial for Figma
Play lesson

Complete UX & Design Systems Course (English) • All 18 Episodes - Responsive Design Beginner's Tutorial for Figma

5.0 (2)
23 learners

What you'll learn

This course includes

  • 7.3 hours of video
  • Certificate of completion
  • Access on mobile and TV

Summary

Keywords

Full Transcript

Email us to Train your Company on [email protected] 👉🏻 Full UX Designer Course for Beginners - https://learnuiux.in/ Join our Instagram Broadcast Community https://ig.me/j/AbYz7q54oZ3CBSHs/ 👉🏻 Follow me on Instagram: https://www.instagram.com/anshmehra.in ⏱ Timestamps 0:00 - Intro to Responsive Layouts 1:29 - First Time Walkthrough 2:10 - How do Frames work? 3:33 - Frames vs Groups 5:10 - How do Constraints Work? 6:46 - Practical Example 8:30 - Floating Action Button (FAB) using Constraints 10:44 - Example #2 - Mobile Layout 13:43 - Responsive Plugin (Ultimate Stuff) 14:53 - Magic of Constraints 🪄 15:13 - Conclusion 16:37 - Parallel Story - Scene 1 🌏 Keep up with Design and AI: 🔗 https://www.instagram.com/anshmehra.in/ 🔗 https://www.anshmehra.com/ 🔗 https://medium.com/ansh-mehra Links mentioned in the video: 🔗 Figma's Getting Started Playlist (Must for Beginners) https://www.youtube.com/watch?v=Cx2dkpBxst8&list=PLXDU_eVOJTx7QHLShNqIXL1Cgbxj7HlN4 🔗 Figma's Features (Amazing Stuff) https://www.youtube.com/watch?v=gnscqweM_NU&list=PLXDU_eVOJTx6zk5MDarIs0asNoZqlRG23 🔗 Notion (I use it for Documenting & collecting my thoughts) https://www.notion.so/ 🔗 Google Material Design Guidelines (for building a strong Foundation) https://material.io/design/guidelines-overview 🔗 FAB Button: https://material.io/components/buttons-floating-action-button 🔗 Auto-Layout in Figma (quick 5 minute tutorial) https://www.youtube.com/watch?v=TyaGpGDFczw 🔗 Responsive Plugin (by Emin Sinani) https://www.figma.com/community/plugin/840727678445998968/Responsive What is responsive design?, How does responsive design work in Figma?, How to design for different screen sizes?, What are breakpoints in responsive design?, How do I use auto layout for responsive UI?, How can I test my designs for mobile and desktop?, What’s the difference between adaptive and responsive design?, How do I make buttons and text responsive in Figma?, What layout grids should I use for responsive design?, How do I set constraints in Figma?, Can Figma simulate mobile and tablet views?, What is fluid layout vs fixed layout?, How do I use frames for responsiveness in Figma?, How can I design a responsive navbar?, How do professional designers approach responsive design?, Should I design mobile first or desktop first?, How do I use components responsively?, What’s the easiest way to start responsive UI?, How to handle images in responsive layout?, How can I preview responsive changes in Figma? Ansh Mehra, Ansh Mehra UX, Ansh Mehra AI, Cutting Edge School, Free UX Design Course in Hindi, UI/UX Course in Hindi, Product Design Free Course, responsive design Figma, Figma tutorial for beginners, responsive UI design, auto layout Figma, mobile and desktop design, breakpoints Figma, responsive web design tutorial, Figma auto layout responsive, Figma layout grid, adaptive vs responsive, fluid design Figma, Figma frames tutorial, how to design responsive UI, Figma constraints tutorial

Course Hive

Continue this lesson in the app

Install CourseHive on Android or iOS to keep learning while you move.

Related Courses

FAQs

Course Hive
Download CourseHive
Keep learning anywhere