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

Stop designing inconsistent and misaligned websites and #UI and #UX designs. 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.

===

🔥 Join my Mastermind Group and Start Excelling Today:
https://mizko.net/x

===

Useful videos:
1️⃣ Figma Crash Course 👉https://www.youtube.com/watch?v=TYhp4s-vjK4&list=PLvnhVb8yYRQ3TDOsSgN0pf0XqG6E56IYM&index=1
2️⃣ UX Design Crash Course 👉https://www.youtube.com/watch?v=dzz-KeaTzgY&list=PLvnhVb8yYRQ3IjV4ogyXiYuB4UtjjS6-F&index=1
3️⃣ UI/UX tips to excel in your career 👉🏼https://www.youtube.com/watch?v=MBUn4FBAg-A&list=PLvnhVb8yYRQ3bGy6kwY3z12KMRin2BVYo
4️⃣ Freelance Crash Course 👉🏼https://www.youtube.com/watch?v=olnK_B4z4RY&list=PLvnhVb8yYRQ3Q_GbihsDmcmAQT4PxYoQZ&index=6

===

🎥 My filming equipment:
Canon EOS R - https://amzn.to/2ZTVoRz
Rode Wireless Microphone - https://amzn.to/3dPiRvn
Softbox lighting kit - https://amzn.to/2PmspE1

===

📚 My recommended books:
Hooked - https://amzn.to/3kvlofB
Lean UX - https://amzn.to/3aYLDrq
Good to great - https://amzn.to/3dOXyKl
Stories that stick - https://amzn.to/2NDD6BC
Contagious - https://amzn.to/3sqGGO6
Zero to one - https://amzn.to/3kuj5sS
Building a story brand - https://amzn.to/2ZTyWIe

===

💻 My work setup:
Macbook 13" M1 - https://amzn.to/3r17gx5
Webflow - https://bit.ly/3oqN59q
Figma - https://figma.com
Siteground Web Hosting - https://bit.ly/37NDkgg

===

🔗 Links
Personal portfolio: https://mizko.net​​​
Instagram: https://instagram.com/themizko
LinkedIn: https://linkedin.com/in/mizko
Twitter: https://twitter.com/mizko​​​
My global design community: https://thedesignership.com

===

#uidesign #uxdesign #figma #figmatutorial #ui #ux

Видео Figma Tutorial: Setup a Responsive Grid Layout for UI & Web Design (IN 11 MINUTES) канала Mizko