Increasing app installs by 600% on Fave's new landing page
Timeline
Mar - Apr 2021
PLATFORM
Responsive Website
MY ROLE
Product Designer
Webflow Developer
Mar - Apr 2021
Responsive Website
Product Designer
Webflow Developer
Fave is Southeast Asia's fastest growing fintech platform that helps consumers save, while FaveBiz helps merchants grow their business. In the new landing page, we set out to solve the problems below within 1.5 months. The results were amazing.
Today, over 90% of our users are on the Fave mobile app. Due to the low usage, we never prioritized improving on or building new features for the website.
It has not gone through a redesign for 4 years. The design language is not consistent with the app. The old landing page shows Fave Deals only, visitors do not see other product offerings like eCards, FavePay.
Since the Groupon days, Fave has not set up a corporate page to communicate what our company is about, to our investors, merchants and consumers.
We want to drive more app downloads since our main product focus is on the app. In Indonesia, our consumers mostly use Fave via the mobile web browser. We wish to convert web users to the app so they enjoy a better experience.
To give clearer messaging. Throughout the years, our products have scaled beyond Deals.
Today, over 90% of our users are on the Fave mobile app, but we still maintain our web presence for the remaining 10% users. We want to convert users from web to app, so that they enjoy a better experience, and we could focus our resources on the app instead of maintaining several platforms.
To attract potential merchants who wants to use FaveBiz to grow their business.
To entice potential candidates who would like to join the Fave family.
Hooray, we launched the landing page on April 7, 2021! For confidentiality reasons I have omitted the actual values for these metrics.
The moment it goes live, we immediately saw a 50% increase in downloads of our app from our landing page, compared to the old website. After 14 days of going live, we saw a 600% increase in app downloads.
Visitors are mainly from Singapore, Malaysia and Indonesia.
The share of transactions via the website decreased by 50% (since users moved to the app), while our overall transactions remained stable.
Bounce rate is defined as the percentage of visitors that leave a webpage without taking an action (such as clicking on a button). The healthy bounce rate on our landing page is a sign that the content is relevant, engaging or clear to visitors, thus 65% of our users interacted with the page before leaving.
Here's the device usage of the web traffic.
We kicked off a design sprint together with the lead Product Manager.
Using Miro as a remote collaboration tool, we gathered inspiration of how other forward-thinking brands craft their landing page, and shared what we like about them.
Then, we did a quick solution sketching together to end the sprint. This mini design sprint was condensed into 2 hours as our schedule were packed.
On a separate session, we established 4 design principles for the landing page to make sure we design based on these principles. These principles are centered around our consumers—How consumers portray us as a brand.
We started sketching some crazy ideas on our minds. Our focus at this stage is to diverge first, converge later.
This is how the early wireframes looked like. On the left, we mapped out the purpose of each section, aligning with our design principles. The primary goal is to convince users to download the app.
We then turn these early ideas into high fidelity designs. We experimented with different colors, shapes, layouts. But it felt all over the place, so we continued to refine these designs.
Here's the outcome after several iterations, though this is not the final design. We needed a design that is solid enough to kickstart the user test, so we can learn what people really think about the landing page. We fail fast, in order to learn faster.
I conducted user tests with 5 people outside Fave using Maze's Survey tool.
To avoid bias, I changed the brand to 'Plus', swapped the brand color to blue, and tweaked the copy so responses are more accurate.
This is what the survey looks like. It's easily shareable via a link.
I consolidated the test results on Notion. A heatmap is also generated to help us understand how people interact with the landing page.
Here are the results!
From the heatmap, we found that 20% of users scroll to the bottom. We were worried people won't notice some clickable elements, but the heatmap results proved otherwise.
By asking specific questions in the survey without revealing that we are Fave, we found that people were able to understand what the product is about.
In Malaysia, there are many e-wallets so people tend to consider Fave as one too, but we aren't. So in this landing page, we tell people that we don't store users' money. We also educate users to stack their rewards, leverage on Fave's full potential and unlock more savings.
And then, back to the artboard. I continued to iterate the designs to strengthen our value propositions and ensure all messaging are clear as crystal, while driving app downloads.
Before the redesign, there was lack of focus on what Fave offers. The website was cluttered. The design language was inconsistent with the Fave app. It does not do justice to Fave's unique value proposition.
Here's a detailed walkthrough of what I improved post-testing.
You never get a second chance to make a good first impression.
Social proof can be seen throughout the landing page. We've showcase familiar brands that visitors instantly recognize, real metrics of total savings from Fave's consumers, real app reviews and real testimonials.
We placed different hero images in the mockups so the team can visualize how it looks like. We voted on the image that best reflects a smart, savvy Fave user, who's excited to save with Fave.
To strengthen the funnel of the landing page, we've added a hanging carrot (a promo code) to entice visitors to download the app. It drives delight and a sense of urgency.
We centered our messaging around our target audience and what they care about—Savings and Convenience. How? Simply spend, stack and save. This separates us amongst our competitors.
People will forget what you said, but people will never forget how you made them feel. — Maya Angelou
Though the experience is digital, we want our visitors to feel like we are engaging in a human conversation. The copy is designed to be friendly and positive.
Finally, an About page... after 4 years! Investors, merchants, customers can know more about Fave now. This page is designed to look more serious compared to the homepage as we are catering for different use cases.
I built the responsive landing page on Webflow.
At that time, the acquisition of Fave by PineLabs was about to be announced and we were anticipating a big push in public attention to Fave. Hence we speed up building and launching this landing page, which was initially planned for a couple of months later.
To make sure visitor from different countries see relevant content, our web development team helped build a logic that redirects them to their respective countries' landing page.
Our web development team also helped build a logic whereby if a visitor arrives at 'myfave.com', they will be redirected to 'discover.myfave.com'. Then, if they click on 'Browse deals' anywhere on the landing page, they will be able to browse deals as usual. They still get to enjoy the same, familiar deal shopping experience. The next time they go to 'myfave.com', they will no longer see 'discover.myfave.com' since we already know they prefer to browse deals on the web.
Here are our future plans for the landing page:
After launching, we saw that our metrics still show a large number of people browsing myfave.com than myfave.com/deals. This is due to many of our visitors landing on Deals page via Google finding a direct offer. The share of digital transactions coming from the website is also not shrinking at the pace we expected.
We will ensure information such as offered deals, promo codes are up to date.
We will further reduce the features on myfave.com to drive app downloads. For example, if a user wants to buy an eCard, they will need to download the Fave app to do so.
I really enjoyed the process from ideation, design, testing to development of this project. Couldn't have done so without the amazing team at Fave!
Thank you for reading through! Hope you enjoyed learning about my design and thought process. :)
If you'd like to see more, you can check out my case study of Fave's App Redesign.
