...

 
The landing page shows an overview of some main albums, such as recently added and albums of children, which users can directly go to.  It also has an alert if a user has content in their queue.  The navigation bar presents common options to the user, such uploading.

Queue Alert

The “Review Your Queue” alert is red, which calls action to it more than the other elements.

...

• As we tested them remotely, we used screen sharing to see how they directly interacted with our interface.
• Each test was tailored to meet the real life specifications of each user (text surrounded with quotes in the briefing and text was changed for each test.)
• Accounts were made for each user prior to each test.

Briefing:

• Purpose of application: To help parents manage co-owning digital content of their children and family
• You are a parent of "list children".
• You and your spouse have already created accounts on CoShare and CoShare recognizes you both as each other's spouses.
• You have a iPhone with a web-browser.
• I have given you a folder of photos that you should put onto your desktop.

...

1. Upload this picture from your iPhone to CoShare’s Mobile Site.
2. Login to your CoShare account on your computer.
   1. find the picture
   2. give it an appropriate description
   3. add it to a new album with an appropriate name

...

Demo:

...

We did not use a demo because we thought it was unnecessary and would cause us to lose some valuable information from the evaluations.

...

1. "Add Content" can be confusing, if it is adding it to the site or the selected album.
   1. Type: Internal Consistency
   2. Severity: Minor
   3. Solution: Replace with Upload
2. "Submit" is not consistent with other sites.
   1. Type: External Consistency
   2. Severity: Minor
   3. Solution: Replace with Upload
3. Dragging a single file without selecting (clicking on it) it does not work.
   1. Type: Efficiency
   2. Severity: Major
   3. Solution: Consider adding the functionality for this. This could however breach internal consistency.
4. "Choose File" and always having "No File Chosen" on the mobile site is confusing.
   1. Type: Internal/External Consistency
   2. Severity: Minor
   3. Solution: Replace with Upload button and remove the "No FIle Chosen" field
5. No idea there was functionality for editing the description and didn't know how.
   1. Type: Learnability
   2. Severity: Major
   3. Solution: Add right click functionality for editing the description as well as a button at the top of the mosaic for editing. (Similar to remove content button)
6. Confusing that the description when added was not displayed in the mosaic.
   1. Type: Learnability
   2. Severity: Minor
   3. Solution: Add functionality for the users to be able to show descriptions below pictures in the mosaic. Option in account settings or in the mosaic button bar.
7. Likes the idea of using a trash can album for removing content
   1. Type: External Consistency
   2. Severity: Minor
   3. Solution: Add a static album that when content is added to it removes it from all other albums.
8. Upload Modal having album selected to "None" gives users the idea that it might not get added to the site even if they submit content properly.
   1. Type: Internal Consistency
   2. Severity: Major
   3. Solution: Change "None" to "All Content"
9. Upload Modal gets too big and the submit button is inaccessible if the picture height is too big.
   1. Type: Bug
   2. Severity: Catastrophic 
   3. Solution: Set a max height for how each picture is displayed in the upload modal. Also, make that div scrollable for an overflow and not the entire modal.
10. When a picture belongs to too many different albums, the modal height gets too big and the submit button is inaccessible. 
    1. Type: Bug
    2. Severity: Catastrophic
    3. Solution: Make that div scrollable for an overflow and not the entire modal.
11. Submit Query Button's text overflows the size of the button
    1. Type: Bug
    2. Severity: Minor
    3. Solution: Increase size of button or change text to upload
12. When a user wants to delete a picture, the first intuition can be to right click an image. 
    1. Type: External Consistency 
    2. Severity: Major
    3. Solution: Add menu that pops up when a right click of an image happens that provides some common functionality
13. Children albums should be included in list of albums to upload too.
    1. Type: Internal Consistency
    2. Severity: Major
    3. Solution: Add the children albums to the list of albums to add to when uploading. There is a chance that all pictures being uploaded belong to a specific child. 
14. User thought that dragging a piece of content in the queue to a different album may remove it from the queue. 
    1. Type: External Consistency
    2. Severity: Minor
    3. Solution: Not a good idea to add this, because this would not remove content from other albums, so implementing this would disrupt our internal consistency. The actual solution would to make the remove from queue button visible at all times (even when content is not selected).
15. Wasn't immediately clear that double clicking an image would bring up modal.
    1. Type: Learnability
    2. Severity: Minor
    3. Solution: I think the problem is that the mouse over icon changes when a picture is selected guiding the user towards dragging the content. This drives the user to not try double clicking the content. How ever other users didn't have a problem with this so it most likely better to leave the mouse over icons as they are.
16. Removing uploads from upload modal looks weird
    1. Type: Aesthetic 
    2. Severity: Cosmetic
    3. Solution: Have the x icon over the top right corner of the image rather than off to the side

Reflection

We should have worked out our paper prototypes more before starting our computer prototype. we had to do a lot of expensive changing because we hadn't really settled on a design.  The paper prototype session was very helpful, and after it we decided to completely change the strucutre of Coshare by using albums instead of tags.  With such a big change, doing another paper prototype iteration ourselves would most likely have been very helpful.
We should have focused on the front-end more during the computer prototype iteration, and not even started on the backend.  We started the backend in parallel with the front-end in GR4, but spending time in the backend resulted in less time for the front-end.  The user heuristic evaluations were all centered around the front-end layout with no expectation of a working backend;  redefining our front-end approach would have led to a more complete prototype that could be intricately critiqued instead of critiques about more fundamental problems that just weren’t implemented.

We should have had all members of our team become more familiar with interacting with the backend, instead of relying on one person for it.  Teaching the team about Django basics would have allowed more efficient solving of front-end/back-end interaction bugs that slowed down development.

A major thing was starting out as a completely site that would never reload and execute all operations with Javascript and Ajax.  However, in some cases it was a better design to use page redirects sometimes instead of AJAX. Considering this choice more before implementation would have saved us trouble, as we had implemented a lot of Javascript functionality that in some cases was no longer even used with page redirects and reloads.

We should have researched more from the start how to deal with content effectively.  We didn’t realize that rendering large amounts of content could be problematic.  However, our site had issues we had with memory usage of images.  This affected usability as users couldn’t upload many full sized images without slowing down page renders.  Also, an issue with displaying videos was a function of intrastructure limitations- <video>  elements are not very reliable. Testing earlier the assumption that these would work smoothly would have led us to better planning around this obstacle.

However, all of these problems are great learning points for future projects.  Having studied and gone through this comprehensive design process, we now have a better idea of how to get worthwhile prototypes to users at low cost, and iterate more effectively on the design.  We also have much more defined ways to analyze UI design, which leads to better communication and easier logical decisions as a team.