Scenario

Paul is a 23-year-old graduate student in computer science at MIT. He enjoys travelling and taking photos along the way, and he also likes to share the photos he take with his family. One summer, he goes hiking at Joshua Tree, California, and takes hundreds of photos. To share his photos with his aunt Valentina, he signs up for an account at the PhotoTalk website, posts his photos, and calls Valentina to tell her to go online and see his photos

Valentina, 50, is a housewife with less-than-average computer skill. The day after she receives Paul's call, she goes to the PhotoTalk website and tries searching for Paul's photos. The two pieces of information that she has are the location, Joshua Tree, and Paul's name.

Colby, 36, is originally from California, but he now works in Boston for a sports equipment company. While he often takes photos, he rarely shares them with others. Being in Boston, he sometimes misses home and wants to see photos of his favorite spots in California. After getting to know PhotoTalk and browsing it for a while, he comes across Paul's photos of Joshua Tree and immediately wants to comment on them. He also feels that some of the information Paul provides is incorrect, and he wishes to correct them.

Paul then receives notifications from the website about Colby's comments. He replies to the comments, makes corrections as Colby suggests, and posts some more photos.

Storyboard Designs

(3 Designs here! Keep them simple but different from one another.

- Describe the design in words and sketches

- Explain how the design works with the scenario above

- Analyze learnability, visibility, efficiency, and error prevention)

Design 1

(Image: Main Page)

Every page has a bar at the top and another one on the left. The top bar allows the user to sign in or sign up for a new account, and if the user is already logged in, it shows the name of the user. The left bar lets the user search for photos based on different criteria. It also has links back to the main page and to "My photos", the photo management page, and the notifications page. The main area shows the latest photos added by users as well as the most commented photos.

After signing up for an account, Paul clicks on the "Post new photo!" link on the left bar, which takes him to the "Add photo" page.

The "Add photo" page shows a preview of the image (before the image is uploaded, it just shows "No image yet.") Paul then browses the photo he wants from his folder, add the necessary information as well as some of the optional information, such as a caption saying "I took this photo when it was so hot!" He then clicks "Post!" He keeps adding photos until he was satisfied.

Valentina goes to the site to see the photos that Paul tells her about. She searches for Paul's photos with the location, Joshua Tree. Paul has just posted his photos the evening before, so she could find his photos not too far down. The search results show the pictures with location "Joshua Tree."

Colby would like to see some photos from his home state, California. He is looking at the most recent pictures on the site when he comes across Paul's photos. He clicks on one of them, and the site brings him to the "View photo" page. He notices the comments, and he sees the space where he can post his own comments. He could also use the "Prev" and "Next" links to see other pictures according to the posting time (because he came to this photo according to Most Recent, so the photos are sorted by time.) Colby also make another comment telling Paul that his information is wrong.

When Paul logs in again, he sees on the left bar that there is a notification. He clicks and finds Colby's comments saying that his information is wrong. Paul then clicks "My photos", also on the left bar, to get to the photo management page:

Paul sees his own photos on the "My photos" page. He clicks on the one which Colby commented on, and the site takes him to the "View photo" page. Since he is the owner of the photo, there is an "Edit photo" link on the top-right corner. He clicks on it, and the next page allows him to change the information, which he does accordingly.

Analysis

Design 2

...

Design 3

The main page looks like this.

(Image: Main Page)

There is only one search box, which can take any type of search terms: location, scenery type, date, or uploader. Advanced search can be accessed by a link. The picture around the search box are the recently posted pictures or pictures related to the current events.

When Paul arrives at the home page, he uses the login link to login. Then he goes to the User's Page

(Image: User's Page)

The user's control panel is composed of three tabs. Paul wants to add photo, so he opens the add photo tab.

(image: Add Photo) (Image: Supply Photo Info)

He browses for his photo directory on his camera. Then he adds photo information on the subsequent page. He uses the "Copy" button to copy all information often since most of the pictures are taken from the same place in the same day. When he is done, the website goes to the Manage Photo page.

(Image: Manage Photo)

He sees his uploaded photo pile in the list. He then calls his aunt Valentina. Knowing that Paul went to California, Valentina goes to the website and enter "California" into the search box. The website goes to the search result page.

(Image: Search results)

Valentina sees beautiful pictures of California, but this is not what she exactly wanted. She notices the Refine Result box on the right and enter Paul's name into the uploader box. She sees Paul's pictures at Joshua Tree and clicks on the photo. This brings Valentina to the view/comment page.

(Image: View/Comment)

Valentina just view the photo. The related photos on the right shows some other photos that Paul took and some other photos of California. She decides to browse some of those pictures.

Meanwhile, Coldy is looking at the same photo. He admires the photo, but he sees that some of the information Paul wrote for the photo is not correct. So he talks to Paul by entering his comment in the box at the bottom of the comment section. Coldy's comment then appears at the end of the comment list.

Later, Paul open his user's page. He sees Coldy's comment in the recent comments. So he clicks on Manage Photo tab to edit the information of several images he uploaded on that day.

He selects the photo pile from the day he uploaded. The Edit Photo Info page reappears, and Paul edits the photos' descriptions.

Analysis