Our Solutions Contact Us

1 of 3

Design Your First Product: Learn UI/UX & Figma

Part of Product Design Programme

Module 1

Module 2

Design Systems: Shipping Scalable Products

Module 3

Design Like a Pro with AI

Duration

2 Weeks (12+ Hours)

Classes

3 per week (2 Hours each)

Mode

Hybrid (Online & Onsite)

Certificate

Certificate of Completion

About This Module

This module introduces you to design your first product: learn ui/ux & figma and teaches you the essential skills needed to work confidently on real-world projects.

You'll build confidence with practical exercises, guided instruction, and a strong foundation before moving to the next module.

Curriculum Overview

Explore what you'll learn in this module.

1Foundations & the Design Mindset8 Lessons

UX vs UI vs Product Design, and how they hand off to each other
The product design lifecycle: Discover → Define → Ideate → Design → Test → Ship
Where a designer sits between PM and engineering — and what "done" means at each stage
Workspace, frames, layers, shapes, text — set up to not fight the tool later
Alignment, constraints, and grids (the habits that prevent messy files)
File and project structure: pages, naming, version discipline
A practical audit framework: who is this for, what's the core task, where does it break
Spotting usability problems vs. taste problems

2Visual Design & UI Fundamentals9 Lessons

Visual hierarchy, contrast, proximity, balance
Grid, spacing, and white space
Responsive layout basics — how one design adapts across screen sizes
Type pairing, scale, and readability
Color theory and building a palette that isn't random
Accessible contrast — WCAG basics, checked as a habit, not an afterthought
Components and styles (intro)
Auto Layout — the single highest-leverage Figma skill
Icons, images, and a practical plugin workflow

3From Idea to First Prototype9 Lessons

Target user and the problem in one sentence
User flows — happy path and one alternate path
Information architecture: navigation and a basic sitemap
Low-fidelity vs high-fidelity, and why skipping low-fi costs time later
Wireframing key screens in Figma
The states beginners forget: empty, loading, error, success
Turning wireframes into real UI using component habits
A small reusable component set for the whole product
Wiring it into a clickable prototype

4Ship Your First Product6 Lessons

Problem statement
User flow
Sitemap
Wireframes
UI screens
Clickable prototype

Some of our students work at

Other Modules in This Programme

Module 2

Design Systems: Shipping Scalable Products

Continue building your skills with the next part of this programme.

View Module

Module 3

Design Like a Pro with AI

Continue building your skills with the next part of this programme.

View Module

Full Programme

Product Design Programme

Unlock all modules and complete the full learning journey.

View Full Programme

Ready to start your journey?

Join thousands of learners building in-demand tech skills.

Enroll Now