Live Class 1: Orientation & industry reality
Topic: What UI/UX is | Empathy in design | Graphic design versus UI/UX | Product Designer versus UI Designer versus UX Researcher | Job market landscape, local and global | How AI is reshaping the role | Figma download, install, account creation, Education plan upgrade | Q&A.

Live Class 2: Fundamentals & Figma basics
Topic: UI/UX fundamentals | Honeycomb method | Human Centered Design | The working process of a UI/UX designer | Difference between mobile app, web app, SaaS, website and landing page | Figma interface, frames, layers and basic tools

Live Class 1: Visual design foundations
Topic: Visual elements | Design principles | Visual hierarchy | Alignment, spacing and balance | White space | Consistency | Introduction to layout thinking

Live Class 2: YouTube app clone
Topic: Breaking down an existing product step by step | Rebuilding the YouTube app interface | Introduction to WCAG and accessible design

Assignment: YouTube app clone, full version, plus AI override log.

Live Class 1: All about colour
Topic: Colour theory | Colour process | The 60-30-10 rule | Colour formats: RGB, HEX, HSL, HSB, CSS | Gradients | Colour plugins | Colour meaning and psychology | Contrast ratios and accessibility | Colour blindness | Colour resources

Live Class 2: Typography
Topic: Typography in UI | Type properties | The type system | Type scale | Font pairing | Readability and line height | Typography guidelines | Pairing Bangla and English type for local products

Assignments: colour fix, repairing a broken colour system. Screen redesign applying colour and typography

Live Class 1: Shadow, elevation and iconography
Topic: Shadow theory | How shadow works | Elevation systems | Blur, blend modes and effects | Icon systems and consistency | Basic prototyping

Live Class 2: Critique session 1
Topic: Live review of Week 2 and 3 student work | How to give and receive design feedback | Common beginner mistakes | Building a self-critique checklist

Assignment: elevation and surface study across light and dark mode.

Live Class 1: Basic Components

What components are and why they matter | Creating components | Instances and overrides | Component states

Live Class 2: Advanced Components

Variants | Component properties | Boolean, instance swap and text properties | Nested components | Complex prototyping

Assignment: Messenger app with prototype. Button component system.

Live Class 1: Auto Layout fundamentals
Topic: Introduction to Auto Layout | Padding, gap and alignment | Hug, fill and fixed | Nested Auto Layout | Implementation practice

Live Class 2: Responsive design and grid
Topic: Using Auto Layout for responsive websites | Breakpoints | Common website patterns | Grid systems: columns, gutters and margins | Constraints

Assignments: Auto Layout practice set. Responsive website across three breakpoints.

Live Class 1: Building a design system with component library and variables
Topic: Introduction to design systems | Types of design systems | Atomic Design methodology | Colour styles, text styles and effect styles | Naming conventions

Live Class 2: Publishing and team workflow
Topic: Building atoms, molecules and organisms step by step | Publishing a library | Importing and updating a shared design system | Version control | Working in a team file

Assignments: design system colour and type styles. VPN app built entirely from your own design system.

Live Class 1: Advanced prototyping
Topic: What variables and tokens are | Modes: light and dark, language, density | Scoping and aliasing | Token naming structure

Live Class 2: Handoff
Topic: Advanced prototyping with smart animate, conditionals and variables | Dev Mode | Annotation and specs | What developers actually need from a designer | Handoff checklist | Common handoff failures

Assignments: multi-mode card component built with variables. Full developer handoff file for the VPN app.