Code for Pakistan

UI Design with Figma

Learn the essentials of User Interface design from wireframing to high-fidelity mockups.

Course Overview

Learn the essentials of User Interface (UI) design, from wireframing to high-fidelity mockups in Figma.

Learning Outcomes

By the end of this course, you will be able to:

  1. Apply principles of good UI design
  2. Create wireframes to map user flows
  3. Use layout grids, color styles, and text styles in Figma
  4. Design reusable components
  5. Create high-fidelity prototypes

Topics Covered

  • The principles of good UI design (2 hours)
  • Creating wireframes to map out user flows (3 hours)
  • Using layout grids, color styles, and text styles in Figma (5 hours)
  • Designing components and creating a high-fidelity prototype (5 hours)