Feature | Requirements |
Account Level Views |
Profile & Account Settings Updates | The goal of this effort is to split the profile page (who I am as a learner, what I’ve done, and eventually what I’m doing) from account settings ( controls, options, etc.) The profile age should represent who I am as a learner and what I’ve done so far. Under consideration for scope in this effort is to see whether it is possible to retrieve and visualize platform certificates in a single view. All account settings details, including account deletion workflow should move into account settings area and be removed from profile. Account settings should be accessible from the main 4 application tabs as an icon in the top right of the page. |
App Level Navigation | As demonstrated by the requirement sections above, the new application navigation will see some updates. The new app level navigation bar Today - Depending on scope this might weave its way into the UX definition of the Learn view as heading / top level context (Cut from Scope)
Learn - New primary Learn page combining product listing views for products in student’s account Discover - Shift discovery to second view, with discovery improvements to be handled in Project - Improved Mobile Discovery (FC-28a) Dates - This is a level up of the course dates and schedule feature to present students with planning / visual tracking tools for upcoming dates + targets. Downloads - Quick access to offline learning materials for students to access materials on the go. Activity - Depending on project scope this will be the Profile page or what we hope may replace it as an activity focused view (with a way to get to your public profile.) This view is focused on you - what you have done / are doing.
|
Dashboard Level Views |
New Learn Page: Configurable Products + Listing / Next Step Modes | New Learn Page replaces existing Courses page Learn page can have product configured as top level toggles, with Courses being the default experience. Product views (Courses / Programs / etc) can be linked to native components or webviews. Option 1: Programs product type linked to a placeholder page url (terms of service, or other existing view) to demonstrate web view configuration of products page primarily. Full programs experience split into future project.
Option 2: Programs experience v1 linking to edx-platorm programs view could instead be delivered as part of this effort.
The ability to link webviews was added for Programs, so we should move that functionality into the Learn page (when Programs page is selected). Similar web view configurations also should be possible for course view if desired.
Courses view will be natively built into the application, with existing cards put into the “listing” mode of this view. The new ‘next step’ mode for the Courses page will introduce a three new course cards into the mobile application. Card 0 - Full Card - Shown in ‘next step’ mode when learner is enrolled only in 1 course product object.
Card 1 - Primary Card - Shown in ‘next step’ mode when learner is enrolled in 1+ courses. Card 2 - Basic Cards - Shown under primary card when learner is enrolled in 1+ courses. Card 3 - Progress Cards - Shown in (all) My Courses view
Design mocks added further down this page. |
New Downloads Page | Initial v1 of an app-level downloads page which summarizes the ability to download course content and provides quick access to downloads. Initial iteration may simply allow this tab to be configured, but it will be defaulted off until the Offline Mode project gets us to a v1 of this page.
|
New Dates / Plan Page | Initial v1 of app-level plan page for now echoing the dates feature of the courses experience. For now, this page will be shown as a “coming soon to this application” page. Timing / alignment between this and the course dates + personalization project (Project - Mobile Dates & Calendar Personalization could change the plan for this view v1.
|
Course Home |
Resume Course CTA Updates | Visual updates / cleanup to the resume learning call to action |
Course Listing Item Blocks | Augmenting the section + sequence course home navigation to support collapsible sections (including auto-collapsed completed sections) New {N completed sections} expandable object for whenever there are more than 1 completed section next to each other in the outline to help collapse the outline height / length based on progress
|
Full Bleed Course Imagery | Visual updates / cleanup to course home imagery / color background for a course |
Course Title & Progress Summary | Exploring the use of a simplified assignment level progress summary under the course title: Example statements: 15 learning sequences across 5 sections 13 learning sequences to complete across 2 sections 12/15 learning sequences completed 10/15 assignments completed
Potential addition of a simplified progress visual underneath this title + statement as well |
Course Content Page |
… | Sequence Navigation |
… |
Sequence Navigation |
Headers and Naming | We plan to use the name of a sequence in the header, with Unit page titles within the content area. Unit Page header names will have a subtitle with page points available (if applicable) and possibly a label for whether the content is graded or ungraded. |
Sequence Icons | We plan to have selectable icons for each unit, echoing current platform behavior and surfacing opportunities for progress visualization on the content mobile views. |
Bulk Downloading | We will be reviewing how we convey partial or complete download status, along with a possible bulk download action at the Sequence level shown in the header. |
Video Blocks | We need a visual shift to these blocks, highlighting (if available) 3 lines or so of the interactive transcript with a way to expand this so that scrolling past the transcript is easier for unit pages with content blocks underneath a video block. |
Next / Previous Buttons | We plan to show next and previous buttons at the end of the content frame, making the need for scrolling more obvious. |
Finish Step / Modal | We are exploring this modal progress shifting to an in-page conditional message shown when you navigate to a future section, instead of being an interruptive message / modal. |