CSC/ECE 517 Fall 2024 - E2469. Reimplement grades/view team

Background

Expertiza is an open-source learning management system developed with Ruby on Rails, facilitating assignment creation, team management, and a structured peer review process. Designed for educational settings, Expertiza offers instructors tools to assign topics, manage teams, and allow students to collaborate on various assignment formats, including URLs and wiki pages. Its peer review functionality encourages students to provide feedback, promoting a collaborative learning experience.

Problem Statement

This project focuses on reimplementing the grades/view_team page in Expertiza. The current interface lacks modern design aesthetics and usability standards making it challenging for users to access and understand grading data efficiently. Our objective is to develop a fully functional and visually cohesive front end for the Grades View page. By enhancing visual consistency, simplifying information display, improving responsiveness, giving users freedom to select views, and intuitive layout, this redesign aims to provide an improved user experience.

Reimplementation and Improvements

1. Enhanced review filtering and author

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale The "Show Reviews" and "Show Author Feedback" link displays all the peer reviews from Round 1 and Round 2 and author's feedback from both rounds in a single view. This forces the users to scroll all the rounds' reviews and feedback sequentially which can be overwhelming when users wish to view feedback from a specific round. Also, users don't have the freedom and control to choose to view all rounds' reviews/feedbacks or specific rounds' reviews/feedbacks. Additionally, a single view adds visual clutter and increases cognitive load.

With the 2 dropdowns users have more control over which reviews they would like to view. The first dropdown lets them choose from viewing reviews or author's feedback for the reviews provided, while the second dropdown allows them to select specific rounds (Round 1, Round 2, or both). This gives users the flexibility to focus on specific rounds as needed. Separating the reviews/author feedback based on a round filter reduces clutter, creating a cleaner, more organized layout. Users can now view reviews and feedback in a more structured way, which simplifies navigation and enhances readability and improves satisfaction.

2. Replaced the disorganized display of scores for submitted work, author feedback, and teammate reviews with a Structured Scorecard table for clearer presentation.

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale The previous display of scores for submitted work, author feedback, and teammate reviews was fragmented and lacked clarity, making it difficult for users to interpret performance metrics at a glance. By introducing a structured scorecard table, we present all relevant data in a clear, organized format, enabling users to easily compare and understand scores across different rounds. This redesign improves usability by offering a more intuitive layout and better visibility of grading information.

3. Removed the names of reviewers as they are supposed to remain anonymous.

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale The reason for this change is to shift focus more on quality and content of feedback and reviews rather than identity of reviewers. Anonymity encourages the reviewers to provide constructive criticism as reviewers will review without concern for any issues or repercussions.

4. Removed information that didn’t add value

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale Contributor Name: The displayed contributor name only indicated the team member who submitted the work, which could cause confusion, as all team members contribute to the assignment. Additionally, team members' names are already displayed at the top of the page, making this information redundant. Removing it reduces visual clutter, focusing the user's attention on relevant grading information. Score Range: The score range provided minimal value in understanding the overall grade, as the average score alone conveys a clearer summary of performance. By removing the range, the layout is simplified, helping users to focus on meaningful metrics without unnecessary data.

5. Styling of Review Table

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale

6. Fixed styling Toggle Question List

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale The "Toggle Question List" styling was refined for better alignment and readability, enhancing the clarity of the page’s interactive elements.

7. Unified Review Rounds Button and Interface Styling Update

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale Addition of “All Rounds’’ Button: The new "All Rounds" button allows users to view reviews from multiple rounds in a single table. This eliminates the need to switch between individual rounds, giving users a comprehensive view of the feedback across all rounds at once. Color and Style Consistency: The colors and styles of the buttons were updated to match Expertiza’s established color scheme, ensuring a cohesive and professional look across the platform. This consistency aids in navigation, making the interface feel more intuitive and visually appealing.

8. Expanded Submission Links Display

a. Existing Design

b. Modified Design

c.[Design pattern/solid/dry][TODO]
d.[Code Snippet][TODO]
e.Rationale The change enhances usability by directly presenting all relevant submission links to users without requiring additional interaction to show or hide them. This expanded view allows for quicker access to project resources and a more streamlined experience, improving efficiency and clarity in the peer review process on the grades/view_team page.