ANSELMA HARTLEY

// Back to UX Portfolio

Project Expedition Use Case

I worked for Project Expedition, a startup travel booking company located in New York City as a UX Research and Design Intern in the Summer of 2015. The company needed to create profile pages for each of their vacation destinations (e.g., Belize, Costa Rica, etc.) so that users could browse information about the location, such as weather, geography, culture, and travel information, see all bookable tours, and compare tours based on price and a variety of other factors.

Goal: To create a destination profile page to enable users to easily browse destination information, bookable tours and activities, compare tours, and see featured trips. This feature was intended for the user who had a loose idea of where they wanted to go, but wanted more information about when to visit, culture, and the types of activities and things to see at that destination.

Process: We created uses cases to think through the user flow and process. Who were our users, and what would they want to see first? What information would be most useful to users trying to plan a vacation to that destination? How do we balance the information users want to see, but at the same time feature the company's product (the bookable tours)? We also want to make sure the design and clickable areas were relatively consistent with the rest of the web page.

Our process required many iterations of designs, consideration about user flow, and ordering of information on the page. Below, I highlight some of the features that required the most thought, iterations, and deep consideration of the user's perspective.

Destination Profile Page: For the top of the page, we chose a spanner picture of Costa Rica as the first thing users would see, followed by quick links to the popular regions within Costa Rica. Here is the wireframe I created and the final design, side by side:

locationprofilepage_top

topofpage

Next, we wanted the user to get "quick info" about the destination. We tested out several ideas about what users might want to see. Initial ideas included links to Project Expedition's blog posts about Costa Rica, a weather widget connected to Weather Underground, but ultimately, we settled a bio about the destination, and some quick facts about the region, things to know (language, season to visit), and an overview section where users could get quick links to more information about cuisine, culture, currency, etc.

I created many wireframes to get this section right. I ran each iteration by the team, informally collecting user's impressions, until we came up with a working design we ended up loosely adhering to. Below is the final wireframe I designed, and the final design we ended up using for the web page.

3

3

We wanted bookable tours and activities to be prominently featured on the Destination Profile Page so that users could see all the tours available at the destination, browse the many tours easily by using several filter features. We also wanted to create a design that would require as few clicks as possible to get to the booking page in order to increase monetization. I came up with a variety of filters, borrowing ideas from different websites, and by asking potential users what they would care most about when browsing tours.

4

4

Product Comparison Tool: We also wanted users to be able to compare tours on a variety of features. Users needed to easily access this "product comparison tool" from the destination profile page. I started by using an excel spreadsheet style format, with categories in the columns, and the tours in each row. Here is my final design and the way it appears on the Project Expedition website.

4

4

Flow: I worked with one other UX intern to determine what the user flow should be from the destination profile page where the tours were listed to the product comparison tool that allowed users to compare the tours.

We initially were planning to have users see that they could compare tours by hovering their mouse over any tour, where a "compare tour" banner would appear. If users clicked on the banner, it would bring them the product comparison tool or "compare tours" window in a new browser window. This flow (along with some of the widgets and features of the product comparison tool I designed) can be seen below.

4
Product Comparison Tool User Flow & Features

The Project Expedition UX team ultimately ended up improving upon the flow I designed by including a menu widget built into the Tours & Activities portion of the destination profile page that allowed users to choose between "show tours" (the default view), "compare tours" (which would display the product comparison tool), or map tours" which would show a Google map of where all the tours were located. I've circled this widget in the screenshot below in purple.

4
Project Expedition Final Design

You can see all of this work at Project Expedition's website by clicking here. Many of the designs are my own, but I worked collaboratively with my supervisor as well as a few other UX interns on these projects, and got feedback from the entire Project Expedition team. The UX team at Project Expedition has improved upon my designs further since I've worked there.