Digital check in
Dynamic
baggage pricing
I redesigned WestJet’s baggage feature in their digital check-in flow with the goal of serving up personalized pricing information to help travellers purchase checked bags before arriving at the airport.
$961k
Estimated revenue increase in first 8 months
3.2%
Increase in paid baggage attachment during check in.
Overview
Increasing checked baggage revenue through thoughtful design
Checking baggage while flying is confusing. Baggage fees vary based on route, number of bags, and weight. Additionally, fees can change depending on the traveler’s airline status or credit card. Each airline has its own policies, and travellers often aren’t sure if their baggage needs to be checked in the first place.
Platform
Web app
Duration
July - Sept 2023
Role
UX/UI designer
Tools
Figma, Illustrator
The challenge
Too much cognitive load and a lack of clarity
Checked baggage requirements appear on a separate page from the one in which guests add and pay for checked bags, requiring users to remember information they can no longer see. Additionally, baggage pricing information is generic, and isn’t dynamic when a guest is eligible for free bags. This leaves guests confused about baggage pricing and requirements and deters them from purchasing checked bags in the first place.
Some key issues we discovered:
1. A fragmented flow
Baggage requirements appear on a separate page from the purchase page, resulting in high cognitive load, and even requiring the user to navigate backwards.
2. A lack of personalization
Free baggage allowance and pre-paid bags aren’t shown, creating a whole lot of doubt, confusion and hesitancy to pay for bags.
The solution
Simplify, focus and personalize
I had to find a way to merge two pages without overwhelming the user, as well as display dynamic baggage pricing information that is unique to the individual user. My goal was to strip away clutter and create an interface that would make users feel confident in their decisions.
1. Merging information
I merged the previously separate "Baggage Requirements" page and "Add Baggage" page into a single page by adding baggage weight and dimension requirements into an expander that sits above the “Add Baggage” interface.
I also added baggage pricing information and created illustrations for each baggage type.
The before
The after
2. Dynamic pricing buttons
In order to mitigate confusion about how bag prices increase with each subsequent bag, I designed dynamic “add baggage” buttons. With each click, the price for the next bag updates within the button itself. The price is unique to each guest, and accounts for free baggage benefits that come with premium fares, credit card holder status and airline status.
A/B testing post-launch estimated that this feature generated an additional $961,000 in checked baggage revenue in the first 8 months of 2024.
The process
Baseline research and testing
The dynamic pricing project was prompted by guest feedback that they were unsure whether their free and pre-paid bags were accounted for, or if they would have to add them again in the paid baggage flow.
“I had purchased online 1 checked bag 24 hours before, but at the time of checkin [it] did not show that [the] bag has been paid for. I did not get any msg of confirmation after the purchase. So was confused whether to add bags again at the time of check in.”
- A guest
“I have the WestJet World Elite Mastercard which is supposed to include one free checked bag. I had to pay the checked bag fee when I checked in online. I would like to have that fee reimbursed. There should be a section when checking a bag that recognizes the card.”
- A credit card holder
A/B testing
In order to validate that anecdotal guest difficulties with the baggage flow were worth a redesign, we ran ran an A/B test with the (A) existing design and (B) an enhanced version with added information that we had anecdotally learned through guest feedback channels would be useful to guests. The enhanced version added copy to display baggage prices and an extra column to differentiate pre-paid bags from those the guest was adding in the flow.
The test revealed that:
1. 60% of guests mistakenly believe that they can pay for bags at the airport kiosk
2. Guests would like to see bag prices and refund information on the same page as where they add bags.
3. Including pricing information on the page where guests add bags increases satisfaction by 5.4%.
(A) The existing design
(B) The enhanced design
The process
Getting to know the competition
Any good redesign kicks off with a competitive analysis. Here’s a snapshot at discoveries about the paid baggage flow from competitor airlines:
Sunwing Airlines
Sunwing uses a simple chart that details dimension requirements and fees both carry-on and checked bags in one concise view. The information is not dynamic to the user but it does call out that fees don’t apply for pre-paid bags.
Strengths and opportunities: Concise view of baggage requirements, accounts for pre-paid bags
Weaknesses: Text-heavy and visually boring, pricing is not dynamic
United Airlines
United Airlines clearly lays out how many checked bags are included for each passenger and what their max weight is. They also use delightful illustrations to show different baggage types. However, United may include too much information by surfacing baggage requirements for all classes of service and tier levels, introducing confusion and potentially defeating the purpose of what would have been a very clear flow.
Strengths and opportunities: Clear baggage allowance per passenger, appropriate use of illustration
Weaknesses: Surfaces information that is irrelevant to the guest and their trip
The process
Problem solving: from wireframing to finalized designs
The guest feedback, baseline testing and competitive analysis combined revealed areas we were lacking: describing baggage requirements, displaying checked baggage allowance, showing how many bags have been previously added and displaying clear pricing.
Problem 1: Describing checked baggage requirements
I started by ideating the overall structure of the page - determining where baggage information would sit relative to the “Add baggage” interface.
Wireframes A and B show easy-stage ideation of page structure.
In the finalized designs, the standalone baggage requirements page is removed and replaced with an informational expander integrated directly into the baggage selection page, eliminating the need to move backwards in the flow. Additionally, a chart with baggage pricing information that is unique to the guest is integrated into the expander.
Wireframe A - Click photo to enlarge
Baggage requirements presented in a compact view above the “Add baggage” UI.
Wireframe B - Click photo to enlarge
Frequently-referenced baggage information is served up at the top of the page, while less-referenced information about special items appears at the bottom of the page.
Problem 2: Articulate free baggage allowance
In order to help status members and credit card holders feel confident that they can add free bags online, I explored using a dynamic messaging block to speak to these guests.
I expanded on this idea by implementing it for fare types and routes that include free checked bags as well.
Problem 3: Confirm pre-paid baggage
Sometimes the best design is no design - lots of problems can be solved with copy.
One of the biggest pain points that we had observed was guests were unsure if they needed to re-add their prepaid bags during check in (they don’t need to). To solve this problem, I added a line of copy (A) under the guest’s name showing the number of bags they have already paid for. Additionally, for guests who have prepaid for bags I disabled the “remove bag” button.
I also solved other small problems with copy including:
Calling out the refund policy (B), or lack therof and
Reminding the guest that bags cannot be purchased at airport kiosks (C).
Problem 4: Price bags dynamically
Checked baggage prices increase with each bag, or may not apply at all. By far the most impactful and revenue-driving improvement to come out of the ideation phase was adding dynamic pricing information that is unique to the guest.
Originally, I started by including a piece of copy displaying the price of the subsequent bag for each guest. (See wireframe A).
Wireframe A - Click photo to enlarge
In later iterations, I ended up integrating the price for each bag directly within the “add bag” buttons themselves. As the user adds checked bags to their flight, the button updates with the price for the next bag, taking into account variables such as airline status, credit card holder status and cabin. No need to scour WestJet.com to understand bag prices - it’s all included right in check-in, unique to the individual guest.
Dynamic pricing buttons added an estimated $961k to checked baggage revenue in the first 8 months of 2024.
The process
Post-launch testing
Although usability testing showed that the dynamic pricing buttons were intuitive to use, we wanted to make sure that they were actually making us money and inspiring guests to add more checked bags to their reservations.
Why we ran this test? (Our hypothesis)
If we remove the baggage fees from the baggage buttons, we will see an increase to our paid and free baggage attachment rates due to the guest’s reduced anxiety surrounding the price to add checked bags.
What change did we test?
We removed the fees from the add bags buttons on the baggage selection page.
Experience A (original design/control): Fees included within the add bags button.
Experience B: Fees removed from the add bags buttons.
What did we measure?
Primary Metric: Paid Baggage Attachment Rate
Secondary Metrics: Free Baggage Attachment Rate, Overall Baggage Attachment Rate
What were the results?
Experience B saw declines for both:
Paid (-3.2%) and free (-0.9%) baggage attachment rates with strong statistical confidence.
Considering 2023 as a baseline:
Experience B would yield approximately 13K fewer bookings with paid bags in 2024.
Considering the average paid bag revenue/booking of $71.50:
Adding dynamic baggage pricing has led to an estimated revenue of $961K on an annualized basis.
What’s next?
Looking to the future
In the next iteration of the baggage pricing flow, I will integrate special items such as sports equipment, infant/child equipment and excess baggage into the UI. This will save guests additional time by not requiring them to line up at the check-in desk at the airport, and will save WestJet costs by operating with a leaner check-in team.
It is also on the roadmap to integrate a similar view into WestJet.com so that guests without upcoming trips can accurately predict their baggage costs before they even book a flight.
Thank you for reading!
Are you interested in working with me or just want to chat design?
Please visit my contact page and reach out!