The Ultimate UI Grids & Layouts Masterclass
7h 6m 36s
English
Paid
Course description
The course is filled with real advice and tricks from a senior product designer with ten years of experience in design.
In addition to learning how to work effectively with grids and layouts in interface design, you will also discover what changes in your approach are necessary depending on different situations or types of UX/UI design projects - from web applications to mobile applications, from websites to wearable devices.
This is a highly practical course, and it includes numerous assignments that will help you solidify your new knowledge.
Watch Online
Watch Online The Ultimate UI Grids & Layouts Masterclass
0:00
/ #1: Welcome
All Course Lessons (34)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Welcome Demo | 03:48 | |
| 2 | Course Overview | 02:50 | |
| 3 | Set Yourself Up for Success | 02:28 | |
| 4 | Grids & Layouts 101 | 03:55 | |
| 5 | Historical Overview of Grids and Layouts | 07:03 | |
| 6 | Grids and Layouts Dictionary | 09:54 | |
| 7 | Everything is a "Box" | 03:30 | |
| 8 | Types of Grids | 11:12 | |
| 9 | Types of Layouts | 04:58 | |
| 10 | Basics of Grids in Figma (Demo) | 24:25 | |
| 11 | Auto-layout Basics (Demo) | 30:46 | |
| 12 | Psychology Behind a Great Layout | 08:07 | |
| 13 | Visual Hierarchy | 07:08 | |
| 14 | How to Achieve Visual Hierarchy | 05:56 | |
| 15 | Alignment | 03:08 | |
| 16 | Whitespace | 05:14 | |
| 17 | Composition | 03:27 | |
| 18 | Visual Storytelling | 05:18 | |
| 19 | Responsive Design 101 | 10:50 | |
| 20 | Screens and Units | 09:14 | |
| 21 | Mobile-first Approach | 06:59 | |
| 22 | How to Design Responsively | 06:22 | |
| 23 | Auto-layout Mastery (Demo) Part 1 | 20:24 | |
| 24 | Auto-layout Mastery (Demo) Part 2 | 24:30 | |
| 25 | Auto-layout Mastery (Demo) Part 3 | 17:16 | |
| 26 | Auto-layout Mastery (Demo) Part 4 | 12:06 | |
| 27 | Auto-layout Mastery (Demo) Part 5 | 27:16 | |
| 28 | Practical Mobile App Grids (Demo) | 42:08 | |
| 29 | Practical Web App Grids (Demo) | 41:57 | |
| 30 | Practical Responsive Website Grids (Demo) Part 1 | 19:47 | |
| 31 | Practical Responsive Website Grids (Demo) Part 2 | 26:21 | |
| 32 | Practical Iconography Grids (Demo) | 11:28 | |
| 33 | Main Takeaways | 04:57 | |
| 34 | Congratulations | 01:54 |
Unlock unlimited learning
Get instant access to all 33 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionBooks
Read Book The Ultimate UI Grids & Layouts Masterclass
| # | Title |
|---|---|
| 1 | UI Design Grids & Layouts Glossary |
| 2 | UI Grids & Layouts Kickoff Questionnaire |
| 3 | UI Grids & Layouts Common Mistakes Checklist |
| 4 | UI Grids & Layouts Custom Grid Guide |
| 5 | UI Grids & Layouts How to Document a Custom UI Grid for Development Example |
Comments
0 commentsSimilar courses
Complete Web & Mobile Designer in 2023: UI/UX, Figma, +more
Sources: udemy, zerotomastery.io
Using the latest best practices in Web Design and Mobile Design as well as User Interface and User Experience Design (UI/UX), this course focuses on efficiently
20 hours 31 minutes 41 seconds
Photography Masterclass: A Complete Guide to Photography
Sources: udemy
This photography course is designed to teach you the ins and outs of photography, even if you have little to no experience with it, to help create profitable im
23 hours 10 minutes 9 seconds
The UX Portfolio Formula - A UX portfolio course created by Sarah Doody
Sources: Sarah Doody (courses.sarahdoody.com)
A UX portfolio course to help you write better case studies, stand out to recruiters, and get a role you love.
40 hours 27 minutes 54 seconds
The Ultimate UI Typography Masterclass
Sources: Andrija Prelec
The course is filled with real advice and tricks from a senior product designer with ten years of experience in design. Besides learning...
4 hours 53 minutes 7 seconds
The Ultimate Airtable Design System Inventory and Automation (Bundle)
Sources: Romina Kavcic
Learn to quickly create an inventory with Airtable and easily integrate it with tools like Figma, Jira, Slack, GitHub, and others. Sync your design tokens...
37 minutes 48 seconds
Want to join the conversation?
Sign in to comment