Student Quiz Review

Overview

The Student Quiz Review allows the student user to view their answer choices to the quiz, discover correct answers, learn more through the explanation prompts, and communicate with their teacher.

User Story

As a student, I want to be able to complete quizzes, review my answers, and communicate with my teacher, so that I can understand the material better and know what to focus on for future learning.

Figma

https://www.figma.com/file/2P8kwFEVvVNOVzG4D2E5Sj/Student-UI?type=design&node-id=174%3A14972&mode=design&t=13I9z6yeIl7fXw9p-1

Epic

Epic 193777: Student Center

UI Description

  • Activity Complete Screen:

    • Displays a graphic image that represents success.

    • Header: Activity Complete!

    • Displays the total number of correct quiz answers: You got # answers correct.

    • Conditional navigation buttons based on the presence of a review.

  • Review Correct Question Screen:

    • Question cards with "Correct" tag indicator.

    • Correct answers highlighted in green.

    • Images included with questions when applicable.

    • Explanation section below the question and answers (if applicable)

    • Discussion panel for typing and sending messages to teachers.

    • A volume icon for text-to-speech functionality accompanies each question https://rethinkautism.atlassian.net/l/cp/ug3j6X0T

  • Review Incorrect Question Screen:

    • Question cards with "Incorrect" tag indicator.

    • Correct answers highlighted in green.

    • Incorrect student responses highlighted in orange-yellow.

    • Images included with questions when applicable.

    • Explanation section below the question and answers (if applicable)

    • Discussion panel for typing and sending messages to teachers.

    • A volume icon for text-to-speech functionality accompanies each question https://rethinkautism.atlassian.net/l/cp/ug3j6X0T

  • Review Correct Multiple Select Question Screen:

    • Question cards with "Correct" tag indicator.

    • Correct answers highlighted in green with checkmark in response selected.

    • Images included with questions when applicable.

    • Explanation section below the question and answers (if applicable)

    • Discussion panel for typing and sending messages to teachers.

    • A volume icon for text-to-speech functionality accompanies each question https://rethinkautism.atlassian.net/l/cp/ug3j6X0T

  • Review Incorrect Multiple Select Question Screen:

    • Question cards with "Incorrect" tag indicator.

    • Correct answers highlighted in green.

      • If the student selected the correct answer, the checkmark on the response is selected.

      • If the student did not select the correct answer, the checkmark on the response is deselected.

    • Incorrect student responses highlighted in orange-yellow.

    • Images included with questions when applicable.

    • Explanation section below the question and answers (if applicable)

    • Discussion panel for typing and sending messages to teachers.

    • A volume icon for text-to-speech functionality accompanies each question https://rethinkautism.atlassian.net/l/cp/ug3j6X0T

  • Review Complete Screen:

    • Displays an animation that represents success.

    • Header: Review Complete!

    • ‘Back’ button returns user to the quiz review to continue the review.

    • ‘Close’ button navigates user to the Student Center Assignments page in the To-Do tab.

    • Discussion panel for typing and sending messages to teachers.

User Interaction and Validation Notes

  • Quiz Completion:

    • Validate that the correct quiz score is displayed on the "Activity Complete" screen.

    • Ensure navigation buttons reflect the state of the review and assignment sequence.

  • Review Interaction:

    • Test that correct/incorrect labels and highlight colors appear as intended.

    • Confirm that explanations are only visible when provided and settings permit.

    • Check that messages typed into the discussion panel can be sent and notify the teacher's inbox.

  • Text to Speech:

    • The text to speech (volume) icon displays in the top right corner of the quiz review cards.

    • User selects icon to have the question prompt, correct response items, and explanation (if included) read aloud through the device's speakers or headphones.

    • All existing functionality for Text to Speech implemented with the SEL Self-Assessment will be utilized for the SEL quizzes (SEL, Wellness, Life Skills and Wellness) and Mental Health Quizzes. https://rethinkautism.atlassian.net/l/cp/ug3j6X0T

  • Workflow Transitions:

    • Upon completion, the ‘Ready to Submit?’ screen will have ‘Back’ button and ‘Submit’ button.

      • ‘Back’ button allows the user to view the quiz questions and change their responses before submitting the quiz.

      • ‘Submit’ button submits the assignment to the Educator and the ‘Activity Complete’ screen displays to the user.

    • Upon submitting the assignment, if a review is present, the Activity Complete screen will display the discussion panel, ‘Skip Review button, and ‘Start Review’ button.

      • Skip Review button closes the activity and navigates user to the Assignment page of the Student Center

      • ‘Start Review' button displays the post-quiz review that displays the correct/incorrect answers, student responses, and explanations (if included). The Discussion panel for typing and sending messages to teachers displays.

    • Confirm that "Review Complete" screen appears after review with correct navigation option.

      • ‘Back’ button to return to the quiz review

      • “Close” button appears on the Review Complete screen.

        • The "Close" button appears to close the review and returns the user to the assignment page.

      • Discussion panel displays for student to communicate with educator.

    • Upon submitting the assignment if no review is present, ‘Activity Complete’ screen with the 'Close' button and discussion panel should be clearly displayed and, when clicked, take the student back to the assignments page.

      • The student should be able to open the assignment in the ‘Done’ Assignments tab to view their questions with their submitted responses. This view will not display the quiz review with the incorrect/correct labels and responses. The discussion panel displays for the student to communicate with the educator.

Workflow Description

  1. Completing the Activity:

    • The student finishes the quiz and is presented with the "Activity Complete" screen, showing the quiz score and navigation options.

  2. Reviewing Answers:

    • If the student chooses to review, each question card indicates correctness and highlights answers.

    • The student can read explanations where available and interact with the teacher via the discussion panel.

  3. Review Completion:

    • After the review, the "Review Complete" screen offers navigation option: close the review.

  4. Communicating with Teacher:

    • The student uses the discussion panel to ask questions or provide comments, triggering a notification in the teacher's inbox.

  5. Navigating Post-Review:

    • The student either closes the review and returns to the To-Do Assignments tab in the Student Center.