Product UI/UX Design
Level up to professional product design. Master complex design systems with design tokens, responsive web & mobile UI states, micro-interactions, accessibility (WCAG), developer handoff, and building in-depth UX case studies for your design portfolio.
Prerequisite: Recommended Prerequisite
🟡 Recommended Prerequisite — UI/UX Design Essentials or basic Figma skills.
Core Areas Covered
Practical Capstone Project
A complete product design case study from research to developer handoff.
What You'll Master
Build and maintain a scalable design system with Figma variables and tokens
Design multi-breakpoint responsive dashboards with realistic data states
Prepare clear developer specifications and publish an end-to-end case study
Per-Hour Syllabus & Course Curriculum
Instructional Pacing
18 Hours Recommended (12 hrs minimum accelerated)
Flexible teaching units with hands-on labs and tangible milestones
Problem framing, goals, success metrics.
Frame the capstone product's problem statement and success metric.
Frame a product problem clearly with a measurable goal.
Planning research specific to the product.
Design a research plan (who, what, how) for the product.
Plan targeted product research.
Conducting and synthesizing research findings.
Run/simulate the research and synthesize key findings.
Turn raw research into actionable findings.
Structuring content/features logically.
Group the product's features/content into logical categories.
Structure a product's content/features logically.
Sitemaps, navigation models.
Build a sitemap and navigation model for the product.
Design a sitemap and navigation structure.
Mapping key flows for the product.
Map the product's 1–2 core user flows.
Map core flows for a real product.
Foundations — colour, type, spacing tokens.
Define the product's foundational design tokens.
Define a basic design system foundation.
Component library basics.
Build a small component library for the product.
Build reusable components as part of a design system.
Designing for multiple breakpoints.
Design one key screen at desktop and mobile sizes.
Design a responsive version of a screen.
Adapting components across screen sizes.
Adapt the component library across breakpoints.
Adapt a component system responsively.
Applying visual design to key screens.
Design high-fidelity versions of 1–2 key screens.
Produce high-fidelity UI for key screens.
Polishing remaining screens for consistency.
Finish high-fidelity design for remaining screens.
Maintain visual consistency across a full screen set.
Building interactions/transitions between screens.
Add interactions/transitions to the prototype.
Build interactive transitions in a prototype.
Testing the full prototype flow end-to-end.
Walk through the entire flow and note gaps.
Validate a complete interactive prototype flow.
Running tests, gathering and prioritizing feedback.
Run a usability test session and prioritize the feedback.
Run and prioritize findings from a usability test.
Refining the design based on test feedback.
Implement the top-priority design changes.
Iterate a design based on real feedback.
Specs, redlines, handoff documentation.
Prepare a handoff document/spec for developers.
Prepare a design for developer handoff.
Writing up the project as a case study.
Write the case study and present the finished project.
Independently document and present a complete product design case study.
Flexible Course Pacing & Extension Guidelines
⏱ Extend if: Learner is designing a genuinely multi-flow product (not a single core flow) — add 3–4 hrs, new total 21–22 hrs.
Hour blocks are modular teaching units. Sessions can be merged into 90–120 min deep-dives or split into shorter focused sessions for younger learners while preserving every learning outcome.
Equipment & Prerequisites
Proficiency in basic Figma interface and wireframing
Computer with Figma app
Target Price (Upon Launch)
₦7,500/hr
$5.66 USD/hr international
Applications Open Soon
This course curriculum is in final review. Join our priority notification waitlist to be notified first when registration begins.