The Ultimate UI Grids & Layouts Masterclass
7h 6m 36s
English
Paid
August 24, 2024
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 The Ultimate UI Grids & Layouts Masterclass
Join premium to watch
Go to premium
| # | Title | Duration |
|---|---|---|
| 1 | Welcome | 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 |
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 |
Similar courses to The Ultimate UI Grids & Layouts Masterclass
The UX Portfolio Formula - A UX portfolio course created by Sarah Doody
Duration 40 hours 27 minutes 54 seconds
Course
Complete Web & Mobile Designer in 2023: UI/UX, Figma, +more
Duration 21 hours 31 minutes 53 seconds
Course
UI Design Demo Videos Vault
Duration 12 hours 8 minutes 12 seconds
Course
Kickstart your UI/UX Design Career / DesignCourse UI/UX
Duration 16 hours 33 minutes 33 seconds
Course
The Ultimate UI Colors Masterclass
Duration 5 hours 35 minutes 10 seconds
Course
The Ultimate UI Typography Masterclass
Duration 4 hours 53 minutes 7 seconds
Course
UI Design Foundations
Duration 4 hours 30 seconds
Course