Unveil users’ learning journeys in a completely new way with Dash’s Learning Paths widget. Instead of static course lists, learning paths present courses as an interactive, visual experience — guiding users step by step along a structured and engaging path.

Using customizable SVG designs, administrators can create unique learning journeys where courses are arranged along a path or positioned freely within a visual layout. From simple progress lines to rich, story-driven designs, Learning Paths transforms course navigation into an intuitive and motivating experience.

Flexible course selection

Learning paths can be tailored dynamically to match different learning scenarios and user contexts. Courses can be displayed based on categories, tags, custom fields, assignment tags (requires Timetable Pro), or even in relation to other courses — such as prerequisites or completion requirements.

This allows learning paths to reflect real learning dependencies, individual responsibilities, and contextual learning flows, ensuring that users always see the most relevant next steps.

Creative freedom with precise positioning

Learning Paths offers powerful control over how courses are arranged within a design. Courses can be automatically distributed along a defined vector path or placed within specific zones of the SVG. These zones can be used to structure content visually, highlight important elements, or guide learners through complex journeys.

Customizable course visualization

Courses are represented visually within the learning path and can be styled in multiple ways to improve clarity and engagement. Appearance options include:

• Different sizes ranging from minimal dots to prominent visual elements
• Optional course images, or numbered steps
• Customizable shapes such as circles, triangles, hexagons, diamonds, or stars
• Dynamic visuals and shapes based on course metadata

In addition, course status is clearly communicated through configurable color coding, reflecting states such as availability, enrollment, progress, completion, or failure. This makes it easy for users to understand their current position and next steps at a glance.

Responsive design across all devices

Learning paths can be individually optimized for desktop, tablet, and mobile devices. Different layouts can be defined per viewport, ensuring a seamless and visually consistent experience across all screen sizes.

Fallback behaviors can also be configured, allowing administrators to control how learning paths are displayed when no dedicated layout is defined for a specific device.

Info and progress overview

An optional info area provides users with additional context and progress insights. It can be positioned above the learning path or as a sidebar and can include:

• Key progress indicators such as completed courses or earned badges
• Visual progress representations across the entire path
• Time-related information such as learning periods
• Status indicators showing whether users are on track
• Optional display of instructors or related roles

This helps learners better understand their progress and stay oriented within their learning journey.

Detailed course information and actions

Each course within the learning path can display detailed information in a dedicated area. This includes course images, summaries, and — where applicable — assignment-related details such as start dates, deadlines, priorities, or tags.
Please note: Assignment-related details require Timetable Pro

Clear calls to action like Start, Resume, or Review guide users directly to the next step.

Integrated and reusable design assets

Learning paths are built on reusable SVG assets that can be managed centrally or uploaded directly within Dash. This allows both administrators and non-admin users to work with custom designs and reuse them across different contexts.

A more engaging way to guide learning

With Learning Paths, you don’t just display courses — you create structured, visually engaging learning experiences. By combining flexible data sources, rich visual customization, and intuitive design, the widget helps learners stay motivated, oriented, and on track throughout their journey.