Flight Canceled Prompt

project overview

Ryan Farrell created a useful tool for people looking to practice UX writing where daily emails are sent with various prompts that are meant to be completed within fifteen minutes. Wanting to practice my communication skills, I chose to expand this challenge to be a UX writing and rapid prototyping session. I aimed to treat each prompt like a miniature hackathon where I would spend, at most, five hours creating a final result based on the given prompt. This allowed me to practice my design process in a fast-paced environment.

Scenario

A traveler is in an airport waiting for the last leg of a flight home when their flight gets abruptly cancelled due to bad weather. Write a message from the airline app notifying them of the cancellation and what they need to do next.

step 1: Define

In order to explore the problem-area, I first brainstormed important elements of people that the app's message would be directed to. I specifically wanted to consider users that would be especially impacted by the flight cancellation like parents with young children or people attending an event. I worked to address their primary needs/thoughts and the top emotions that they may be feeling.

While considering the people who would access the cancellation message, I realized that there would be two primary categories for people viewing the notification. This led me to brainstorm the primary needs of people in each case and resulted in a rough sketch of the situation.

Tools Used

Pen and Paper - Brainstorming

Key Insights

The primary emotions of people who have their flight cancelled would most likely be anxiety and frustration. The cancellation message in the app should be calming and help ease any worry pertaining to uncertainty
People who have plans will be worried about missing something. The cancellation message should contain something to help combat fear of loss
There are two categories people who have cellphones will fall in: those that are currently active on their phone and those that are busy doing other tasks not related to their device. The cancellation message needs to effectively draw the individual's attention in both cases
The goal of the notification is to direct the user to the application or website in order to get more information and change their flight

Exploring The Users

Exploring Contexts

step 2: Research

Before building my prototype, I wanted to research how airlines currently alerted passengers through their mobile devices. Looking at existing application notifications would give me a better understanding of the cancellation process and would allow me to iterate on the designs.

It was surprisingly difficult to locate examples of notifications and in-app processes for dealing with a flight cancellation, however, I was able to find a cancellation pop-up from Delta.

Key Insights

Current interfaces provide details about the cancelled flight but do nothing to provide understanding or ease anxieties
People tend to lose trust in an organization when unexpected errors or challenges occur. Providing context into the reasoning of the cancellation and what the airline is doing to help may help establish loyalty.

Delta Pop-Up

Although this provides helpful information about the cancelled flight, this does not provide enough context for why the flight was cancelled. The call-to-action buttons place the burden on the user and do nothing to ease anxiety. There is no information about what the airline is doing to help the situation.

step 3: Rapid Prototyping Of Notifications

Using Figma, I created quick prototypes of the notifications that are meant to direct people to the airline's app. These included specific design decisions that could be used in a final product to achieve an optimal user experience despite the disappointment of a cancelled flight.

Tools Used

Figma - Mockup Creation

Case 1: Person Not On Phone

The notification is shown on the lock screen as the person hears a unique alert from their phone

Case 2: Person On Phone

The notification is seen in the notification center as the person is on their phone at the time of the notification

step 4: Iteration of In-App Designs

Using Figma, I created two versions of the in-app flight cancellation alerts. By using the first design as a starting point, I was able to expand on my design and increase the usability for people.

Tools Used

Figma - Mockup Creation

Version 1 Insights

This version had a lot of information in one small area and appeared slightly cluttered
The optimal outcome for the airline occurs when people agree to be booked on the next flight. This design might lead people to request refunds without knowing what it entails.
There is no information in this design about when the next flight is
There are no opportunities for people to view other flights in order to see if they would rather book a different flight using a refund

Version 2 Insights

This version is more transparent about the process of addressing a cancelled flight and allows the user to easily understand each step
People that are new to the app or who are nervous will feel more in control
There is room for improvement with the UI
More details are needed for the refund process so people understand what that process entails

version 1

version 2

User Has Clicked "View My Options" Button In Above Screen

User Has Clicked "Book This Flight" Button in Above Screen

Project Outcome

Despite the massive time crunch, I greatly enjoyed the challenge of redesigning the flight cancellation message. I was able to practice my design thinking in a scenario that required flexibility and patience. This project allowed me to practice my skills in Figma while operating in a context that had relatively little outside information. Although the final product is far from perfect, I am proud of my interfaces and the affordances they provide for the user.

View Project in Figma

Page updated

Google Sites

Report abuse