July 14, 2018
SuperValu is a major supermarket chain with stores right across the island of Ireland. Real Rewards is their loyalty programme that provides exclusive offers and rewards to their customers. Downloaded by over 100k loyal customers, their apps provide a positive user experience. But there’s still a lot of room for improvement.
During this phase, we’ll understand what exactly the problems are and who we’re solving them for. From this, we can create proto-personas that we will use during later stages of the process.
I conducted three methods of research to better understand users and the problems they face when using the app.
I began by observing users interacting with the app at the store checkout — studying the user “in the wild”. Here are the findings:
Their app store provides me with insight into what their users say about the app through user reviews. I’m interested in both the good and bad reviews as positive user reviews can also include recommendations.
“Great app. I love it that it has the vouchers all in the app, I always forget the vouchers at home but i have phone with me all the time so i can still use them.”
“Handy to use and keep track of my points to get free stuff or big discounts. Love it”
“Does what it says on the tin. Phone always keeps my vouchers etc on App, no more lost paper vouchers.”
“Could never find my rewards card.now I have it on my phone. Best thing ever.”
“An app years ahead of its competitors , very easy to use , dead handy”
“Love it! Easy access to all my vouchers. Don’t have to bring scraps of paper with me any more. Also if I forget my card I can scan it in the app.”
The Bad & The Ugly
“Useless. Checkout can’t scan barcode off phone.”
“Why not add the ability to add your card to wallet?”
“App doesn’t work properly on the self-service checkout.”
“Great app but annoying promotions on push notifications spoils whole thing.”
“What point is this app if I can’t see my total points or statements?”
“It doesn’t scan !!? Each barcode has to be manually inputted.”
“Cant scan barcode”
“Can’t scan at till and points not current !!!!”
Next up was a usability inspection of the app to identify any problems.
This evaluation identified the following problems:
From the research, I created the following personas, to help the rest of the process. Meet Kathy and Margaret.
From the research I’ve come to conclusion of the following problems users are facing:
Most of these problems can be solved by the following:
During this phase, we’ll envision a solution to the problems our users face. Then, we’re gonna prototype and test the solution.
Simplifying the navigation system so that users can navigate to the crucial parts of the app was the first task.
Using Tree Testing I was able to determine the following changes to the navigation.
A tab bar will replace the hamburger menu for the main high-level navigation system in the app. This will make it easy for users to explore and switch between high-level categories.
Since the app contained a lot of duplicated content I was able to reorganize categories to create 5 high-level categories instead of 9. I’ve grouped “Profile Details”, “Edit Profile”, “View Statements”, “Settings”, and “Help” under an “My Profile” category.
Focussing on what is important to the user I’ve replaced “Home” with a dedicated “My Card” category so that users have quick access to their card. I’ve renamed “Use My Points” to “Rewards” to better describe the content.
The next task is to quickly brainstorm ideas that will solve the problems our users are facing. The key here is quantity over quality.
I started with brainstorming navigation bar icons.
Now that I’ve got a idea of how the app will look, I want to create lo-fi wireframes. These will be used in the prototype.
Now I’m gonna “fake it” and turn the low-fi wireframes into a prototype. I used InVision to stitch together a working prototype that feels real enough so that it evokes an honest reaction from users. Click here to view the wireframes.
Next, I went about recruiting users who matched the user personas defined earlier and tested the prototype with them. I got them to complete the following tasks:
Where would you go in the app to view your previous statements?
42% of users viewed their previous statements by going to the My Profile tab. But the majority of users tapped on the circles containing their points (on the My Card tab) expecting it to show their previous statements. Ensuring that this is tappable will provide quick access to the users previous statements.
Where would you go in the app to claim your reward?
88% of users went to the Rewards screen to claim a reward. But a small number of these users first went to the Collect screen and then back to Rewards screen.
The remaining 12% of users expected to claim a reward on the Collect screen and never went to the Rewards screen.
Where would you go in the app to use a money back voucher?
95% of users were able to directly get to the vouchers screen and tapped on a money back voucher.
Where would you go in the app to scan your card?
The majority of users went directly to the My Card tab to scan their card. A few users did browse the app before finding their card.
Where would you go in the app to collect more points?
47% of users went to the Collect tab. Interestingly the majority of users went to the rewards tab expecting to collect more points there. Indicating that users are struggling to distinguish between claiming rewards and collecting points.
Renaming the tab from “Collect Points” to “Earn Points” will help users to distinguish between them.
Next steps for a project like this would be to release, analyse, and iterate. Not to mention the design is for phones so there’s still responsive design to take into account. Anyway, over time the app will go through many iterations and improvements based on user data.
If you enjoyed this article then you may want to read my other articles.
Once a month, I send out an ad-free newsletter where I share the latest articles, videos, resources, and tools that help you stay in the know and grow as a designer or digital creator.