Unlocking 25% More Conversions with In-App eVoucher Redemptions

AIR MILES eVoucher redemption redesign
Project Brief
AIR MILES is one of Canada's largest loyalty rewards programs, helping millions of collectors earn and redeem Miles on everyday purchases. Users couldn't complete a Gift Card redemption in the AIR MILES app. After navigating to the Gift Card listing screen, they were redirected to the website to view the product details page and checkout. This created friction in the experience and was a barrier to redemptions. As the sole UX designer on the project, I worked closely with product and engineering to re-design the experience e UX design effort to bring the full browsing and checkout experience into the app, removing friction and driving conversions.
My Role
UX Designer
Team
1 Designer, 3 Developers, 1 SPM, 1 PO, 2 QAs
Timeline
Mar – June 2025
UX Design App design Component design

Collectors couldn't redeem eVouchers without leaving the app

The AIR MILES app offered limited eVoucher browsing and no way to complete a redemption. Beyond the eVoucher listing screen, collectors were redirected to the AIR MILES website to view eVoucher details and complete a purchase. My product partner and I took a multi-faceted discovery approach to deeply understand the Rewards space, and uncovered three core pain points:

Program complexity
~50%
didn’t think it was easy to redeem

Too many steps and redirects caused drop-off before completing a redemption.

Lack of relevancy
30%
felt rewards were tailored to them

Collectors couldn’t easily find rewards that matched their interests or Miles balance.

Low value perception
30%
felt rewards were worth the Miles needed

Collectors weren’t sure what their Miles were worth or what they could get.

In-app checkout had the potential to unlock 25% more conversions

Despite being redirected to the website to complete their redemption, collectors coming from the app made up nearly half of all conversions. These were already engaged collectors. They had downloaded the app, were actively browsing rewards, and were motivated enough to push through the friction of being redirected to web. Giving collectors the ability to browse AND redeem in the app represented a clear opportunity to increase conversion rates.

2.8%
App conversion rate
5.5%
Web conversion rate
The Solution

Enhancing the browsing experience

The original product listing page offered limited support for browsing and did not surface critical information that collectors use to support purchase-related decisions such as price or promotions.

To improve the browsing experience, I re-designed the eVoucher cards to surface high-value information upfront, including "new" and "promotion" badges and a clear "starting at" Miles amount. Market research showed that ~50% of redemptions are spontaneous, so I introduced a quick filter that instantly surfaced rewards collectors could redeem with their current Miles balance.

My hypothesis was that making this information visible directly on the listing page would reduce friction, decrease drop-off, and ultimately drive more redemptions.

Original Listing Screen
Placeholder image 1
Re-designed Listing Screen
Placeholder image 2
A filter to quickly show eVouchers you can redeem for now Enhanced cards showcasing high-value information upfront

Adding filters to increase click-through rates

Based on web analytics, the click-through rate for product detail page views was significantly higher when a user filtered on the product listing page. This led to the assumption that adding filters to the PLP in-app would increase click-through rates and ultimately conversions.

I referenced Baymard Institute's UX guidelines for e-commerce filtering to validate which filters to include, how to group them, and how to present default and disabled states for scannability.

I defined filters for Miles range, brand, category, and denomination. Filters are interdependent: selecting an option in one dynamically updates the others to avoid dead ends. Disabled options remain visible with a count of "0", and enabled options are prioritized and sorted alphabetically.

psychology AI-Assisted Workflows

I used AI (Co-pilot) to help flush out edge cases including empty states and dynamic filter logic. This accelerated the design process and helped me catch scenarios I might have otherwise missed.

Interdependent filter logic to prevent dead ends
How search interacts with the quick filter
The Solution

Optimizing the product detail page

The eVoucher product details page didn't exist in the app. To view the product details, collectors were redirected to web. Existing designs for the product details page were legacy designs from years ago and an initial redesign of the screen had been completed a few months prior. I iterated on this version - refining the layout, simplifying the UI, and focusing on the content hierarchy and what information was most critical to the collector at this point in the browsing flow.

Previous In-App Design
Previous product detail page design
Optimized Design
Optimized product detail page design
Showed the collector's balance at the top of the screen Simplified the value tiles and decreased the size to display 4 across Gave the "Total Price" more visual weight

Designed net-new components within brand guidelines

Working within established brand guidelines, I designed 10+ net-new components that gave the in-app experience a cleaner, more polished feel. I handed off detailed documentation covering states and behaviour, and partnered closely with developers through build and implementation.

Interaction model documentation showing filter logic and edge cases

Hand off documentation of the filter and sort functionality

The filter and sort functionality had a ton of logic that needed to be communicated to developers. I created detailed hand off documentation that captured default states, interaction logic between search, sort and filter (including edge cases), and dynamic behaviour and interdependencies between the filters themselves. This served as a single source of truth and ensured alignment between product, engineering, and design.

Interaction model documentation showing filter logic and edge cases
Future enhancements

Prioritizing user convenience post-checkout

As a future enhancement, we focused on the post redemption experience for collectors. We designed an order history page where collectors can track the status of their evouchers. We also plan to implement notifications to notify collectors when their evoucher is ready to use.

evoucher order status tags evoucher notifications