Skip to content

[ Learn Page ] Track learning progression #7277

@LaurelineP

Description

@LaurelineP

Enter your suggestions in details:

Proposition:

Tracking the user's experience through the learning progression presented in the sidebar ( see attachment )

User Pain Point / Use Case

In a scenario where one wants to follow the proposed learning path, represented as a timeline on the side bar,
then get back later to the learning progression: the user cannot easily identify where they left off.
This is a good candidate for UX improvement/feature.

In the following example, we could imagine that the user has done the path following the order of the progression and is currently at "The V8 JavaScript Engine."
They get back days later to resume where they left the learning path, but:

  • when getting back to the "Learn" page: the active lesson is back to the first lecture "Introduction to Node"
image

Possible Improvements

  • having a way to track the progression through UX:
    • by adding a completion button ( cons: extra button )
    • by assuming if a user hits the button to the next lesson, the lecture should be considered as completed.
  • a way to store the progression: could be localStorage or else according to your preferences.
  • visually provide feedback on completed lectures:
    The progression sidebar div.ProgressionSidebarGroup_items__XXX children links "bullet".
    ( a.ProgressionSidebarItem_item__XXX > svg ) could have there fill value to be green
    ( alike the current behaviour of the current page link having the class a.ProgressionSidebarItem_item__XXX ProgressionSidebarItem_active__XXX)

Within the same scenario and the propositions applied,
This could be visually represented as depicted below:
image

If I can help or if you have questions, feel free to let me know.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions