Product Design

• 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

• 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

• 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

Design one small product, laying the foundation Module 2 will rebuild on — not from scratch

• Problem statement
• User flow
• Sitemap
• Wireframes

• Double diamond: divergent vs convergent thinking
• Qualitative vs quantitative, primary vs secondary — when each earns its cost
• Choosing a method: interviews, surveys, contextual inquiry, desk research, competitor analysis
• Writing research objectives and a non-leading interview guide

• Affinity mapping and pattern-finding across interview notes
• Personas grounded in evidence, not stereotypes
• Empathy maps and journey maps — where the real pain points sit
• Problem statements and "How Might We" reframing

• Reworking the Module 1 information architecture and flows against real research
• Interaction design basics: affordances, feedback, error prevention
• Handling edge cases and reducing cognitive load
• Writing usability test objectives and scenarios

Take a completely different problem where you must actually conduct research

• Research report (interviews + competitor analysis)
• Persona
• Journey map
• Revised problem statement

• Design system vs. UI kit — and why one-off screens don't scale
• Atomic design and component architecture
• Design tokens: color, type, spacing, radius, elevation
• Primitive vs semantic variables

• Why documentation is part of the design, not an appendix
• Component usage guidelines and naming conventions
• Structuring a Figma file for someone else to open cold
• Where AI genuinely helps: synthesis, ideation, UX writing, exploration, critique — and where it doesn't

• Responsive design across mobile, tablet, desktop
• Breakpoints, constraints, fluid layouts
• Accessibility beyond contrast: touch targets, keyboard nav, screen readers
• Auditing your own file for visual and component consistency

Another distinct product, intentionally chosen to demonstrate professional UI/product design

• Complete design system with Figma variables (including light/dark mode)
• Responsive screens (mobile/tablet/desktop)
• High-fidelity interactive prototype
• Component documentation