[UXD/UXW] Figure out the desired information architecture for the topic page.

[seanlip]

Platform
Oppia Web | Oppia Android

Describe the request
Recently, UXW approved the following terminology for the topic page tabs and the revision cards (see #60):

• The revision cards are called "study guides", where learners review "skills".
• The tabs on the topic page should be called "Learn / Practice / Study".

This reconceptualization of revision cards as study guides ties in to a broader discussion about the information architecture of the topic page. We currently have three tabs on that page (Learn/Practice/Revision) but UXR has shown that learners start with the Learn tab and stay there, generally not exploring the other two tabs. This suggests that the current information architecture for the page is not effective. There are some other approaches that could be considered for the information architecture:

• Finalize the design of the Topic Page #107 explores a design where all the three tabs are combined into a single page.
• We could have two sections -- "Learn" and "Study", where "Study" combines practice + revision (perhaps with two sections: "Study Guides" and "Test Your Skills / Practice". Here, the study guides would serve as an opinionated organization / breakdown / summarization or concepts, to help learners build a mental framework that brings everything together.
• It's also possible that students may see study guides as an alternative, non-story-based way to learn the material (in cases where they've learned some of it before, or want to learn the material more efficiently -- stories provide a lot of good motivation and context about how the skills apply to the students' daily lives, but take more time). In that case, perhaps "Learn/Study" fall in a similar bucket, and Practice is a different tab.

There may be other approaches. We might want to consider the following audience personas and evaluate how well different user flows serve each of them, so that we can make a decision based on the tradeoffs:

• Learners who have learned a topic before, but haven't mastered all of it fully (the gaps here may be very significant)
• Learners preparing for an exam on the material
• Learners learning a topic for the first time
• Older learners (teenagers/adults) who need to learn the material

This may also have implications for what to display on the learner's home page (learner dashboard).

UXR success criteria

• The learner should, ideally, find it easy to understand "where do I start, where am I at, when am I done".
• The information architecture should be easy to use by the audiences above (who are listed in descending priority order based on likelihood of use).

DESIGN APPROVAL CHECKLIST -- DO NOT EDIT.

• UX Design approved (Android mocks should include dark mode)
• UX Writing approved
• Product approved

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

• UXD: @rflore / @S4v8n (for Web projects), @seanlip (for Android projects)
• UXW: @tamiorendain
• PM: @seanlip

[seanlip]

@S4v8n @rflore @tamiorendain Note -- I have filed this under "Web" but really it is all-encompassing and should be a collaboration between UXD/UXW.