2 PMs
2 UX Designers
1 - 2 Software Engineers
Mobile App
5 weeks
Our main objective is to support the Dish Cult Rewards in expanding its membership growth and ensuring its success in the UK. To accomplish this, we believe a referral program initiative would be an effective way to attract new users while also promoting user engagement and retention.
We shipped a referral program feature for the app through careful optimisation of the user flow and testing the effectiveness of our designs. Our design solution was a delicate balance between functionality and technical feasibility under manpower constraints.
Dish Cult is a B2C restaurant booking and discovery platform with over 3 million users in the UK and Australia.
Dish Cult Rewards is a point-based loyalty program that incentivises diners to use Dish Cult to discover, book and dine at participating restaurants, rewarding them for their repeat purchases. It aims to drive spending within the network of Dish Cult participating venues.
To ensure a steady stream of new members to our loyalty program, and improve user engagement and retention, Dish Cult Rewards plans to introduce a referral program initiative. The initiative aims to encourage existing Rewards members to refer their friends and contacts to join the app as fellow Rewards members by offering point-based incentives.
We worked with TalonOne, a loyalty & promotion engine to integrate their referral software API into our backend.
According to Nielsen research, 92% of consumers trust referrals from people they know. They are four times more likely to buy when referred by a friend.
I collaborated with another designer in this initiative.
My role was primarily in:
(This feature is only available in the UK market and UK users.)
We need to ensure that:
Advocate
• needs to understand how to earn points and share their code
Friend
• needs to easily understand what Dish Cult / Dish Cult Rewards is
• how to become a friend (and earn points for you and their advocate)
1. Conversion rate
Increase in the number of new Rewards member:
2. Adoption rate
Increase in app engagement:
3. Acquisition rate
Increase the number of Dish Cult members:
Firstly, we looked at various platforms with referral programs for inspiration on how they work, their UI design, navigation and functionality.
Key takeaways:
We plotted the flows for both the advocate and friend scenarios, refining and optimizing constantly.
I collaborated closely with the product managers and engineers to understand the processes and technical limitations involved and iterate the user flows with a user-centred approach in mind.
Our stakeholders requested to simply reuse an existing input field and hand off the UI screens.
The reason was that we were short of technical manpower. This was due to the reallocation of resources to a top-priority B2B project, leaving only 1-2 software engineers available. Additionally, none of the engineers specialised in front-end development.
Reusing the same component would allow them to simplify their coding process and speed up the development time.
However, the existing components needed to be more suitable in terms of design, functionality, and intended use cases.
What should we do?
We negotiated to repurpose the existing component and create some mid-fidelity options from it. We would validate the most effective design through usability testing and finalise the UI component at the next stakeholder meeting.
The goal was to validate our design decisions with users as early as possible, to avoid any potential business risks and cost of failure associated with UX issues. At the same time, repurposing can allow the engineer to keep the same code behaviours and the project development within scope.
The stakeholders started feeling more open-minded about our approach.
We conducted a usability test to validate our user flow, designs and components, using a set of test questions I crafted.
Total participants: 25 in the UK (10 male, 15 female)
Age group: 25 - 49 years old
Goals:
Overall we received clear results from our tests and positive feedback regarding function and ease of navigation.
As for the best design option, 60% of the participants preferred option 3 due to its clear and inclusive design.
Here is what the other participants had to say about option 3:
We presented our test results and insights to the stakeholders, which boosted their confidence in our design decisions and user-centric approach.
Great news! The presentation was a huge success and it was able to quickly align everyone together.
It's time to transform those mid-fi wireframes into stunning high-fi wireframes.
Following a round of technical feasibility checks with the engineers, I made some tweaks and optimisations to the user flows with 5 different use case scenarios in mind.
Meanwhile, my design teammate had finished a few graphic options for the referral masthead.
We were ready to test out and validate our designs and flows.
Total participants: 15 in the UK (7 male, 7 female, 1 not specified)
Age group: 25 - 45 years old
Goals:
Key findings:
After we handed it off to the development team, we continued to make small improvements following our user acceptance tests (UAT).
The referral feature finally went live after two months of development. It contributed to an excellent 25% conversion rate since the launch of Dish Cult Rewards for two consecutive quarters.
Design within constraints
This experience reinforced the importance of designing while keeping the technical feasibility in mind. It would not be wise to design UI elements that could take too long to achieve in development. However, as a product designer, I must still ensure aesthetics meets functionality in the end product.
Learn to speak the language of product managers and engineers
I found the art of seamlessly switching between various “languages” to communicate with diverse stakeholders to be an underrated soft skill. Product managers tend to be success metrics-driven and concise in the way they speak. As for software engineers, they are all about finding the most efficient way to build a product. If I do not speak the language of the function that we are interacting with, communication and alignment can become more difficult as a result.
Designed & Developed by Daniel Aw