...
- Simplified drop-down menus
One problem mentioned by everyone and was evident from the HW2 feedback was the packed drop-down menu under “Teacher”. The final design hides optional features (homework surveys, recitation section management, and student team management). This streamlines the experience for administrators of simpler classes, and focuses on the most important features.
Grading
In the paper prototype phase, we focused on testing the grading interface. We had two iterations. The first one only displays students whose grades have been entered. Whenever a new grade is entered, a new row with a blank name box will appear at the bottom of the page. The second iteration displays all names in a table. Our final design follows the second iteration, since it is more visible..
- Auto-filter name search results
From the paper prototyping, we got the feedback from the TA - "make sure your name searching box does incremental search, which every keystroke of name letters will filter out the name lists." We took the advice, and made the response more instantaneous, and the status of the system more visible.
- Auto-save grades
We decided to make the system auto-save the grades, since it can prevent errors and save time of hitting an extra key for TAs. However, during the second iteration of the paper prototyping, a very common question from users is where to save grades. In our final version, whenever users finish entering a grade (either by hitting tab or clicking somewhere else on the page), a small saving icon would appear behind the grade box for couple seconds. To prevent errors, if users enter something invalid, such as letters, the system would not save the input.
- Switching between problem sets
Many users forgot to switch to the right problem set during the paper prototyping user testing. We tried to solve the problem by giving the button "Switch" a different color, and making the header with assignment or exam name appearing bold and big on the top of the page. During our final user testing, forgetting to switch to the right pset continued to be a problem. We might solve the problem by change the button name to "Switch Pset/Exam" and only highlighting the assignment and exam names in the title.
Forms (including posting a new assignment)
In the heuristic evaluation, we got many feedback about our long forms. People also mentioned that they do not know what some fields are for in the form. In the final design, we simplified our forms, and added placeholder information in many fields as a sample.
Implementation
We decided to build a Web application, so we didn’t have to worry about users installing software, but this exposed our UI to the limitations of CSS. For example, we initially designed the grade entry form as a full-screen sheet that has horizontal and vertical scroll-bars, and the first row and first column are fixed to offer context. CSS made this hard enough that we didn’t have time for it.
...
- User 1:
- Task 1: Immediately got attracted to the home news page. He scrolled down to the bottom of the page, and selected Problem Set 1. He didn’t see the place to post grades. After couple seconds, clicked on Grading. Used Ctrl+F to search for Chad. Forgot to switch to Problem Set 1, but since the maximum grade was less than the point to enter, he soon found out, and switched to Problem Set 1. He used tabs to switch between blanks. He asked about whether there is a submit/save grade button. The facilitator explained that the system does auto-save.
- Task 2: Before Task 2, he tried on his own to type in the textbox, and found the system does filter. Task 2 went very smoothly. He searched the names in the box, and used tabs to switch between blanks.
- Task 3: He first clicked the dropdown menu for switching problem sets on the grading page, then searched under Grading dropdown menu. Quickly he clicked on Homework, and clicked on “+ Homework”. The rest of the task went smoothly except he got confused about Name and Filename, but soon he corrected that.
- User 2:
- Task 1: The user directly found "Post Grades". He forgot to change the problem set number, but later found out. He clicked on the row of the student, and entered the grades.
- Task 2: He didn't notice the name search box; instead he used Ctrl-F to find students. Then he used the tab key to switch between blank fields. After the test, we mentioned to him about the search box, and he said that Ctrl-F could be more efficient in this case.
- Taks 3: He completed the task with no difficulty.
- User 3:
- Task 1: The user was able to complete the task with some difficulties. He went up to teacher, chose the grades spreadsheet, and chose the appropriate parameters, but couldn’t enter the grades. He then noticed the grading menu and completed the task without difficulties from there.
- Task 2: He didn’t have any problems with this. Having seen the page from the previous task, he just started entering the grades, using the return key to advance between fields.
- Task 3: Immediately found the +Homework menu and added the homework without any difficulties.
...