UI Design Bootcamp. Master Typography, Colour & Grids (Udemy.com)
Level up your design eye and improve your intuition to craft aesthetically satisfying UI designs
Created by: Rob Sutcliffe
Last updated November 2021
Our take
Based on the ratings of 1,671 students and a sample of their written reviews, the syllabus, the course as of November 2021. No course pays to be reviewed.
This is a design theory course dressed up as a bootcamp. The 9.5 hours split into 13 sections, with typography taking the biggest share (selecting typefaces, readability, styling and formatting), then grids and colour, and a short closing section on visual language. It is pitched at intermediate level and that fits: the syllabus assumes you already use Figma, Sketch or Adobe XD and have tried designing a screen or two. Front-end developers who want to understand design, rather than copy it, are among the most enthusiastic reviewers.
Students like Rob Sutcliffe's teaching. Reviewers call him clear and concise, and one says he teaches a thought process rather than a set of rules to follow. A front-end developer switching to UI/UX says it boosted her skills, and another reviewer says it made them discover the true importance of typography. The complaints are consistent, though. The three-star reviews say there is a lot of theory to absorb before anything gets applied, and that the 14 assignments never build into one project that carries across sections. Others wanted more real websites and apps pulled apart as examples, and more time on colour, which gets less attention than type.
The last update was November 2021, and one reviewer says the course looks abandoned. The theory ages well, so that matters less here than it would for a tool course, but do not expect current Figma features. The rating breakdown is healthy: 1,009 five-star and 531 four-star reviews against 24 at one or two stars. Worth it for the why; not the place for a portfolio piece.
Pros
- Teaches the reasoning behind type, grid and colour choices, not a checklist of rules
- Typography coverage is deep: classifications, pairing, readability and formatting across four sections
- 14 assignments and 5 quizzes push students to practise between lectures
- 1,669 reviews at 4.6, with a front-end developer moving into design among the most positive
Cons
- Heavy theory up front; several reviewers say real, applicable practice takes a long time to arrive
- No single project ties the sections together, and few real-world site or app teardowns
- Last updated November 2021 and one reviewer says it looks abandoned; colour gets less time than type
Very high quality course. There is deep and extensive knowledge passed to us in a very engaging and cultivated form.
Intermediate is right: it assumes Figma, Sketch or XD skills and some UI work done. Total beginners get theory with no tool walkthrough.
What you will learn
- Intuitively create more satisfying compositions
- Create a colour pallet that works specifically for UI
- Have a trained eye to spot how the values of colours
- Create a grid that works for modern web applications
- The history of typography
- The physics of light
- Select appropriate typefaces
- Create a typographic system
- Select or create a visual language
- Identify how colour adapts in different contexts
- Compose visually stimulating UI design
Course content
13 sections · 113 lectures · 9.5 hours of video 5 quizzes, 14 assignments
- 1Introduction 2 free previews3 lectures · 15 min
- 2Composition 1 free preview10 lectures · 1 quiz · 50 min
- 3Typographic Classifications 1 free preview9 lectures · 2 quizzes · 39 min
- 4Selecting Typefaces 1 free preview10 lectures · 3 quizzes · 1 hour
- 5Readability 1 free preview9 lectures · 2 quizzes · 1 hour
- 6Styling & Formatting Text 1 free preview18 lectures · 3 quizzes · 1.5 hours
- 7Grid Systems 2 free previews10 lectures · 1 quiz · 52 min
- 8Building Our Grid6 lectures · 1 quiz · 34 min
- 9Colour Interactions 1 free preview8 lectures · 1 quiz · 19 min
- 10How Colour Works 1 free preview5 lectures · 1 quiz · 26 min
- 11Colour Attributes 1 free preview10 lectures · 1 quiz · 53 min
- 12Create Our Palette 1 free preview6 lectures · 1 quiz · 30 min
- 13Visual Language 1 free preview9 lectures · 2 quizzes · 42 min
Who it is for
The instructor says it suits
- Junior user interface designer
- Front-end developer interested in learning about design
- Product owner
- Curious people
What you need before you start
- You should ideally know how to use some design software. Figma is preferred. Adobe XD or Sketch would also be okay.
- Some experience designing user interfaces would be an advantage.
- You'll need lots of extra time to work and share your projects
Quality Score
No CourseDuck member has rated this course yet. Taken it? Give each part a thumbs up or down.
Overall Score : 92 / 100
Course Description
The most crucial aspect to form a great user experience is having a beautifully crafted user interface. Some small changes to your aesthetics can have a huge impact on the experience of your users.
If you're designing using a web application, you're making decisions about typography, colour and composition that will affect the branding, style, usability and user experience of your application. You're already making these decisions but are you aware of their impact. Very subtle use of typography and colour can have enough personality that we don't need any other visuals. We can give life to a dull block of text and it can make it easier or harder for our users to read. Getting a few simple choices right can make or break the application.
Typography is 95% of what we see on a web application, it dictates every other design decision. yet few people really stop to learn how to use typography to their advantage.
Colour is what makes us differentiate everything in a design. If there was no colour we'd not be able to identify anything on a design. But it also has the most emotional connection of anything in a design and it can't be easily categorised, as colours appear very different depending on their use and context. We have to use colour, so let's learn to use colour to our advantage.
A grid makes our designs feel uniform. If we know how to use one, it's the single thing that can make a design instantly feel more professional. But we need to understand the limitations and advantages of recent web development to create a grid that looks good on paper and still looks good on the web.
What do I get in this course?
To improve your skill in each of these areas: you'll do a combination of learning some underlining theory, complete challenges to improve your intuition and some practical exercises to create some great-looking designs. A short description of each module is below.
Composition: practical exercises to improve your intuition when placing elements on a page
Typography: History and background of different type classifications
Selecting and Pairing: How to choose a typeface and how to select complimentary typefaces that work together
Readability: How do we read and how can we make it easier for people to read with our typographic choices
Styling & Formatting: What extra style can we add to our typography and how can we use this to improve our visual hierarchy
Grid Systems: The types of grids used in design and some of the technical limitations for modern application design
Building our Grid: How to ensure we set up the grids in our design software to work when developing applications
Colour Interactions: practical exercises to improve our intuitive use of colour when used in different contexts
How Colour Works: The physics behind how light works and how it creates colour
Colour Attributes: How to make changes to a colour to make it more useful in your design
Create our Pallet: practical steps to create a colour pallet that works specifically for UI
Visual Language: Choose photos, icons, illustrations and other visuals to support the design
Is this course for me?
Ideally, you'll already have spent some time designing websites and/or applications. Every aspect of the course is created with beginners in mind but you may find you get more out of the course if you've already created some designs. You'll also ideally need to know how to use some design software. I recommend Figma, but Adobe XD, Invission Studio, Sketch or some similar software will also be okay.
The course is created with designers in mind but it may also be of interest to front-end developers or product owners. There is a money-back guarantee with no questions asked and you can message me with any specific questions.
Instructor Details
- 4.6 Rating
1,671 Reviews
Rob Sutcliffe
It's been 10 years since I started working in elearning. I understand the limitations and the possibilities of online teaching. I'm excited for the future and I'm amazed at what we can do right now.
It's been 15 years since I first taught a class. I spent three years teaching english in Seoul. I loved seeing the progress of my students and I loved knowing they were having a good time in my class. I learnt about how to write a solid lesson plan the only way I believe anyone can... by seeing the results right there in front of me.
It's been 20 years since I first designed and built a website. I remember learning dreaweaver and flash while I was a student and been hooked on the power it gives us, even then I didn't know how far it would go. I've dedicated my life to building and designing web apps to the highest standard and now I want to pass that on.
It's been 35 years since I started school. and I wasn't that good at school truth be told. I had dyslexia and couldn't keep up, having overcome that and managed to find ways to teach myself the skills I need to get some fantastic jobs I'm confident I can explain things in a way everyone can understand and, knowing how much I struggled to learn, I can be very patient in explaining how things need to be done.
More courses by Rob Sutcliffe
Master Digital Product Design: UX Research & UI Design (2021)
4.4 (13,608 Reviews)
Provider: Udemy
Time: 15.5h
$199.99
Gamification: Motivation Psychology & The Art of Engagement (2020)
4.5 (12,509 Reviews)
Provider: Udemy
Time: 3.1h
$79.99
More Typography courses
Become an Arabic Calligraphy Artist from Scratch (2016)
4.6 (547 Reviews)
Provider: Udemy
Time: 5.8h
$199.99
Typography Fundamentals - Feel confident with type! (2019)
4.4 (423 Reviews)
Provider: Udemy
Time: 1h
$44.99
Chinese Calligraphy for beginners (English explanation) (2020)
4.3 (56 Reviews)
Provider: Udemy
Time: 3.2h
$34.99
Typographic Logos: Typography and Lettering for Logo Design (2016)
4.2 (2,456 Reviews)
Provider: Udemy
Time: 1.5h
$79.99
Reviews
By Yossi Siegel on 10/21/2025
I tried a couple of others. Was elated when I saw that Rob Sutcliffe is teaching a Graphic Design course, it's already as amazing as I could have only dreamed of short of a full on degree - Sutcliffe does not adhere to shallow rules and principles - he teaches tools and how to make the best use of them; he teaches a thought process rather than a robotic system that one need adhere to.
By Qui-Yang Lim on 2/29/2024
I thought the course in general was good in explaining the fundamentals of UI design, and it does go very well in depth into a lot of elements to explain. However, I feel that it does lack the sense of action. What I mean by this is the idea of having a continuous activity to do throughout all the sections so at the end you end up with something concrete that has been made. Additionally I have felt sometimes at times eg when we are being shown a figma file and explained things from it, I personally would love to have the figma file for myself to allow me to also play around to understand better when being told about things instead of being told this is this, and that is that. Overall the course is a good resource for fundamentals and a lot of theory.
By Anonymized User on 5/17/2023
I normally would not rate a course when just started, but I very much like that the teacher is so considerate and even explains how to use the different features of udemy (overview, q&a, notes etc.) is very special. He gives off the vibe that he is a very strategic teacher and know just exactly what extra level of detail you need to understand the full picture. I am already working as a ux/ui designer and need some extra training and refinement. I am looking forward to learn a lot from this course.
By Huong Phan on 5/5/2023
Rob has an amazingly deep understanding and experience behind UI rules. The course goes really deep into the why and explain a lot of new concepts behind each design choice, even a little bit of code to help collaborating with development teams. I think it's a great foundation for anyone starting UI journey. The course is long, but filled with deep and applicable insight. Great value for money. Highly recommend.
By Ana Paula Stavole on 4/24/2023
Very good course to deepen on the elements that make up the user interface. I found the choice and presentation of the contents, as well as the resources and examples used to apply the theory very good. The practice at the end of each module is a very important tool to detect aspects in which one should continue to explore. I suggest not to leave out tools that we must use in our work without the possibility of choice, Adobe XD in my case. Thank you!
By Denys Lytviak on 2/13/2023
It's a priceless course. I even feel bad I bought it with a discount. Things suddenly clicked. I never thought a webpage might express certain feelings. I had a binary perspective, either I like a design or I don't. I had no idea why looking at certain things "feels good". If you look at section titles for this course, you might find them to be pretty boring. I certainly felt that way. What can I learn about typography? The topic seemed to be pretty obvious. It turned out, I knew nothing. Same goes for almost every lesson in this course. It feels like Rob has almost unlimited knowledge depth. I could not recommend this course enough
By Danila Robert on 11/25/2022
The teacher teaches excellently, the information is very useful and I have learned a lot from this course so far. It's not the first I've bought from udemy, I've also bought from other sellers, but it's the highest score I've given so far. It should be noted that it is not a course for complete beginners, you must have a certain knowledge of what the course is about. I will definitely buy other courses in the future. :)
By Pierrounet on 10/16/2022
I like the focus on emotion and fonts, and all those secrets graphic designers knew about type choices and typescale. The different exercises really help to train. I like the emotional insight for color, it was so helpful ! Maybe missing one complete project to sum up all the skills. After 1 month and a half, I really expected to receive many feedbacks on my works, but I've received only 1 of them. It s a pity people don't collaborate. Analysing the other ones' works and writing it helps improving for professional skills !
By Khadijah Abdullah on 1/1/2022
I really loved the course and felt like I gained a lot of knowledge on how to bring together elements to create a cohesive piece geared towards improving user experience. I do however wish there were more bits on how to do certain things in figma for those who were not familiar with the software but still wanted to apply UI principles using the program. An example is how to alter icons in Figma or create patterns for the last assignment. I ended up having to go elsewhere to learn all of that.
By Vhinny Angelyque Molina on 12/26/2021
This course really exceeded my expectation! I learned a lot from Rob from his explanation down to his prepared exercises and quizzes. This is a great course to take especially if you want to dive into small to larger details and concepts of design. I really admire his teaching approach; he's more of has a personal understanding of design theories. I learned and applied a lot of knowledge gained from this course. Thanks, Rob!








