ClassroomIO · Prototype + PRD handoff

Learning Paths

A learning path is an ordered bundle of courses sold and taken as one: courses unlock sequentially (lessons + exercises complete → next course), one bundle price with savings, and an optional path certificate at the end. Built on the real packages/ui tokens. The engineering PRD lives at prd/learning-paths/README.md.

Every page has a theme toggle and cross-links so you can click through each journey end to end.

1 · Public — org landing site (visitor)
Entry
Org Landing Page

Learning Paths section above Courses — mirrors the "minimal" landing theme.

List
Paths Catalog

/paths — search, filters, and path cards with savings pricing (like /courses).

Detail · Coursera-style
Public Path Page

Hero + enroll box with savings, stats, outcomes, skills, course series with lesson outlines, certificate, instructors, testimonials, FAQ.

2 · Learner — LMS (enrolled student)
Entry
LMS Home

Paths above courses, segmented cross-course progress bars.

List
My Learning Paths

In progress / Completed tabs; each row shows segment progress + next course.

Detail
Path Detail

The journey spine — Done / Continue / Locked courses with per-course progress and a certificate end-row.

Inside a course
Course in Path

Lesson view wrapped in path chrome: stepper ribbon + "next course unlocks" callout.

3 · Teacher — admin dashboard
List
Manage Paths

Org-level listing: stats, statuses, Create path → setup checklist.

Onboarding
Set up your path

"Get Started"-style checklist: courses → order → price → landing page → activate.

Tab · Courses
Path Builder

Drag-to-reorder course list + sequential-unlock toggle. Try dragging rows.

Tab · People
Learners

Per-learner path progress, current course, auto-enroll note, add learners.

Tab · Analytics
Path Funnel

Course-by-course funnel, drop-off callouts, stuck lessons/exercises.

Tab · Landing page
Landing Editor

Hero copy, visitor access level, outcomes, skills, instructors, testimonials, FAQ.

Tab · Certificate
Path Certificate

Award toggle, completion requirements, live certificate preview.

Tab · Settings
Path Settings

General, bundle pricing + savings, enrollment & unlock rules, status, danger zone.

Key product decisions baked into these prototypes:
· Learning paths are a new entity (separate from Programs) — learning_path, learning_path_course (ordered), learning_path_member.
· Self-enrollment with bundle pricing from the public site; the price shows savings vs summed course prices.
· A course unlocks when the previous course's lessons AND exercises are complete; sequential unlocking is a per-path toggle.
· Path certificate is a teacher toggle with its own tab; visitor access to the syllabus is teacher-configurable.
· Public pages mirror the "minimal" org-landing theme; app pages mirror packages/ui (shadcn-svelte, Geist, OKLCH tokens).