Web design & UI/UX: free course
Design websites people love to use: layout, colour, fonts, spacing, buttons, forms, mobile-first design and accessibility, with live examples.
Start lesson 1 Open the interactive course Printable course notes
Lessons
- 1 Principles of good design: hierarchy, contrast, alignment, proximity, repetition, white space and usability
- 2 UX research, user flows and wireframes
- 3 Colour in web design: colour theory, palettes, the 60-30-10 rule, contrast, accessibility, dark mode and CSS variables
- 4 Typography: choosing fonts, pairing, type scales, line length and height, readable text and web font performance
- 5 Spacing, grids and layout: spacing scales, the box model, grids, Flexbox and CSS Grid layouts, and common page patterns
- 6 Choosing images, icons and illustrations
- 7 Buttons, forms and calls to action: button styles and states, form design, validation messages and checkout UX
- 8 Mobile-first and responsive design: why it matters in Kenya, viewport, breakpoints, flexible layouts, images and testing
- 9 Accessible design for everyone: disabilities, WCAG, semantic HTML, keyboard use, screen readers, forms, media and testing
- 10 Anatomy of a landing page that sells: every section explained, copywriting, trust, speed and testing
- 11 Design tools: Figma step by step, frames, auto layout, components, prototypes, handoff and alternatives
- 12 Design systems and reusable components
- 13 Project: design and build your portfolio page, from planning and case studies to publishing and getting clients