Skip to main content
UI Coach Logo
Intermediate

Subscribe to a Practical Skills Course

Design a course membership that helps learners evaluate fit, follow a paced curriculum, and understand ongoing billing.

Responsive web2 to 4 hours

The brief

Understand the problem

Background

Subscription courses can offer an expanding library and community access, but learners still need a coherent path and a clear reason to remain subscribed.

User context

Jia wants to learn bread baking over eight weeks. She can practice on weekends and needs to know which tools and ingredients each stage requires before paying.

Product problem

A large lesson catalog can obscure prerequisites, pacing, and total commitment. Billing details may be disconnected from the learner's progress and access.

Objective

Create course evaluation, subscription, weekly learning, and cancellation for a practical skill program.

What to design

Define the experience

Required experience

  • Course fit and prerequisite overview
  • Transparent subscription checkout
  • Paced learning dashboard
  • Cancellation and retained-progress explanation

Screens and states

  • Course overview
  • Subscription review
  • Learning dashboard
  • Lesson detail
  • Membership settings

Core user flow

Follow the critical path

  1. 01

    Jia checks the course outcomes, schedule, and equipment list

  2. 02

    She reviews monthly price, trial terms, and cancellation timing

  3. 03

    She subscribes and sees the first week's preparation

  4. 04

    She completes a lesson and records a practice note

  5. 05

    She reviews what happens to progress if she cancels

Product rules

Requirements and constraints

Requirements

  • Show prerequisites, materials, and expected weekly effort
  • Disclose trial conversion and renewal timing before payment
  • Organize the library around a recommended path while allowing exploration
  • Separate lesson completion from demonstrated skill
  • Explain content and progress access after cancellation

Constraints

  • Learners progress at different rates
  • New lessons may be added during a membership
  • Practical tasks cannot be verified automatically

Reality check

States worth considering

The learner lacks a required tool
Payment fails before the next module
A lesson is revised after completion
The learner cancels during a trial

Finish line

What to deliver

  • Create five responsive screens from course evaluation through paced study and membership control.

Optional direction

Visual resources

Use these as a starting constraint if you want one. They are not part of the required solution.

Font pairing
Josefin SansPlayfair

Josefin Sans & Playfair

Clear interface writing gives people the confidence to understand what changed and decide what to do next.

Icons
Illustrations

Keep practicing

Intermediate
Education

First Month Startup Decision Guide

Design a founder workspace that turns broad startup questions into prioritized next steps, evidence, and expert referrals.

Responsive web2 to 4 hours
Product ThinkingInformation Architecture
Intermediate
Education

Virtual Exam Study Room

Design a shared study space where students preparing for the same exam can plan sessions, exchange materials, and get unstuck together.

Responsive web2 to 4 hours
Interaction DesignInformation Architecture
Intermediate
Education

College Money Plan

Design a practical finance guide that helps a college student build a monthly plan and evaluate legitimate earning options.

Responsive web2 to 4 hours
Data VisualizationContent Design
Intermediate
Education

Company and Invention Timeline

Design an editorial history experience that connects one influential invention with the people and companies that shaped it.

Responsive web2 to 4 hours
Information ArchitectureData Visualization
Advanced
Education

Adaptive Learning Progress Review

Design a progress review that explains why a learning path changed and lets a student and teacher adjust the next goal.

Responsive web2 to 4 hours
Data VisualizationContent Design
Advanced
Education

Instructor-Guided Language Path

Design a language-learning journey that combines self-paced practice with recurring sessions from a real instructor.

Responsive web4 hours plus
Product ThinkingService Design