...
Back End
*paste here*
Evaluation
We decided to test with users from different courses and years (in order to obtain a fairly representative range of user experiences) and with somewhat varied computer experience. Our users were:Alpha: civil engineering junior with language concentration; often uses desktop applications for data entry as opposed to web toolsBeta: physics senior with music concentration; frequently uses google docs and web tools; has some programming knowledgeGamma: political science sophomore; generally does not use web toolsAll users had previously used the student subject listing for preregistration. Only Alpha had previously used the Course Picker tool. Everyone was given the same briefing, as described above, and no preliminary demonstration was given.BriefingManCourses is a website for MIT students to select their classes. This system is an improvement over the current MIT course management system because users have:# Integrated course evaluations,# A list of courses they have taken in the past, and# A list of required classes which need to be taken in order to graduate.You are an MIT student who is using the website for the first time. Please following the following scenario:Tasks (Scenario)# View your current registration and remove one of the classes.# Add a required class to your current course registration.# View information about a previously taken class (6.01).# View information regarding 6.005 (Elements of Software Construction) by using the “search” functionality.
Usability Problems
real-world convention / visibility (minor)
Problem: At the beginning of usage, Alpha attempted to click on the shaded table cell surrounding the "Required Classes" button, instead of the button itself.
p1
Solution: It might be preferable to make the entire partitioned area clickable. Alternatively, in keeping with our original concept of the top partitions as physical folder tabs, we could have clickable images of folder tabs.
aesthetic (cosmetic)
Problem: Beta stated that the overall feel of the website was amateur, and that changing fonts and layouts might help it look more professional. Beta also criticized the green and red color scheme.
Solution: We could spend more time improving superficial UI elements such as fonts, color schemes, layout flow, etc.
recognition / visibility (minor)
Problem: All three users wished that classes in each course could be browsed. Beta attempted to do a wildcard search (“21M.3*”), but that feature was not implemented.
Solution: Simply set the default "Browse" content area to contain a list of majors, each item linking to the search results for all courses in that major. Additionally, implement wildcard and conditional searches.
visibility (minor)
Problem: Alpha and Gamma did not realize for some time that the calendar icon opened a calendar with the current registration. (It turned out later that neither of them use online planners such as Google Calendar.)
Solution: Make the icon larger or more obvious, and add a bevel, border, or other design element implying its clickability.
efficiency (minor)
Problem: All users appeared to grow frustrated with having to click so often to expand course information.
Solution: Have more information than just the course title available in the unexpanded summary.
efficiency (minor)
Problem: Alpha and Beta complained about the variable placement of the Add / Remove / Completed buttons.
p2
Solution: Give the buttons a separate column, or place them on the left instead of after course titles.
efficiency (major):
Problem: All three users complained about the lack of search filters, which is a prominent feature in the MIT subject listing search.
Solution: While the addition of search filters is not functionally difficult to implement, designing a good UI will take some time. However, search filters are probably essential to a good course registration tool.*paste here*
Reflection
The iterative design process provided three main learning paradigms that helped us to become better developers: (1) early designing provides easier changes, (2) iterative designing is more likely to find bugs, and (3) using iterative design helps develop a more detailed framework.
...