top of page

Orbitz

Website Redesign

Orbitz Landing Page
Orbitz Landing Page Redesign

The Goal

When it debuted in 2001, Orbitz was a top player in a small group of fare aggregators. In recent years it has lost ground, looking and performing outdated in comparison to competitive sites. My goal with this project was to show how Orbitz can update to a clean, streamlined layout with more customizable user search options.

The Approach

This personal UX design project incorporated Competitive Research, Interviews, Card Sorting, Wireframes, Low-Fi and Hi-Fi Prototypes, and User Testing.
 

Competitive Research

The main sites reviewed for competitive comparison were Kayak.com, Booking.com, Google.com/flights, and Hipmunk. Based on conversations with study participants I also reviewed Swiss.com and Jetblue.com.

 

Research Interviews

I conducted interviews with 4 participants ranging in age from 27 to 45, all living in New York City and seeking to travel for the upcoming Thanksgiving Holiday. I had each user tell me about his/her flight goals and preferences. Next, I observed each user walking through the process of researching flights on Orbitz, followed by the competitor sights I had researched. 

The Issues

  • Users found the Orbitz landing page cluttered. They thought there were too many options and didn't find it necessary to repeat the main navigation (Flights, Hotels, Packages, etc.) with an icon version.

Orbitz Landing Page
  • When selecting “My dates are flexible,” users had trouble understanding the resulting date/price chart. They didn't understand that the highlighted price reflected the departure date (listed at the top) and return date (listed on the side).

Orbitz_Flexible Dates

 

  • ​​Individual flight options were located below the flexible dates chart. Users found the layout messy and cluttered. None of the users cared about the purple information (Orbitz reward points). Only 1 noticed the icons for “Shortest Flight” and “Cheapest Flight”. They didn’t understand what the green information (“Very Good Flight”, “Fair Flight”, etc.) referred to. Those who clicked on the link to find out more considered the information unhelpful.

Orbitz_Shortest Flight
Orbitz_Good Flight

 

  • While users liked the option to view baggage fees, they thought too much additional information was included. They considered it overwhelming and hard to focus on all of the details so early in the process.

Orbitz Baggage

 

  • All users would have preferred to have flight results and option filters to be for both the outgoing and return flights, rather than choosing an outgoing flight and then moving on to the next screen to set filters for and select the return portion of the flight.
     

  • Users would have preferred more customizable flight times. Orbitz requires users to choose between pre-selected flight ranges (Morning, Afternoon, and Evening) rather than homing in on a more precise time period.

Orbitz_Departure Time

Competitor Strengths

After observing each user go through the process of ordering a ticket on Orbitz, I had them repeat this exercise on Kayak.com, Booking.com, Google.com/flights, and Hipmunk.com. I have consolidated a list of the main features they preferred on these competitive sites in comparison to Orbitz:
 

  • Overall, a cleaner more streamlined layout

  • Having the dates selection pop up calendar show good flight travel days (as seen on Kayak), preferably showing the lowest available flight price on the calendar (as seen on Google)

Kayak Flights Calendar

Kayak Flights Calendar  

Google Flight Calendar

Google Flights Calendar

  • Ability to customize date flexibility options by plus/minus days on either side of the trip (i.e. -1 day on the outgoing flight, +2 days on the return portion). One participant mentioned she would have liked this option to be more obvious as she originally overlooked the “exact” dates label.

Kayak_Plus-Minus Days

  • The "flexible dates" chart produced from a more precise date range was considered less cluttered (in comparison to Orbitz, which automatically tacks on 3 days before and after the selected date). Users also liked the rollover option on this chart, showing a snap shot of the flight time and number of stops.

Kayak Flex Dates Chart
Kayak Flex Dates Rollover

  • All users liked the customized flight time option. The price graph pop-up (when selecting flight time) was also considered useful. Overall, they preferred the clean infographic look of information in comparison to Orbitz.

Kayak_FlightTimes
Kayak_FlightTimes_Graph Overlay

  • Users liked the ability to pick both outgoing and return flights in one screen, rather than going through the entire process for the outgoing flight and then repeating it for the return.

Kayak-Both Flights
Google_Cleaner Results Layouts

  • Preferred the cleaner, less cluttered layout of flight result information in comparison to Orbitz.

  • Users were split as to their preference for filter options located at the top (as found on Google and Hipmunk) as opposed to on the left (as found on Kayak.com and Booking.com).

Google Top Filter
Himpmunk Top Filter

  • Liked having the price of baggage included. Kayak offers this option. Google also offers this option, but only for overhead (which has checked bags price inclusion listed as “coming soon").

KayakCheckedBags.jpg
Hipmunk Baggage

  • Found Hipmunk’s solution of having limited baggage information available as a side option clever and clean.

Card Sorting

After concluding my initial user observations, I conducted card sorting exercises with these same users to determine the optimal navigation layout.

Card Sorting
Wire Frames

My next step was creating annotated wireframes. This proved helpful in deciding between options such as top vs side navigation, information included under flight results, details and location of baggage information, and the content/layout of the final check-out summary screen.

Landing
Calendar
Results
Results
Results
Results
Design

Following the wireframe user review phase, I moved on to implementing a design based on my findings. Below I've shown screens from the original Orbitz site, followed by the redesign with notes on the most noteworthy changes. 

Orbitz Original Site: Landing Page
Original Orbitz_Landing
Original Orbitz-Calendar
Redesign: Landing Page 

On the landing page of the new layout, I focused on these major elements: 

  • Simplified navigation

  • Cleaner overall layout

  • Flight Class and Date Flexibility options added to navigation for more prominence

  • Lowest prices of the day added to travel calendar

Orbitz Landing_Redesign
Orbitz Calendar_Redesign
Orbitz Original Site: Flight Results Page
Original Orbitz-FlexibleChart
Original Orbtiz-FlightDetails
Redesign: Flight Results Page

For the flight search results page, along with a smoother overall design I concentrated on the following areas:

 

  • Cleaner flexible dates chart resulting from more customized date options

  • Filter options for both outgoing and return flights included on 1 screen

  • Both outgoing and return flight options available on 1 screen, instead of having to choose each leg of the flight separately

  • Baggage price/detail information included 

  • Cleaner flight detail drop-down

Orbitz Calendar_Flex Date Chart
Orbitz Calendar_Flex Date Chart
Orbitz Results_Redesign
Orbitz Original Site: Final Fight Summary
Original Orbitz_Final Screen
Redesign: Final Fight Summary

The final Orbitz flight summary screen was very cluttered, without an effective separation of information. In addition, it did not offer the ability to add a hotel reservation. I addressed these issues with the following changes:

  

  • Sectioned information into more defined layout

  • Provided details on benefits of Orbitz Rewards

  • Added option to book hotel rather than only automobile

Orbitz Final Screen_Redesign
The Results

This video brings to life the final layout, showing how a user would move through the site.

bottom of page