Overview
The Video player is accessible within the RethinkEd Student Center for assigned videos. The assignment modal will feature a centered video player with a control bar for an interactive learning experience. The accompanying sidebar provides navigational functionality.
User Story
As a student, I want to engage with video content that is easy to control and navigate, so that I can absorb information at my own pace, review important segments, and provide feedback upon completion.
Figma
Epic
Epic 193777: Student Center
UI Description
Sidebar Layout:
The sidebar includes a back navigation link, a lesson title with a long title option, and a button to Collapse Sidebar.
A collapse functionality to minimize the sidebar and provide more space for the video player.
A back navigation button ("Back") to return to the assignments page.
Video Experience
A responsive video player centered on the interface.
Player controls: play/pause button, volume control, mute toggle, closed caption, full screen
Post Video Engagement
Post-video engagement options prompting the student to:
“Rewatch” button to rewatch the video with discussion panel
“Close” to close the modal and return to Assignments page in Student Center
“Next Assignment” button if there are more assignments assigned to the student
User Interaction and Validation Notes
Video Playback:
Controls should be intuitive, with tooltip text on hover for clarity.
Video progress should be saved if the student navigates away or pauses.
Sidebar Functionality:
The "Back" button should have a confirmation prompt to prevent accidental navigation away from the video.
The collapse feature should allow for an immersive full-screen experience without page refresh.
Post-Video Engagement:
Upon video completion, clear prompts for "Rewatch", “Close” or "Next Assignment" should appear.
"Rewatch Video" should restart the video seamlessly without refreshing the page and include a discussion panel on the right side of the screen to communicate with the teacher.
“Close” button appears when the student does not have another assigned assignment and it closes the modal and returns user to Assignments page in Student Center
“Next Assignment” button appears if there are more assignments assigned to the student and navigates the student to the next assigned assignment in the list.
Validation:
Ensure player controls function across different browsers and devices.
Check that all user decisions and progress are accurately reported to the system for tracking and teacher notification.
Workflow Description
Video Engagement:
The student accesses the video assignment from the Student Center and begins the video and navigational tools available.
Interaction with Video Content:
If the student selects the "Back" button, they are prompted to confirm their decision to prevent accidental loss of progress.
Post-Video Actions:
Upon completing the video, the student chooses to rewatch, which restarts the video without refresh, selects Close which notifies their teacher, or selects Next Assignment which notifies their teacher of the video assignment completion and also navigates the student to the next assignment.
If rewatching the video, the student is transitioned to a screen with the video on one side and a discussion panel on the other.
Continued Engagement or Completion:
If the student chooses to engage in discussion, their interaction is saved and made accessible to the teacher.
If the student exits after completion, their progress is saved and reported to the teacher for follow-up.