Overview
How might we design learning path recommendations so people can trust and act on AI output?
When this pattern fits
- Perfect for complex AI applications, educational platforms, and tools where personalized learning paths improve user mastery and feature adoption.
When to skip or lighten it
- Expert users with certification who want full access day one.
- Paths generated from thin activity data.
- Mandatory gates that block paid features unnecessarily.
States
State model coming soon
Key UX elements
Key UX elements coming soon
Anti-patterns to avoid
Path with twenty steps and no skip.
Recommendations unrelated to stated goal.
No mark complete or resume later.
Resetting progress on UI refresh.
How products use it
| Product | Implementation |
|---|---|
| Figma | Learn paths for auto layout, prototyping, and AI tools. |
| Adobe Creative Cloud | Skill tracks per app with progress sync. |
| Codecademy | Adaptive next lesson from quiz results. |
| Skillshare | Class sequences based on interests. |
Implementation
Copy this prompt to generate a production-ready implementation in Cursor, Claude Code, Lovable, or any AI coding agent.
Generate a production-ready implementation of the "Learning Path Recommendations" AI interface design pattern.
Pattern Definition:Frequently asked questions
Path building blocks?
Short lessons, hands-on tasks, checkpoints, and links into real product UI.
Learning path vs onboarding progress?
Paths recommend curriculum. Progress tracking shows completion meters for any checklist.
Team admins?
Assign paths by role and report completion, not individual prompt content.
Adapt when?
After failed exercise or skipped advanced user diagnostic.