CHALLENGE

Pan Am needs a responsive website to launch a new business with rebranding. The site should work efficiently to allow users to easily manage their flights, and to provide a seamless online and offline service.

SOLUTION

I created a responsive site for Pan Am’s customers to intuitively book and manage their flights. I also helped refresh their branding while maintaining their legacy. I focused on the efficiency of the site to improve the traveler’s overall experience.

ROLE

UX/UI: Comparative and Competitive Research | Interviews | User Personas | Sitemap | User Flows | Sketch | Wireframes | Mid-fidelity Prototype | Branding | UI Design | UI Kit | Usability Testing | Affinity Map | Prioritized Revisions | High-fidelity Prototype

Tools used

Sketch | InVision | Adobe Illustrator | Photoshop

I began this project by doing research to understand the airline industry and identify Pan Am’s competitors in order to define the positioning of their brand. After analyzing its competitors’ businesses, I found that offering a seamless service such as notifications and easy ticket management can make an airline service’s successful. Travelers tend to feel more stress before and after boarding due to unpredictable factors including delays and changes. Focusing on how a digital platform could minimize their stress and allow them to manage their trips easily would be also important.

After reviewing various airline ranking sites, I selected six airlines as Pan Am’s competitors. Direct competitors would be Southwest, Alaska, jetBlue, and Delta because of their excellent customer service both online and offline. Indirect competitors would be Virgin Australia and Emirates because of their unique and strong branding presence that Pan Am should also try to achieve. Overcoming its weaknesses would help excel Pan Am’s branding and business.

After this research, I talked to five participants who travel by air at least five times a year to understand their expectations and frustrations. One of their common behaviors was that they were all frequent flyer members and would always purchase tickets directly from an airline’s site. They expect that sites should be more intuitive and work more efficiently. They would like to manage their trips as smoothly as possible and make the most out of their mileage points.

From this interview, I learned that what they expect the most from airline sites is efficiency. They want to search for and manage their tickets more directly and easily. Overcoming these obstacles and allowing them to take charge would be important to building a successful site. They are the customers who expect high-quality service, and will be repeat customers once they become loyal to the brand.

After collecting all the necessary data from my research and interviews, I had a better idea about who the personas were and what they expected from the airline. There were two different characteristics I studied from previous conversations with participants, and I applied them to create two personas. The first persona would be a business traveler who wants to manage their trips as easily as possible and appreciates bundle offers. They need quick notifications for delays and changes since business trips are time-sensitive.

The second persona would be a person who travels often for pleasure. They may have a more flexible job that allows them to travel frequently. They are someone who wants to enjoy the new experience while utilizing mileage points effectively. They want to manage their flights easily and be able to access their account any time they want. These two personas both want to take control of their flights to ensure smooth trips, and wouldn’t mind spending on high-quality service. Once they like the airline, they will become loyal to the brand.

After defining personas and clarifying their needs, I created a sitemap by incorporating functions that they would need to achieve their tasks on the website. The key functions would be those used the most by customers: "Book," "Manage," and "Check-in." Travel alerts and frequent flyer program sections were added since they were also important functions for travelers. The site map covers all the information they need that is related to their trips.

In addition, I created a user flow by figuring out how customers would interact with these functions to complete their goals. I came up with two alternative paths; one was for the business traveler who utilized bundle offers, and another was for the vacation traveler who wanted to make use of mileage points for booking tickets. After making sure how these functions worked for users, I moved on to the next process.

Having finished creating the sitemap, I visualized and sketched out ideas for the key screens of the site. At first, I implemented three main functions which were the “Book,” “Manage,” and “Check-in” features.

Then, I put them together with other features and sections, going through multiple iterations. I worked on pages that I needed for creating the mid-fidelity prototype in order to test its functionality.

Visual design is one of the most important aspects of the user experience. First impressions are everything. To ensure Pan Am would have a strong comeback, I created a brand logo that maintained its legacy. “Pan” is originally a Greek word and has a meaning of “all.”

Keywords I considered for representing the brand were “all across the globe,” “modern,” “stylish,” and “reliable”. I added graphics elements to the logo to show the concept. Once their branding was defined, I worked on interface designs to develop a cohesive look and feel to Pan Am’s visual presence.

While creating UI designs for the site, I prepared the prototype to test key features. Since I wanted to identify functionality issues, I kept the prototype in mid-fidelity. However, I still wanted to get feedback about the visual aspect of the brand, so I decided to show them to participants separately. Tasks I asked about included account login, booking, and managing tickets. The testing was done both through meetings in-person or remotely with screen share.

The testing was helpful for identifying issues. I quickly found that problems focused on ticket booking and managing, and overall I received positive feedback on visual designs. After the testing, I documented my findings to prioritize revisions. Creating an affinity map helped me clarify actionable solutions to improve the website.

Customers expect airline sites to be efficient and simple and easy to use. They would like to manage and control their trips as smoothly as possible by minimizing their stress in order to have a seamless online and offline flight experience. The user testing gave me a chance to find issues to improve the product to meet their needs.

After the testing, I created the high-fidelity prototype. For the next step, I further plan to conduct the testing with the updated prototype and add revisions as it needs to ensure Pan Am has a strong comeback and offer the best flight experience for customers.