Product Issue: New navigation and information architecture supports improved user experience

[marcellamaki]

Overview

The updated navigation/information architecture combines elements of existing pages and reorganizes them to provide more information "at a glance" and fewer clicks to actions.

Description and outcomes

The new navigation will be updated in coach, and the updated pages will be:

• Class Home
• Lessons
• Quizzes
• Learners
• Groups

For 0.18 release requirements, we are implementing only the "MVP" designs, which are the simplest rearranging/combining of existing components and pages. Further phases of the work that include more comprehensive changes to the layouts/UI or new functionality will be targeted to future releases.

Lessons

Description	Page
When a coach opens the new "lessons page" or the "landing page" for the lessons, they should now have the additions of: the class name, filter lessons by status or recipient/groups, progress status for each lesson
When a coach clicks into a "lesson summary page", they should now have the additions of: class name and date created available on the side panel, "reports" information present for each resource and resources can be reordered (drag and drop) or removed through the main page

Quizzes

Description	Page
When a coach opens the new "quizzes page" or the "landing page" for the quizzes, they should now have the additions of: the class name, filter lessons by status or recipient/groups, progress status for each lesson
When a coach clicks into a "quiz summary page", they should now have the additions of: class name and date created available on the side panel, "report" information present for each learner, and if the quiz has been started the difficult questions tab should be available
When a coach selects the "preview" button, a full screen modal shows them the "learner view" of the quiz

Learners

Description	Page
When viewing the list of learners in a class, a coach can see the class name and filter by recipients (i.e. groups)
A coach now sees a "dashboard" style individual-learner page that puts key information at the top. The "activities" notification stream has been removed, and pagination has been added. A coach can print or download the learner report

Groups

Description	Page
A coach can now see the class name on the groups page, and open a modal to learn more about what groups could be used for
When opening the page for a specific group, coaches can see the class name, and enroll or remove learners, and delete the group

Resources

Relevant Figmas: please see the sub pages under "Navigation" header -- the navigation screen itself is a planning tool for Jessica

Accessibility requirements

This will largely be made up of existing components that ought to have already had their a11y concerns taken into consideration. However, after the pages are updated, accessibility QA should confirm that the proper semantic headers, aria labeling, and tab navigation is present.