Implementation

QuickPick was created using HTML, CSS, and Javascript/JQuery.  Additionally, we used a few libraries such as JQuery UI to not re-implement functionality that already exists.  We simply fitted them to work for our tasks and to look and match the rest of our website.

While it would not directly affect the end result, the look and usability, of our design, we maintained many coding principles such as keeping clean and clear code that was as modular as possible.  Additionally, we made sure to separate our HTML, CSS, and Javascript which greatly simplified and relegated the bulk of the functionality to Javascript, and the look and appearance to the CSS, with HTML providing the structure of our page.

The HTML provided our skeleton for everything that was static: each of our bins including the semesters and our requirement bins, along with their headers and titles.  Then everything else (our classes) were added dynamically through the Javascript; this was done to facilitate the functionality that would be added to each object such as dragging, clicking of the information button, and excluding the semesters a class is not offered.  

Evaluation

User Testing

Users were selected from our network. Because QuickPick is currently focused for students in 6-3, we selected MIT students who were 6-3. Two of them knew they wanted to major in CS when they arrived to MIT. One of them was course 2 first, and then switched to course 6. This is representative of the user population of QuickPick in its current state. When we expand to other majors, our users testing population should be expanded and diversified to reflect this change.  There was no demo, but rather we gave them the tasks (included below) and access to the live site on one of our computers. 

...