[Topic page] Add visual cues to guide learners to their next steps on the topic page.

[juliafalarini]

Platform Oppia Web

Describe the request We are in the final stages of completing the Practice Experience and Topic Page Redesign, and it was suggested providing a subtle prompt or finding a method to facilitate learners in identifying their next focus on the Topic Page.

To achieve this, we need to consider various scenarios for their next steps, including:

• When learners have previously started a lesson and are returning to resume it.
• When learners have completed a lesson and should now commence practicing or studying it.
• When learners have initiated the mastery of a skill and should complete it before progressing to the next lesson.
• When learners have finished mastering a skill and should proceed to the next lesson or skill, especially if a lesson has introduced more than one skill.
• When learners choose to only view the practice cards and when they opt to exclusively view the lesson cards.

Context for the request This request was initiated during a review of the final mocks of the redesigned Topic Page. Consequently, we decided to address this in a separate project. The designer should utilize these mocks as a reference.

DESIGN APPROVAL CHECKLIST -- DO NOT EDIT.

• [ ] UX Design approved (Android mocks should include dark mode)
• [ ] UX Writing approved
• [ ] Design Systems Team approved
• [ ] Product approved

For a design project to be completed, it needs approval from UXD, UXW, DS and PM. Please tag the following reviewers when your project is ready (at least one reviewer for each of the 4 bullet points below):

• UXD: @rflore / @S4v8n (for Web projects)
• UXW: @stepmalt
• Design systems: @qluuu / @celestinetales
• PM: @seanlip

[tamiorendain]

Hi @luoyi99 and @rflore, did a quick UXW review of the research and made some comments. Mostly all suggestions that apply to each of the different versions. Happy to answer any questions or brainstorm wording if needed!