← All courses
Beginner friendly16 weeks55 lessons11 assignments
Watch a free lesson

UI/UX Design

Learn to design apps and websites people can actually use, starting from zero. Find the real problem through research, design it in Figma, organise it, write it, make it accessible and test it with real people — then hand it to developers and turn it into a portfolio case study that gets you hired.

Instructor: Alex Olam

Course content

Module 1

What design actually is

  • 1.1UX, UI, and why confusing them costs you▶ Watch free preview
  • 1.2Read a screen like a designer: hierarchy and flow
  • 1.3The design process, from problem to shipped product
  • 1.4Who you're designing for: phones, data and people in Nigeria
  • 1.5Sketch on paper before you touch a tool
  • Read a Real Product Like a DesignerAssignment

Module 2

Research: finding the real problem

  • 2.1Assumptions are not research: know what you actually know▶ Watch free preview
  • 2.2Plan a research round you can finish in a week
  • 2.3Interview people without leading them
  • 2.4Observe real behaviour and review what already exists
  • 2.5Turn notes into insights and a problem statement
  • Research Round: From Assumptions to a Problem Worth SolvingAssignment

Module 3

Figma you'll actually use

  • 3.1Set up Figma and draw your first screen▶ Watch free preview
  • 3.2Frames, groups and why the difference matters
  • 3.3Auto layout: spacing that survives content changes
  • 3.4Components and variants: design it once, reuse it everywhere
  • 3.5Prototyping: make it clickable
  • Build a Working Prototype From Your ResearchAssignment

Module 4

Information architecture

  • 4.1Information architecture: why some apps feel obvious▶ Watch free preview
  • 4.2Card sorting: let people organise the content
  • 4.3Navigation patterns and when each one fails
  • 4.4Label things the way your users talk
  • 4.5User flows: map every path, including the unhappy ones
  • Organise a Real Service: Structure, Navigation and a Complete FlowAssignment

Module 5

Designing for real screens

  • 5.1Design for the phone people actually own▶ Watch free preview
  • 5.2Thumb zones and touch targets: where buttons belong
  • 5.3Forms people can actually finish
  • 5.4Responsive thinking: one design, many screen sizes
  • 5.5Slow connections and what they do to your design
  • Real Phones, Real Conditions: One Flow That Survives ThemAssignment

Module 6

Colour, type and hierarchy

  • 6.1Spacing and the 8-point grid, used properly▶ Watch free preview
  • 6.2A type scale you can defend
  • 6.3Pick a palette that survives contact with real content
  • 6.4Contrast and accessibility: the rules that matter
  • 6.5Styles and variables: name your decisions
  • A Visual System You Can Defend: Spacing, Type, Colour and TokensAssignment

Module 7

Words are interface: UX writing

  • 7.1Why the words decide whether people finish▶ Watch free preview
  • 7.2Buttons and labels that say what happens
  • 7.3Error messages that help people recover
  • 7.4Empty states and onboarding that teach without lecturing
  • 7.5Plain language for every reader
  • Rewrite a Real Product: Words People Understand the First TimeAssignment

Module 8

Interaction, states and motion

  • 8.1Every screen has more than one state▶ Watch free preview
  • 8.2Feedback: show people something happened
  • 8.3Loading, offline and trying again
  • 8.4Motion that explains, not decorates
  • 8.5Destructive actions, confirmation and undo
  • Design Everything That Can Happen: States, Feedback, Offline and UndoAssignment

Module 9

Testing with real people

  • 9.1Why five users find most of the problems▶ Watch free preview
  • 9.2Write a task that doesn't lead the witness
  • 9.3Watching without helping
  • 9.4Turning what you saw into what you'll change
  • 9.5Presenting findings without blaming anyone
  • Two Rounds of Usability Testing: Find It, Fix It, Prove ItAssignment

Module 10

Systems, handoff and working with developers

  • 10.1Design systems: why teams stop redrawing buttons▶ Watch free preview
  • 10.2What a designer hands to a developer
  • 10.3Annotate accessibility so it gets built
  • 10.4Share and hand off in Figma
  • 10.5Working with developers: reviews, compromises and quality checks
  • Ready to Build: A Handoff Package a Developer Could Ship FromAssignment

Module 11

Capstone: portfolio case study and getting hired

  • 11.1Choose a problem worth designing for▶ Watch free preview
  • 11.2Run the whole process on your capstone
  • 11.3Write the case study story
  • 11.4Build your portfolio and present your work
  • 11.5Get paid: freelancing, clients and your first design job
  • Capstone: A Real Problem, Solved With Evidence, Told as a Case StudyAssignment

🔒 Assignments open once you've finished the lessons and quizzes in their module. They're marked by an instructor and count towards your certificate.