Setup a Responsive Grid Layout for UI & Web Design (IN 11 MINUTES)

Stop designing inconsistent and misaligned websites and user interfaces. Here’s my ideal way of setting up responsive grid layouts for desktop, tablet and mobile.

I also throw in a couple of golden nuggets to help you setup your very first vertical grid and some of my favourite shortcuts to speed up the process.

Be sure to subscribe to my channel 👉🏼 http://mizko.net/youtube-subscribe.

In this video:

1. Learn how to setup a responsive grid system for desktop, tablet and mobile.
2. Create a vertical grid system for vertical flow and consistency.
3. Configure your Figma Nudge to suit your grid system.
4. And more..

Episode Breakdown

00:00 – Start!
02:00 – Setup your first grid system/layout
02:50 – Introduction to vertical grid system/layout
03:50 – Create a vertical grid system/layout
06:55 – Set Figma nudge amount
08:10 – Setup a Figma tablet grid system/layout
09:10 – Setup a Figma mobile grid system/layout

Let me know if there are any specifics you would love to learn about Figma in the comments below.

===

IF YOU ENJOYED THIS VIDEO BE SURE TO LIKE, COMMENT & SUBSCRIBE.

===

1️⃣ Learn all my UI/UX tips to excel in your career 👉🏼https://www.youtube.com/watch?v=MBUn4FBAg-A&list=PLvnhVb8yYRQ3bGy6kwY3z12KMRin2BVYo

2️⃣ Learn all my tips to scale your freelance business 👉🏼https://www.youtube.com/watch?v=0bNWesia2Hs&list=PLvnhVb8yYRQ3Q_GbihsDmcmAQT4PxYoQZ

3️⃣ Tips to improve your design portfolio 👉🏼 https://www.youtube.com/watch?v=LxUvjobQQ54&list=PLvnhVb8yYRQ1r2bRy62deA5CfyK9oGl10

4️⃣ My free Figma Crash Course Playlist 👉🏼 https://www.youtube.com/playlist?list=PLvnhVb8yYRQ3TDOsSgN0pf0XqG6E56IYM

===

🔥 PS. I’m launching ‘Dominate the Freelance Hustle Blueprint’. I’ll be sharing my exact journey from $0 to $3M in 4 years 👉🏼 Join 2,500+ designers and subscribe for early bird: https://mizko.net/freelance-course.

===

#uiux #designexperience #uidesign #uxdesign #userexperience #figma #figmatutorial

===

🧑🏻‍💻 Personal portfolio: https://mizko.net
🐦 Twitter: https://twitter.com/mizko (Very active)
🤳🏼 Instagram: https://instagram.com/themizko (Very active)
👉 YouTube: http://mizko.net/youtube-subscribe (Even more active)