Fetch Rewards aims to provide a seamless receipt scanning experience that lead to savings on every purchase.
With user experience at the forefront of our priorities, all design decisions are met with the intention of bringing delight and satisfaction into the user’s life.
The original receipt details experience was disorganized, unintentional, and didn’t elicit a desire to explore.
Receipt details serves two main purposes for different users.
The “quick glancer”: A user who takes half a second to gloss over the point value and moves on with their day.
The “go-getter”: A user who double checks that the points value and itemized data is correct. Ensures total accuracy. Wants to learn how to earn more points next time.
We want users to make scanning their receipts a daily habit.
We want an app full of go-getters.
This project is called “Receipt Details“.
Previous UI
Problem
The Receipt Details screen does not provide an information architecture that is easily understandable due to the lack of hierarchy in how items, points, and trip data is presented.
This leads to confusion, a lack of consistency and a separation from the product mission in being the easiest rewards app.
Challenge
We broke the problem down into three key objectives and took an iterative approach in completing the tasks.
By engaging in discussion that questions the norm, we were able to push the boundaries on future direction and uncover new perspectives.
Information Hierarchy
What pieces of information would a user want to see immediately?
Encourage Exploration
A user is most susceptible to retaining information when their interest is piqued.
Comprehensive Breakdown
When a user wants to learn more, how can we display everything in a simplified view?
User Goal
The user goal was to create an experience where any user, regardless of familiarity, could easily understand and process the point earning structure presented to them on the Receipt Details screen.
Business Goal
The business goal was to increase the average points value on submitted receipts. This would provide a glimpse into the user’s awareness and understanding on how to leverage the Fetch Rewards App.
Research
Empathizing with target users
We wanted to understand what aspect of the Fetch app was most influential to the power users. Without neglecting the notion that all users have different motives and needs, this gave us a good starting point in where to explore.
Data Analytics
Even with our metric coverage on this screen being minimal (Which we also set out to fix) we knew the majority of submitted receipts didn’t have any additional points beyond the receipt scan bonus - an automatic fixed point value for any receipt.
Design System
Within the fast paced environment at Fetch, multiple initiatives across different packs - a group of individuals from a variety of different fields hyper focused on one area of the app - were in flight. Through collaboration and communication, we ensured the integrity of the design system in place.
User Testing
Whether it was before, during, or after explorations, we continued to conduct unmoderated user testing sessions to see how users would interact with the ideas, prototypes, and designs we were mocking up. This was integral in maintaining a pulse on our direction and progress.
Explorations
The first step in exploring new direction was to re-think the hierarchy of items. Our users love to earn points. And we as designers are here to maximize their ability to do so. Regardless of UI, the first step was to create a hierarchy that surfaces the top point earning items first, down to the non-point earning items last.
Next, we explored the idea of tappable cards. The previous receipt details screen held a WYSISYG foundation at its core, but with new features and components within the Fetch design system, we pursued the use of tappable cards. This allowed us to simplify the initial presentation and confine the initial cognitive load to the most important pieces of information.
Lastly, we wanted to ensure the scalability of the design. Throughout the receipt scanning user flow, there are many edge cases - Missing information, digital receipts, incorrectly itemized receipts, wrong point value, etc. - in which case the scalability of design becomes even more crucial. By integrating the use of badges on the cards, and introducing different states (Physical, Digital, and Edit) we were able to associate the differences through simple UI variances and allow for continuous iterations when adding new features.
This process of design thinking also enabled us to make some backend changes to the process as well. Previously, the workflow from the receipt getting submitted to the user getting their points was very dependent on a singular workflow. With the change of moving to an itemized receipt details screen with badges that represent each type of point earning opportunity, we’re now able to take each item and take it through a series of checks to see if any matches occur. This allows for a more accurate reading and ability to track down the items journey.
Impact
We’re currently in the process of stress testing the feature within the Fetch employee base before ramping up the feature into the wild. It’s set to release at the beginning of Q2. The luxury of testing from a pool of ~700 internal users that range from quick glancers to go getters and everywhere in between means we’ll clean up the final few pieces before providing the most optimal experience to the general public.
There will always be aspects of this flow that can be improved, and we will continue to iterate and provide clarity into the world of Fetch Rewards through quick iterations and prioritizing reactions in user behavior and data points. But having gone through this project with a robust process alongside the talented individuals on the Scan Experience team, I’m excited to be a part of what is hopefully a momentous shift in the understanding of the product.
Team
DRI (Directly Responsible Individual) - Emily Rich
Product Manager - Kin Isamov
iOS Developers - Shawn James, Chris Withers
Android Developers - Darryl Johnson, Cindy Liang, Purva Dalvi, Kapindran Kulandaivelu
Backend Engineer - Vaibhav Joshi
Quality Assurance/SDET - Urvish Gajjar, Gabe Lilly
Data Analyst - Josh Hernandez
Product Designer - Taiki Ishii
LinkedIn profiles attached for each of these talented individuals.