Alexunder Hess – The Power & Psychology of UI Grids and Layouts for Websites and Mobile apps

The Power & Psychology of UI Grids and Layouts for Websites and Mobile apps Information

Learn how to create professional layouts for websites, mobile apps, Instagram carousels, and other digital products using Grids.

• for eCommerce, marketing websites, web apps and dashboards, desktop, tablet, and mobile versions, for simple one/two-column and complex 7-column mobile apps
• Psychology, Marketing, and Design Process secrets
• Instagram posts & carousels grids & layouts
• How to find inspiration for your stunning works all around you

Grids are one of the most effective design tools that will forever change the way you design websites and mobile apps.

This class is not only about Grids & Layouts

it’s about the Psychology of UI and how to make your works look professional, make your life much easier, save you time, give the feeling of a high-quality product, and help you charge more for your work and get visible.

What You’ll Learn In The Power & Psychology of UI Grids and Layouts for Websites and Mobile apps

• Benefits of using Grids for websites and mobile apps
• How you used Grids when you were a child
• How to create professional-looking websites and mobile apps Layouts with Grids
• Psychology of a Great Layout
• How to understand what Grid to use and how to create it
• Universal Grids for Websites (desktop, tablet, mobile), mobile apps, Instagram carousels and posts
• Examples of different types of Grids and Layouts
• Why and where you don’t need to use 12-column and 8px Grids
• Breaking the rules: How to create a custom Grid for your specific project
• How Gestalt principles define the Layout and why you need to know about it before you start designing anything
• Practice: combining the knowledge (Gestalt, Grids, Layouts)
• Practice: let’s create Grids and layout for a website (+some tricks and secrets, hint: we will be using Math)
• Practice: let’s create a Grid for a mobile app (tab bars, filters, buttons, content + layout accessibility secret from my experience)
• Practice: let’s create a web app with a dashboard (say “No!” to a 12-col Grid, we will create something mindblowing + animation)
• Q&A: Grids for Modal screens (how many columns?)
• Q&A: Grids for Navigation (on or off the grid?)
• Q&A: Grids and Buttons (should the button be the size of columns?)
• Q&A: 3-,5-,7-col Grids in mobile apps (where to use and for what)
• Q&A: Left and Right direction Grid (where to use?)
• Q&A: Grids and Layouts without Grids (Wow!)
• Q&A: Simple ugly Layout for a high converting website (marketing tip)
• Q&A: Simple beautiful Layout for a high converting website (design tip)
• Q&A: How to define what Grid a website uses
• Q&A: How to use a Grid calculator I created for you
• Q&A: Should you use a 4px grid for a mobile app?
• Q&A: Is it possible to use Grids with 0px margin, gutter or column width? If yes, where.
• + Special lesson: Grids for Instagram posts and carousels (rules & problems to avoid)
• + the Math behind Complex Grids

Who is this course for?

This masterclass is for Mid- and Senior Designers.

If you’re a Junior UX/UI Designer and you understand how to design websites or mobile apps, you used Grids before but don’t know exactly why and how to apply them, this class will also be beneficial for you.

UX/UI Designers

You’ll understand the What, How and Why behind Grids and Layouts, and it will make your design process super efficient and your works will look more professional.

Graphic Designers

In the masterclass we will cover how to create and use Grids for Instagram posts and lots of Psychology & Marketing secrets. You will love it.

Developers

You’ll understand how designers create Grids and Layouts and the Math behind them, so it will be easier for you to calculate and code them.

Content Creators

One of the sections of the masterclass will be specifically about grids for social media posts and Instagram carousels. You’ll learn the rules that will make your post stand out.

About Author

Helping designers improve their skills & monetize their knowledge

I am passionate about helping designers explore the world of User Experience Design through understanding Psychology and Marketing behind a successful product, Design Principles, Motion Design and User Interface Design secrets.

All these tips will help you work faster and wiser, so you’ll be able to monetize your skills, make more money and save your time.

In my arsenal of tools, you can find Figma, Sketch, Adobe XD, Invision Studio, Principle, After Effects, Photoshop, Illustrator, Cinema 4D.

I am a multidisciplinary, self-taught designer with a Master’s degree in Marketing. In 2008 I switched from front-end development (mostly HTML & CSS) and started my career in Web design. Since then, I’ve worked with huge companies like Wargaming, CIBC, iHeartRadio, Entercom, Carnival, SiriusXM, GoodLife and many others.

I have gone through a long journey from a design amateur to Junior UX/UI Designer to Product Design Director over 15 years of my career.

I can talk about usability, typography, motion design, psychology, marketing and design for hours. This is my absolute passion. And it’s supported by successful products I designed for my clients that brought them from thousands of visitors to millions of dollars.

As a result, I want to help others grow in their career and income with the right skills in design and marketing.

More courses from the same author: Alexunder Hess