Prototype Pictures

Paper Prototype

Description

In the initial prototype, the user was presented with the following dashboard.  Tabs on the side provide the user the ability to filter the result set (not implemented in the first paper prototype).  The center column provides a list of jobs separated into 3 categories: unassigned, assigned, and recently completed.  Jobs have the ability to be clicked ("focused"), or starred.  The rightmost column shows the currently selected or focused job.  A description of the job, the ability to mark it complete, assign it to a worker, and create updates on the focused job.

The user is able to star jobs in the center column by clicking on the star to the left of the job title.  The UI is simply updated to reflect the starred job.

Users can assign a focused job to a list of workers.  The assignement is done in the right column by clicking the dropdown list of users.

When a user assigns a job to a particular user, the UI is updated to reflect this by showing the assigned worker on the right side of the assignment widget.

Notifications are presented to the user in the upper left.  The notification widget is updated with a count of the number of notifications.  In the paper prototype, the mechanic created an update on a particular job (see the focused job update section), which created a new notification in "real time".

The address book, opened from the main dashboard, presents the user with an unfiltered alphabetically ordered listing of contacts.  The user has the affordance of searching (with autocomplete and auto-filtering), and scrolling.  The paper prototype did not support scrolling, however.

By typing the beginning of a search term, the results are dynamically updated to reflect the best fit results.

The second version of the paper prototype does not have a job selected by default.  This forces a user to select a job before any information is displayed in the right column.  The rest of the initial dashboard is unchanged.

The second version paper prototype gives feedback to the user as to which job is currently focused.  An arrow on the right of the focused job as well as an indicator on the left of the focused job is displayed.

The second version of the paper prototype includes a new way of starring jobs.  The updated job information includes the star in the upper right of focused job.  This allows users two places to acheive the same functionality of marking a job as "starred".

The second version of the paper prototype includes the ability to filter results based on the left-most column.  When the tab in the left column is selected, the center list is filtered to list only the matching jobs.  Jobs may then be selected as previously.

Briefing

Application purpose:

MIT House Managers and mechanics have to coordinate to complete house repairs. Currently:

Our application speeds up this repair process by being a centralized, organized hub for House Managers to identify/prioritize important repair jobs, to delegate said jobs to mechanics, and to then monitor repair job progress.

Background information for user:

For this user test, you are the House Manager (Michael McIntyre) of McCormick Hall. You’ve just arrived to work, and you open up our application to begin working on house repairs.

Scenario Tasks:

  1. Identify the date, time, and location of the most recently completed repair job.
  2. View more information about the McCormick light bulb repair job.
  3. Star the McCormick light bulb repair job.
  4. Assign the light bulb repair job to Jenks Jenkinson, the house mechanic.
  5. View any new notifications and read them.
  6. Look up contact information for Home Depot in order to place an order for light bulbs.
  7. Make a non-urgent note on the light bulb repair job indicating that supplies have been ordered and will be available Wednesday afternoon.

Observations: 

Iteration #1:

Iteration #2:

Prototype Iterations:

Change

Iteration #1

Iteration #2

In Iteration #1, users felt bombarded with text/information when they first looked at the application.
So when the application is first opened in Iteration #2, no repair job entry in the middle panel is selected and so the right panel (which provides details of a selected job) is empty (with just the text "No job selected" showing in the right panel). This approach not only spares the user from the initial text/information overload, but it also emphasizes the connection between the middle/right panels by conveying to the user that nothing is displayed in the right panel since "No job selected".



In Iteration #1, users did not understand the connection between the middle and right panels.
In addition to the aforementioned fix, Iteration #2 features new UI components that better indicate that the content in the right panel are details of the job selected in the middle panel. In particular, we added a vertical rectangle at the left of a selected job entry to indicate which job has been selected and an arrow at the right of a selected job entry to indicate where more information about the job can be found.



Users had difficulties finding how to mark a task as important.
Users attempted to find the "Star" widget in the right panel to no avail. We realized this was because there was a "Mark Completed" button in the right panel and so users may have thought a "Mark Important"/star button was also located in the right panel. To fix this, in Iteration #2, we added a "Star" button/widget to the right panel.



Users wanted to use the tabs on the left.
During the first round of user testing, users would often click through the tabs in the left panel when searching for a particular job's details. However, we had not implemented this functionality for Iteration #1's Paper Prototype. So for Iteration #2, users were able to search through jobs via clicking through the tabs in the left panel.



Studio Feedback

It seemed like prioritization of tasks was one of your main need that you found in GR1

How did you identify important/unimportant

I wish the task actually hadn't been called "starred". If you're making the change to the task you're not actually testing ithe important feature.

Were you looking for gmail metaphor or is this how things are playing out?

It sounds like the second prototyping went well, maybe a third round can be done before you start implementing your product.

Appendix (raw user test observations):

Iteration #1:

User Test A

User Test B

User Test C

UI suggestions

Questions

User Test D

User Test E

User Test F

Iteration #2

User Test G

User Test H

User Test I