UX DESIGN & UI DESIGN ONLINE COURSES

My favorite UX & UI design courses

A compass for self-taught designers

Krisztina Szerovay
UX Planet
Published in
16 min readFeb 25, 2024

--

My favorite UX and UI design courses — A compass for self-taught designers

I help you choose

So you want to become a designer, or improve your design skills? I believe that we live in a day and age where being a self-taught designer has never been so easy. The biggest challenge is to choose the best resources: we have limited time, attention and money, so in this little guide I’d like to show you my favorite courses.

I attended my first design course in 2010 (as part of the course work, we created web designs in Adobe Photoshop :) ). Since then, I completed many-many more. I’m an online course hoarder, and while I took a lot of advanced design courses in the past, I’m always ready to learn some new tricks and tips from beginner-level courses (and naturally, there are always new tools and features to learn).

Additionally, I’m an online teacher myself, I have 23k+ students on Udemy (and 3 courses), and I teach at a product design (xLabs) and a UI design (UI Academy) bootcamp here in Hungary, so I know a thing or two about how to structure a course curriculum or how to gradually explain complex concepts.

My favorite design courses

I have personal experience with all the courses I mention in this article, and I also included my own courses, I really hope you’ll find my list useful! Additionally, I mention two courses from related fields: social psychology and visual thinking.

If you look at the list of my favorite courses, you can see that I included three UI-focused courses (Learn UI design, Ultimate UI design bundle, Gorgeous UI course), two Figma courses (Level up with Figma and Figma Academy) and two UX-focused courses (Smart Interface Design Patterns and Into UX Design).

Summary: list of my favorite UX & UI design courses

✨ Smart Interface Design Patterns by Vitaly Friedman

Screenshot of the Smart Interface Design Patterns website
Smart Interface Design Patterns by Vitaly Friedman: 100 smart interface design patterns and real life examples

Users expect your digital product to work in a way that is aligned with their past experiences, they have a mental model about how something should work. Jakob’s Law (named after Jakob Nielsen) states that since users spend most of their time on other websites, they prefer your site to work the same way as all the other sites they already encountered with. One example: just imagine that you design an app where the little “X” in the corner of your application window would represent minimizing the window instead of closing it — it’d be very-very confusing.

Now this epic course by Vitaly Friedman provides you with a great shortcut. Naturally, you can study design patterns on your own by reading books about interaction design, observing publicly available design systems and design guidelines, and I’m not saying you shouldn’t do all this. I’m saying that take this shortcut to give yourself a strong foundation.

The course features:

  • 100+ interface design patterns
  • design checklists for each pattern
  • 35 lessons, 10+ hours (growing library), free lesson preview: Accordions
  • one of the best design teachers on the planet (if you haven’t experienced Vitaly’s teaching style yet, check out his design talks, e.g. this one: Designing for Complex UIs, a talk delivered at WebExpo)
  • an option to attend a series of live workshops
Screenshot of the pricing plans design checklist from the course
I love these design checklists!

✨ The Ultimate UI Design Mastery Bundle by Supercharge Design (Andrija Prelec)

Screenshot of the UI design mastery bundle website
The Ultimate UI Design Mastery Bundle by Andrija Prelec (Supercharge Design)

UI design is a complex topic, there are so many interesting aspects you can learn about. It’s like a treasure chest full of shiny, colorful objects. However, it’s easy to get lost in all those areas and little details. What if someone promised you that they’ll cover all the relevant aspects for you? Well, Supercharge Design did exactly that.

To be completely transparent, I haven’t consumed all the content included in this huge bundle, but I’ve watched enough of it to be certain that it’s one of the best value for your money if you want to become a design professional.

What I like about these courses the most is that you can instantly tell that the teacher, Andrija knows his stuff. He is a truly experienced designer, and at the same time, a great educator. As I mentioned in the intro part of this article, I’m always happy to learn some new “beginner level” tricks and tips, so I was really glad to find some little gems, pieces of advice inside this bundle.

This is what the bundle includes:

Some highlights of the bundle:

One of my personal favorites from the bundle: The Ultimate UI Typography Masterclass. It really helps you establish a strong foundation. For instance, it’ll teach you how to pair fonts:

Screenshot of the how to pair fonts slide

You surely know that color plays a crucial role in UI design (just as Andrija mentions in the course, the way you use colors can influence emotions, helps you create contrast and establish a visual hierarchy in order to guide the users etc.). What I especially appreciate about the UI Colors Masterclass is that it also talks about hard colors to work with or common mistakes to avoid. One of the most common mistakes I personally see when I mentor beginners is that they overuse colors. Not just in a way of using too many of them, but by not clearly separating what the function or role of a certain color is: is it just decoration, or does it signify that a UI element is interactive? So I really liked that Andrija included this aspect:

Screenshot of the common color mistakes slide

I also love the UI Design Demo Videos Vault, it is a genius idea: have you ever wanted to peek behind a great designer’s shoulder to catch a glimpse of their design process? The Vault contains 10+ hours of videos and Figma files. At the beginning of each UI design demo, Andrija lists out the main design considerations, like in case of a real-time customer support chat, there are going to be many scenarios (e.g. 1. you have never talked to support before; 2. you have an ongoing conversation; 3. no ongoing conversations but there is at least one previous conversation); edge cases; it must cover how users can upload photos done by their phone camera, you should think about how to include emojis and timestamps and so on.

Screenshot from the UI design vault course
UI Design Demo Vault: Real-Time Customer Support Chat UI

Learn UI Design by Erik D. Kennedy

Screenshot of the Learn UI Design course landing page
Learn UI Design by Erik D. Kennedy

I’m originally a designer with a strong focus on the research and the UX design & interaction design part of the design process. Adding UI design & visual design to my skillset has been one of my professional goals since 2017. I attended Erik’s course 7 years ago, and it blew my mind. He made me realize that UI design is not only for the talented ones. There is no magical fairy dust, only rules you can follow (or break if you know them well enough). Erik showed me that there is a logical, engineered way to unlocking UI design skills.

His course will give you a fundamental understanding of the most important design concepts. I personally believe that he is one of the best design teachers of our time. He breaks down complex concepts in a way no one does. He uses analogies that you’ll never forget. As for his design choices, he doesn’t just feel what is right, he can explain why it is right.

Just to give you an example, this analogy fundamentally shaped the way I think about experimenting with my designs: when Erik was learning how to ride a unicycle, an experienced rider told him to alternate falling off in front and falling off behind the unicycle. Erik explained that this works similarly in UI design: you start with something normal or average, then you try to reach one end, like huge, too big type sizes, then you experiment with the smallest possible size. Experimenting with the extremes’ll help you see what is in the middle, what might work well in your specific case.

If you want to check out Erik’s teaching style first, start here:

One of my favorite lessons inside the course is “Gray: the most important color”. Erik’s advice for beginner designers is that make something look as good as possible just by using e.g. alignment, spacing, typography, and then add color. (Of course if you are a seasoned professional, you can add colors right away).

Screenshot of the Gray, the most important color lesson
Gray: the most important color — the most common color, and the only color that doesn’t attract the viewer’s attention to itself

This is what you’ll find inside the course:

  • 36 hours of video lessons
  • exercises
  • cheatsheets & checklists
  • community & feedback from mentors
  • Redesign Vault with ~50 hours of redesign session recordings
Screenshot of the Redesign Vault
There is also a Redesign Vault (you can watch back live redesign sessions), around 50-hour long

✨ Figma Academy 2.0 by Michael Riddering

Screenshot of the Figma Academy landing page
Figma Academy 2.0 by Michael Riddering

If you have read through this article to this point, you can tell that I really admire Vitaly Friedman for systematically collecting 100+ design patterns, Supercharge Design for attempting to cover everything UI design and Erik Kennedy for explaining the fundamentals like no one else can. But here is the thing about Ridd’s Figma Academy. I have never experienced anything this advanced. It’s truly like wizardry, if you complete this course, you’ll become a Figma expert. I completed the course 2 years ago, and purchased it when it was in beta (in August, 2021), and I still come back to it from time to time and revisit some lessons and concepts.

Here is what’s included:

  • 6 modules (watch this curriculum overview)
  • video lessons
  • demo projects and playground
  • recommended resources

Check out this free preview: The ultimate guide to prototyping with variables in Figma (and you’ll find many more free videos on Ridd’s Youtube channel).

Screenshot of the Figma Academy lessons inside Figma
Figma files inside Figma Academy 2.0
Screenshot of a Figma file inside Figma Academy
You can leave comments inside these Figma files and ask questions from Ridd

If you decide to attend Figma Academy, use the code SKETCHINGFORUX to get $100 off.

✨ Level up with Figma by Joey Banks

Screenshot of the Level Up with Figma course page
Level up with Figma by Joey Banks

While Figma Academy by Ridd is for advanced Figma users wanting to become experts, Level Up with Figma by Joey Banks is for complete beginners, too. I’m sure you have heard of Joey, he created the iOS Figma UI kits everyone used for creating iOS screens (now Apple’s design team creates these).

Joey is a great teacher, he has an ability to smoothly share even the most complex concepts by gradually disclosing information, so you never feel overwhelmed. (There is this thing called the curse of knowledge: it means that if you know a lot about a topic, it might be hard for you to explain it to beginners. Joey doesn’t have that, he can really see everything from a beginner designer’s perspective.)

Another huge value of this course is that it is cohort-based, you have a study group and direct access to Joey via weekly sessions.

This is what the course offers:

  • 35 modules (4 weeks)
  • 113 video lessons
  • live sessions
  • community of cohort peers
Screenshot of the Level Up with Figma course timeline
A cohort-based course with weekly live sessions
Screenshot of one of the live calls during the Level Up with Figma course
Joey explaining auto layout to our cohort during a live session

✨ Gorgeous UI Design by Pablo Stanley & his team

Screenshot of the Master Gorgeous UI Design course landing page
Gorgeous UI Design by Pablo Stanley

This is the odd one out: I don’t have personal experience with this course, since it is currently on presale (not yet available), but I’m certain it’s going to be epic. Why? Because Pablo Stanley is one of the best designers and design teachers.

I’ll make sure to update this article as soon as the course material is available. For now, these are some facts about the course:

  • course material that focuses on visual design skills
  • community (Discord)
  • monthly workshops
  • quarterly portfolio feedbacks
  • templates & design resources library

Update (4th of March): the first lessons are now available 🎉

The first section is about some fundamentals: the design process, the tools we should use, how to find inspiration, what the difference between UX, UI and product design is, and so on.

Then, there is a nice detailed exercise about creating a web app. You can follow along with Pablo Stanley as he creates some parts of this design assignment.

The next section (design principles) is coming soon, they are planning to release the course in smaller chunks.

The production quality and the content is awesome, and I also love the great sense of humor that shines through all the videos.

“…design can get messy, iterative, and unpredictable. The “process” is more like a compass than a map; it points the way through the thick creative fog.”
Great humor + quality content = epic course :)
Exercises
You can follow along with Pablo
Discord community

✨ Into UX Design by Bogomolova Anfisa 🍏

Into UX Design by Bogomolova Anfisa 🍏

This course will take you from kicking off a project and conducting UX research all the way to creating UX design concepts (and testing). Naturally, design is not a linear process, Anfisa just uses a linear framework to talk about all the related aspects, e.g.: user interviews, quantitative research, user journey mapping, strategic design, information architecture, responsive design best practices and more. If you are a beginner to the UX field, you won’t find a better starting point.

This is what is included:

  • 35h of videos lessons
  • Case studies
  • Notion-based resource hub
  • UX research and UX design templates
  • PDF’s with all the materials
User journey map — real life example
There are some lessons about sketching, too :)
I especially like the lesson about responsive design best practices (in terms of interaction design patterns)

My own Udemy courses

The following 3 courses are my own creations, all of them cover topics I’m especially passionate about:

  • sketching & visual thinking;
  • development aspects for designers and
  • training your designer eye by using a systematic framework.

✨Sketching for UX Designers

Sketching for UX Designers course on Udemy
Sketching for UX Designers course on Udemy

In this 4.5-hour long course, I teach you how you can boost your design process with sketching: it is about sketching user interfaces, user flows, UI animations and storyboards. It is also a great starting point for other areas of visual thinking, like graphic facilitation or sketchnoting. And you can draw along with me throughout the course :)

Screenshot from my Sketching for UX course
Draw along with me!

Here is a coupon code for my Sketching for UX course.

✨ Be a better designer by understanding development aspects

Be a better designer by understanding development aspects course on Udemy
Be a better designer by understanding development aspects course on Udemy

I created this course as an answer to the infamous question: “Should designers learn to code?”. As I wrote in my article about this topic, I believe that this is not a good question. Here are some better ones:

  • Should designers understand the costs, risks, trade-offs of a design decision?
  • Should designers know how developers work, what challenges they face, what their main tasks are?

My 8.5-hour long course helps you make better design decisions by understanding development fundamentals and technical constraints.

Fun fact: I explain everything in the course using sketchnotes:

Be a better designer by understanding development aspects course on Udemy — course sketchnotes
The result of merging two areas I’m passionate about: visual thinking and understanding development aspects as a designer

Use this coupon code for my Be a better designer by understanding development aspects course.

✨ How to train your designer eye

How to train your designer eye course on Udemy
How to train your designer eye course on Udemy

Developing an eye for design is a topic really close to my heart. It expresses my belief that design is learnable (yes, even visual design), and there are deliberate steps you can take (so it won’t just “happen”).

If you take this course, you’ll learn how to train your designer eye, how to collect, analyze and practice designing user flows, layouts and UI elements: I will show you some effective techniques, my favorite resources, and I’m going to give you many-many practice activities. As a result, you’ll have an approach or framework for training your designer eye on a daily basis.

Throughout my years I’ve noticed that many designers don’t know how to develop their design (UX, UI and visual design) skills effectively.
My suggestion is that you should apply this as a complementary course (e.g. if you are in the process of completing a design bootcamp).

Here is an example for the topics included in the course: doing copywork, and then experimenting with the design. In the course, I copy some Wise screens, then I change a few things, and I also explain the reasons behind my design decisions:

Wise: copywork & experimenting example
Wise: copywork & experimenting example
Little behind the scenes: recording my newest course, How to train your designer eye
Little behind the scenes: recording my newest course, How to train your designer eye

Use this coupon code to get my How to train my designer eye course.

Courses from related fields

These are not UX or UI design courses, but I find them really useful for designers:

✨ Social Psychology by Scott Plous

Social Psychology course screenshot
Social Psychology by Scott Plous

This course was one of my best learning experiences ever. I have always been interested in social psychology, and I believe that understanding why people do what they do is essential for us designers.

“This course offers a brief introduction to classic and contemporary social psychology, covering topics such as decision making, persuasion, group behavior, personal attraction, and factors that promote health and well-being.”

I also appreciated the great amount of recommended resources, books, academic research so that I could dig deeper in the topics I was most interested in.

✨ Pragmatic Sketching Masterclass by Eva-Lotta Lamm

Some images from the Pragmatic Sketching Masterclass
Pragmatic Sketching Masterclass by Eva-Lotta Lamm

As I mentioned, I’m passionate about sketching and visual thinking. I read many visual thinking books, I do live sketchnoting at conferences (e.g. at WebExpo and at Amuse), two of my favorite meetups are the Visual Jam by Paddy Dhanda and Grant Wright and the Visual Thinking Copenhagen by Yuri Malishenko and Susanne Krogh-Hansen. I wrote some articles in this topic (e.g. about live sketchnoting pro tips), and I created 150+ UX Knowledge Base Sketches. So you can say that I have some experience :)

However, Eva-Lotta Lamm’s sketching course was still one of the best investments of my life, I enjoyed every minute of the sessions! Eva-Lotta is originally a UX designer, and she believes that sketching is (just like design) a decision making process. “Good sketches are the results of good decisions that you took with every mark you make: How can I draw this? What is the shape? Where should I place my mark? How big should this part be? Which details would I leave out? Where would I start? How do I get the proportions right? Which thickness of line should I use? Which colour? How do I make it look clearer? How do I emphasise the important part? And so on and so on.” Whether you are a professional visual thinker or a beginner, I highly recommend this course!

This is what’s included in this masterclass:

  • Videos for 9 topics — about 1.5 to 2.5 hours of video lessons
  • 4 live feedback sessions
  • Over 25 hours of total class time
  • Workbook, practice activities
  • Private Facebook Group

💬Do you know about any other design courses I should check out? Please let me know, I might feature it in this article!

--

--

💻 Product Designer 📝 uxknowledgebase.com ✏️️ Sketching for UX course: sketchingforux.com 💙 Fav resources: startheredesigner.com ✨ Mentor at 10X_Designers