Cleo

From Fragmented to Fluid: A Design-led effort to boost Cleo Grow conversion

Company

Cleo

Year

2024

Project Type

Feature development

Scope of Work

Strategy, UX, UI

Timeframe

8 Weeks

Platform

iOS, Android

Cleo is an AI assistant designed to change its users' relationship with money. She (Cleo) turns the complexity of your financial life into a conversation, the same kind you’d have with a friend. With a simple chat, Cleo can automate your money life and remove the stress of decision making with data-driven and deeply personal insights based on your specific needs and financial history to help users in ways their banks struggle to.

Executive summary

Context

We formed a new product pillar to launch Cleo's third subscription offering—Cleo Grow. The pillar was made up of two squads: Savings and Habits. As the Lead Designer for the Savings squad, I was responsible for driving the user experience of our product. At the time of this project, both squads focussed on a shared pillar OKR: achieving $1M in ARR from Cleo Grow’s subscription.

Problem

The free-to-paid conversion rate for Cleo Grow was significantly below the target needed to achieve our pillar-level OKR of $1M in ARR, as well as the company’s broader goal of diversifying revenue streams. Each of the Grow squads had separate onboarding flows, leaving users with a lack of correlation of the two core features of the subscription. This approach also limited other internal teams’ ability to leverage a unified entry point for campaigns and experiments aimed at driving growth.

How might we fix the Grow experience to boost conversion while eliminating bottlenecks for other teams?

Role & responsibilities

I led this design-driven initiative, which required close collaboration across teams, strategic prioritization, and a strong focus on maximizing revenue growth through purposeful design and execution.

Objectives

Enhance the clarity of the value proposition

Increase Cleo Grow conversion

Enable other internal teams for their tests

Approach

Create a unified Grow onboarding experience and joint entry point to replace existing siloed flows for Savings and Habit with a 'Show, Then Tell' experience.

Snapshots

Outcomes

100%

increase in Grow conversion

66%

increase in Challenges set up

45%

increase in Savings accounts set up

200%

increase in conversion for Cash Advance intent users

45%

increase in conversion for Improver intent users

Challenge

Our free-to-paid conversion rate for Cleo Grow was well below the target needed to achieve our Pillar-level OKR and the company's broader goal of diversifying revenue streams. Each of the Grow squads developed independent onboarding flows for their respective products, which caused a disconnect for users, leaving them unclear about the overall value Grow provides.

User feedback since the Grow launch consistently indicated that the value proposition wasn’t clearly communicated. Only 25% of users entering the funnel create both a challenge and set up a savings account, but we knew from data that engagement with both tools is a driver for retention.

In addition to low conversion rates and ambiguity around the offering's value proposition, this siloed onboarding approach created challenges for other internal teams like Marketing and Growth. There was no one entry point for their campaigns and experiments, as they could only direct users to either the Savings or Habits entry points, despite promoting the Cleo Grow subscription as a whole.

Ownership

I raised my hand to lead this project from discovery to ship, in collaboration with cross-functional partners across the pillar.

My goal was to set clear expectations with product partners, come forward with strong product recommendations backed by research and data, and eventually deliver solutions that create impact for the pillar and Cleo.

Kickoff

I initiated this project by facilitating a kickoff meeting with a small, cross-functional work stream, including key representatives from Product, Design, Copy, Research, Engineering, and Data. To streamline collaboration and create momentum, I created a Miro board to document our process and outline the next steps, ensuring transparency and alignment throughout the initiative.

In our initial meeting, we reviewed the project brief, assessed the current state of each team's onboarding flows, and jot down key questions.

Drawing from user insights and product intuition, we developed a core hypothesis to guide the early stages of the initiative:

Enhancing the clarity of the value proposition for both Challenges and Savings will drive increased Grow conversion, adoption, and retention.

Recognizing that the main user challenge was a lack of awareness around the full scope of the Grow offering, we decided to streamline the onboarding process by creating a unified flow. This would replace the individual product onboarding experiences, aiming to improve user comprehension of the subscription as a whole.

We managed to quickly sketch and align on a high-level user flow, establishing the foundation for our new onboarding experience.

Scope

I refined our initial, rough flow into a slightly more detailed user flow and scope proposal. In a asynchronous follow-up with the core work stream (PM, Design Manager, Engineering Lead), I presented my recommendations for the initial scope and next steps. Together, we finalized the scope, defined key deliverables for the next phase, and identified stretch opportunities.

User Flow

We landed on a two-part flow: a Pre- and Post-conversion experience, separated by a Paywall and Subscription flow, followed by individual Feature Onboardings. Our primary focus was on the Pre- and Post-conversion flows, as these would be entirely new, zero-to-hero user experiences. The Paywall was identified as a potential stretch goal, given that we already have an existing Paywall in place that can be reused. Redesigning the Subscription flow was out of scope since it follows a standardized format across all subscriptions. Similarly, optimizing the individual feature onboardings will be handled by the respective squads outside of this project.

Workshop agenda

I also presented how I was going to structure our upcoming ideation workshop, alongside the key outputs which I believe would drive this collaboration forward.

Ideation

Setup

I facilitated an ideation session with a group of nine colleagues with varying roles from across the Grow pillar.

Part 1 – Refreshers

We kicked off the workshop by reviewing the key user problems, then moved on to align everyone on the previously agreed approach and scope for the onboarding flow.

Part 2 – Brainstorming

Next, we moved into an activity focused on brainstorming value proposition statements. The aim wasn’t to land on a single, definitive statement, but rather to spark creativity, ensure alignment, and keep our unique selling points top of mind as we transitioned into the sketching phase of the workshop.

Part 3 – Sketching

The final part of the workshop was a sketching activity to generate concepts for both the Pre- and Post-conversion flows. As a group, we developed several distinct ideas, and after everyone presented their concepts, we collectively voted on the strongest ones.

Part 4 – Actions

To wrap up the workshop, we discussed and clearly defined next steps and assigned actions to specific team members.

Wireframes

My next step was to synthesize the sketches based on our discussion and votes. I came up with three wireframe flows that I shared back with the full work stream for feedback and comments.

Concept 1 – "Tap + Path"

Concept 1 provides users with an interactive way to reveal how specific Grow features help them save money and take control over their spending habits, followed by an outline of the next steps in their Grow journey.

Concept 2 – "Amount + List"

Concept 2 quickly piques a user's attention by presenting the potential total savings upfront, followed by a clear table view of the benefits of the Grow subscription compared to our free offering.

Concept 3 – "Carousel + Toggle"

Concept 3 outlines the Grow value proposition and features in form of a rotating carousel, before a user can toggle between Free and Grow offerings to see and compare their potential savings.

Prototypes

After presenting back the rough wireframes and receiving some feedback and suggestions for small tweaks, I turned the wireframes into higher-fidelity screens and paired with a content writer to get the flows test-ready with real users. I plugged in the pre-existing Subscription and Paywall flow as well as the first screen of the onward journey for a full end-to-end experience.

Concept 1 – "Tap + Path"

Concept 2 – "Amount + List"

Concept 3 – "Carousel + Toggle"

User Testing

We ran a series of unmoderated tests for each of the three prototypes with both qualitative and quantitative prompts. With the help of Researchers and other work stream members, I synthesized the findings to identify the strongest concept of the three.

After synthesizing everyone's notes, I proposed to move forward with the first flow.

Users showed the highest willingness to pay, alongside the best level of understanding and clarity of the overall value prop. However, I identified some patterns of concerns and pain points that we needed to address before launching this experience.

Iteration

The 'Hook' screen was arguably the biggest sticking point of the experience and the screen that took the most iteration and refining to get right. I continued to explore lots of different ways to display it and worked closely with Product and Copy to ensure that the design effectively supported the message we needed to convey in order for this experience to be a success.

We found that the most engaging and impactful way to communicate the value proposition was through a user-tested 'tap-and-reveal' interaction, where users could calculate their savings by tapping on features and revealing their monetary impact.

Given the positive feedback on the piggybank illustration, I kept it as the focal point of the screen. Utilizing components from our design system ensured consistency while allocating ample space for copy needs.

Output

To bring it all together and deliver a launch-ready flow, I made the following key UX and UI changes, while maintaining a tight feedback loop with design partners, engineering and product throughout my design process
‍
• Add a loading and a transition screen (tech requirement)
• Create instructional overlay to ensure users know how to interact with the product
• Ensure enough space for the piggy bank to grow
• Change the paywall layout to introduce accordion component for more copy

I presented the final flow back to the core members and ran a handover session with engineering teams.

View prototype

Success metrics

We ran this new flow as an A/B test with a 50/50 split, whereby Group A (Control) saw the previous experiences for each flow, and Group B saw the new unified experience.

We saw incredible results from this initiative. By designing and shipping a unified onboarding experience for users exploring Cleo Grow and entering the subscription funnel, we were able to increase conversion and lower cancellations significantly, and made big leaps as a Pillar towards our OKR.

100%

increase in Grow conversion

66%

increase in Challenges set up

45%

increase in Savings accounts set up

200%

increase in conversion for Cash Advance intent users

45%

increase in conversion for Improver intent users

From Fragmented to Fluid: A Design-led effort to boost Cleo Grow conversion

Executive summary

100%

66%

45%

200%

45%

Challenge

Ownership

Kickoff

Scope

Ideation

Wireframes

Prototypes

User Testing

Iteration

Output

Success metrics

100%

66%

45%

200%

45%

Other projects