GR2 - Designs

Scenario

Sarah has just received an internship offer from a company in New York, and begins to make arrangements for the summer. Though she is excited, Sarah realizes that she has never before been to the city and is wary about being alone and finding a place to live. A friend of hers tells her about TravelTech, and she decides to take a look.

After creating a TravelTech account, Sarah begins to browse the website. She first uses the interface to see which of her friends and classmates will be traveling to New York in the upcoming months, and she also finds out who will be in the city for the whole summer. Sarah then creates a Travel Group containing her friends who will also be in New York and sends them a brief message, telling them how excited she is to be spending the summer with them. Lastly, she visits the bulletin page and posts an advertisement for roommates.

Storyboard Designs

Design #1

Home Page: This is the page that is presented to the Sarah upon creating an account / logging in. The website is organized by tabs for ease of navigation. The "log out" link is always accessible in the corner of every page.
The picture below shows the "Map" tab.

On the Map page, Sarah can view other users' travel plans and can also search the map for friends or by location. The search results will be displayed in a list and will also show up on the map itself. Selecting one of the search results in the list or on the map will show that person's personal information as an overlaid box (shown below).

Profile Page: This tab will display the Sarah's own information (name, school, class year, location) along with travel plans and travel networks. On this page, Sarah can edit her information along with travel plans and networks. Sarah can also create travel networks on this page; selecting the "Create" link will display an overlay where she can enter the group's information and members. Sarah can also send a group email to a certain network by selecting the "message" link next to a network name. Pictures are shown below.

Bulletin Page: This tab will show the user bulletin page. Here, Sarah will be able to advertise for a roommate by selecting the "Add Post" button, which will display an overlaid box where she can enter the details of her advertisement (shown below). Selecting a specific posting will display an overlaid box with details about the posting. Sarah can also reply to other users' postings by selecting the "reply" button, which will allow her to send a message to the user in a manner similar to sending group messages.

Pros of Design #1: This design allows for ease of navigation between the pages. The use of overlaid boxes rather than separate windows or tabs will minimize the number of open windows, which increases efficiency. Many features of this design are also easily editable, providing extra safety, so that if the user enters incorrect information then he/she can easily change it.

Cons of Design #1: Learnability may not be very high, as it may be difficult for the user to figure out where each of the features are located (ie, travel networks are created from the profile page). The use of overlaid boxes for several actions might also result in some confusion to the user.