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

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

The home page prominently features the four different search types that are available. Under each search bar there is a thumbnail of a photo and corresponding word or phrase that is representative of that search type (e.g. "Nature" for type of photography). Tiled below are randomly generated thumbnails of photos from the database that also fit the description of the larger photograph. On this page, viewers can search for photographs or simply click around if they aren't feeling imaginative. Anyone can register and log in via the link at the top right. Users, once registered, can comment on and post photos. Paul can tell right away that he will be happy posting his pictures here, so he clicks "POST A PHOTO", but he must register first, so this brings him to the Register page.

Paul puts in his information and clicks submit. (Note: Textfields for "First Name" and "Last Name" would not be required fields).

After submitting his information, he is re-directed to the log in page, where he logs in and then begins posting a photo.

Paul uploads a file of a photo he took at Joshua tree, fills in the location, date and writes a brief caption. He clicks submit.

He immediately sees what his post looks like. He sees that there is an "Edit Info" button available to him but he his happy with his post. He leaves the website and later on calls his aunt, Valentina, and lets her know that he posted the photo. Valentina types "photo talk" into google, her only confident course of action on the web. Luckily, it is the first hit. She loads the page and sees the home page as depicted in the first sketch. She navigates to the "Photographer" search bar and types in her nephew's name, "Paul Jones".

His name comes up so she clicks his name to see his photos.

His personal page loads and she can see that he has posted one photo. She clicks the thumbnail and it loads the display page.

"What a beautiful picture", she says to herself. She decides to tell this to Paul the next time they talk, rather than comment on the page. Meanwhile, Colby, a seasoned PhotoTalk user, signs on and is feeling nostalgic about his home state. He searches for "Joshua Tree" in the location search bar on the home page in order to satisfy this nostalgic feeling.

The thumbnail of Paul's photograph is enticing, so he clicks it.

Colby loves the photo, but can't help but notice that the photo is of a California juniper not a Joshua Tree, as the caption says. Since he's already logged in, he clicks "Post a comment..." and writes: "Awesome photo, man, sure makes me miss home. That's a California juniper, though, not a Joshua tree!" A few days later, Paul decides to log in to PhotoTalk again.

After logging in, he sees the My Photos button at the top right and decides to see the status of his original photo before posting anymore.

He notices there is 1 new comment so he clicks to see what has been said.

He's happy someone already saw his photo, but feels a bit silly for having misidentified the tree in his caption. After clicking "Edit Info" he is brought to a page similar to the "Post Photo" page where he changes the caption of the photo and clicks "Fix Post!"

After viewing that his caption successfully updated, he makes a post in response to Colby's post.

Analysis

Design 3

The main page looks like this.

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

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

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.

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.

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.

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, Colby 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. Colby's comment then appears at the end of the comment list.

Later, Paul open his user's page. He sees Colby'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