Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

GR2 - Designs

Scenario

Charles has downloaded PhotoBook and wants to browse through Facebook photos. He opens the app, and logs into his Facebook account. After browsing around a bit, he sees his friend Jennifer. Charles has a crush on Jennifer. He opens photos of her to see what she has been up to. He finds a romantic photo of Jennifer and Brian. Charles is shocked. Brian used to be Charles’ best friend. Is this why they haven’t talked lately? Charles opens the search page on PhotoBook, to investigate this betrayal. Sure enough, he finds plenty of photos with Brian and Jennifer. Charles finds a particularly incriminating sledding photo, and emails it to Donovan, to see if he has any explanation.

...

Designs

General Features

These are views that are quite straightforward and will all be used in the different designs.

Login Page

The first window that is shown when opening PhotoBook. The user enters his/her Facebook email and password so that PhotoBook can obtain the photos and start the viewing process.

Image Added

Full Screen Photo View

This view displays a single photo at full screen. The top bar contains a “Back” button to navigate back to Photo Grid view. It also contains a title indicating the position of the photo within the album, and a share button. The bottom bar displays the caption of the photo, the name of the friend who uploaded the photo, the date the photo was uploaded, and the names of the people who are tagged in the photo. Tapping on the photo, or waiting several seconds hides the top and bottom bars so the only element on the screen is the photo. Swiping left or right navigates to the previous and next photo, respectively, and pinching zooms the photo in or out.

Due to the limited screen real-estate on the iPad, we wanted to use the entire screen to display a single photo; the user should be able to view the photo as large as he or she would like. Thus, the natural design is to present the photo such that it fills the screen, and provide minimal information that appears when tapped, and disappears automatically. Thus, aside from minor layout details regarding how the additional information is positioned, little can be changed in the Photo view design. Thus, we chose to only present one design for the Photo view, and focus our work on alternate designs for the album, photo list, and sharing views, which are presented in the sections below.

Image Added

Design 1 - Traditional

This design closely follows the traditional “album” metaphor to explore, find, and share photos. The user first sees a grid of albums with a chosen photo on the cover. Then, the user can open an album, which hides the other albums and shows only the photos in the chosen album, laid out as a grid. The user can choose a photo to pull it out of the album and view it closely (at a size that fills the screen).

...

*Error prevention and correction: *Overall, the interface is not prone to errors. The horizontal scrolling would feel very natural to the user and make it simple for him/her to navigate back and forth between albums in pictures.

...