Clash: the onboarding of an app that gathers all your benefits in one place
Clash is an Argentine app that gathers in one place the benefits a person already has: from the bank, the health plan, the fintech, the employer. I designed its onboarding end to end: research, definition, prototype and user tests.
What Clash is, and for whom
A benefit is a discount, a promotion or a chance to save. Almost everyone has several and does not use them: from the bank, the health plan, the digital wallet, work. Clash gathers them in a single app, on iOS and Android.
The app was born in Rosario inside Rosental Inversiones, a very well-known Rosario group with businesses in capital markets, real estate and linked companies. La Capital, the Rosario newspaper, covered the launch: Rosental created an app that concentrates all the promotions.
My brief was the onboarding: the path from the moment someone installs the app until they see their benefits. How do we ask a person for their banks, their health plan and their interests without losing them before they see the value?
The starting point
The onboarding the app had when I started, with its real screenshots: three promise screens, a six-field sign-up, a code by email and a home that only then asks for the benefits.
I audited it screen by screen: I marked every decision the system forces, every action, where people can drop off and where they have to leave the app to continue. Three drop-off points before seeing a single benefit: the long sign-up, the e-mail code and a home with nothing of their own.
The onboarding I designed
Two steps and a promise. First the services (banks, health plans, universities, phone and internet), with a search box and a “don’t see your bank? Request it”; then the categories of interest, as chips. A wait that says what the app is doing, and a home built from what the person chose.
I prototyped it in Figma, low fidelity and under a provisional name, and tested it with users before drawing anything in high fidelity. Here it is rebuilt with Clash’s identity and programmed: whatever looks like a control works.
The prototype goes through the whole path: first what the app had in 2021 (the three screens, the sign-up and the code) and, after the code, the onboarding I designed, up to the home.
- Search and “Request it”.Nobody is left out because their bank is not on the list: they request it and the app lets them know when it arrives.
- Check mark and counter.Every selection is visible and counted: in the tests people asked for clear feedback and a way to verify what they added.
- Search and “Explore”.Two ways to reach a benefit, searching or browsing, because both came up in the tests.
The process
Ten weeks between April and July 2021, in two diamonds: research and define, prototype and redesign. Everything that follows is the path to the prototype above.
- Research2 weeks · diverge
- Review of the benefits
- Audit of the existing onboarding
- Stakeholder map
- Benchmarking
- Surveys
- Interviews
- Definition2 weeks · converge
- Empathy map
- Mind map
- Clustering
- Insights table
- User personas
- Flowchart
- Prototyping4 weeks · diverge
- Low-fidelity prototype in Figma
- Test script
- User tests
- A/B testing
- Redesign and delivery2 weeks · converge
- Clustering of findings
- Redesign of the screens
- Delivery in Figma, with the interactions verified
Two diamonds: diverge to understand and converge to define; diverge to test and converge to deliver. Ten weeks in total.
The research
Four weeks: review of the benefits, audit of the existing onboarding, stakeholder map, benchmarking, surveys and interviews.
What a benefit really is
I started by taking the object apart. Its many attributes are what make the system complex: until you understand what a benefit is, you cannot decide what to ask the person and in what order.
A benefit, taken apart
- Stackable?
- Cap?
- Minimum purchase?
- Free shipping
- Monday to Thursday
- While stocks last
- 2 for 1
- Points redemption
- Applies throughcard, program, wallet, platform, health plan or coupon
- Accessemployees, customers, members
- Availabilitya period, certain days of the week, while stocks last
- Condition2 for 1, free shipping, financing, points redemption, discount with a minimum purchase
- Capper user, per purchase or per period
- Categorysupermarkets, food, vehicles, clothing, technology, health, education
Six dimensions and dozens of combinations: that is why the system is complex and why the onboarding has to ask for little, and ask well.
Who creates the benefit and who uses it
Five actors: the users, the aggregators (banks, health plans, employers), the entities (the merchants), the competition and the benefit in the middle.
Stakeholder map
- Aggregators → benefitThey are almost always the creators; sometimes in alliance with the entities.
- Aggregators ↔ entitiesWin-win alliances: they share costs and bring each other customers.
- Competition → usersIt links users to benefits directly and gets between the user and the entities. Part of the competition creates its own benefits.
What the other apps do
I compared seven apps. Each focuses on one of three things: when to buy, where to buy or what to buy. The question that remained: how does the onboarding teach the app’s value while it collects information?
| App | Focuses on | Empowering tool |
|---|---|---|
| Yelp | where to buy | history, interactive map |
| Mercado Pago | what and where to buy | history, discover shops, earnings viewer, interactive map |
| Brubank | how much you spend | understand your spending, a tracker that keeps you within your limit |
| Tindeo | what to buy | wish list |
| Beneffit Pro | where to buy, at what price | price comparison between entities, with a map |
| Black Friday | when to buy | wish list |
| Discount Calculator | how much you save | discount calculator |
Empowering tools, by what they solve
- Past spending“History” in Yelp and Mercado Pago; “Understand your spending” in Brubank
- Upcoming spending“Wish list” in Tindeo and Black Friday; “Discover shops” in Mercado Pago; Brubank’s tracker
- Money earned“Earnings viewer” in Mercado Pago
- Money saved“Calculator” in Discount Calculator
- Decision-making“Interactive map” in Mercado Pago and Yelp; “Price comparison” in Beneffit Pro
Benchmarking insight
- None focuses on the benefit.They focus on the product and, by extension, on the category: when, where or what to buy.
- None connects with the aggregators.The bank, the health plan and the employer are left out: that is Clash’s place.
- All of them empower with information.Tools to understand what was spent, plan what comes next and decide. The onboarding has to teach that value while it collects data.
Surveys
I asked which aggregators they are customers of, whether they use the benefits and how they find out. Almost all are bank customers; most use the benefits “when they notice” or rarely, because they don’t find out.
- 92 %Banks
- 60 %Health plans
- 57 %Companies
- 48 %Fintech
- 19 %Employer
- 18 %University
- 37 %When they notice
- 30 %Rarely: they don’t find out
- 21 %Yes, they use and know them
- 33 %E-mail or notification
- 18 %At the shop
- 16 %They search and read
- 15 %Someone tells them
The size of each circle is the percentage of answers. My own survey for the project, May 2021.
Interviews
The interviews surfaced the relationship between income and benefits, and it is not linear.
Relationship between monthly income and benefits
- It is not linear.It depends on interest, time invested, habit, education and the information the person has about the possible benefits.
- When income risesthe possible benefits increase, they are even “better”, and the person can choose. Frequency of use depends on interest and habit.
- When income fallsaccess falls and frequency rises: supermarket cards, coupons and the most popular benefits.
- The goalis to manage to buy a product, or to buy a product in order to buy another: miles, points.
A benefit is worth it for two reasons and at two moments: when it coincides with a need and, above all, when it coincides with a sacrifice, like a big purchase or one in installments.
Why are they valuable?
- 50 %
When purchasing power is scarceTight budget
- 50 %
Overwhelmed by ineffective information(Lack of) knowledge
When are they valuable?
- 30 %
When I need something and there happens to be a discountCoincides with a need
- 70 %
On big purchases or for installmentsCoincides with a sacrifice
What would they want?
- Centralizationthat it be complete
- Clarityto understand quickly
- Filtersplenty of them
- The essentialslike the supermarket card
- Something extraordinarythat there be something different
- Transparencyno fine print
The definition
With all of that I built the empathy map, the mind map, the clusters and the insight table, and from there came two personas and the flow.
PERSONA 1
“I need to save on everything I can”.
Mother of three, everyone works. Buying things is hard for them, but they manage. She learned to always look for the best deal.
- Pain
- “I’m poor”. “There are people above who cheat you or take advantage”. “I got used to watching my spending all day long”.
PERSONA 2
“I don’t have time”.
He is 28 and supports himself. He studies, works, runs around. He knows there are discounts, but doesn’t pay attention to them.
- Pain
- “I don’t realize I could pay less”. “Everything about the bank bores me”. “I almost always find out too late”.
The onboarding flow: welcome, authentication, choose the aggregators, choose the interests, choose the notification channels, an animation while the app searches for benefits, and the home. “How it works” stays within reach from the welcome screen for those who want to understand before signing up.
The flow
- Welcome
- Authentication
- Select aggregators
- Select interests
- Channel selection
- Animation: searching
- Home
- Welcome
- How it works
- back to Welcome
- What the person is asked for
- The wait
- The arrival
- The shortcut for those who want to understand first
User testing and A/B
Two hypotheses: that people manage to connect their services and choose their preferences with a positive experience, and that they understand Clash’s value during the onboarding.
How I tested it
A Figma prototype, sessions over Meet with a silent observer, and role play: each participant received a profile with their banks, their health insurance and their phone company, and the task of creating the account. In Maze I integrated the five-second test and the Borg perceived-effort scale; to that I added think-aloud and the echo, boomerang and Columbo facilitation techniques.
| Measure | How it is scored |
|---|---|
| Success rate | 1 if they complete the task, 0.5 if they complete it only partly, 0 if they do not finish it. |
| Efficiency | Time spent on the task, average in seconds. |
| Quick understanding | Result of the five-second test: 1 if they understood, 0.5 if they hesitated, 0 if they did not understand. |
| Perceived effort | A direct question on a scale, from very light to very heavy, and why. |
| Quotes and notes | Clustered at the end, with triangulation of observers and of methods. |
What I found
- GoalConfirm a positive user experience and identify breaks in the expected flow.
- Task for the user“Set it up so I can see my benefits”.
- ParticipantsFour, chosen with a two-way table: money and time. Whether they read about benefits or not; whether they support children, support themselves or someone supports them.
Insights
- Need to verify their data
- Request for clearer feedback
- They expect a home tailored to them
- Search or explore: both
A/B: "How it works"
For the screen that explains the app I tested two versions. A, general: “how to buy a product or service and apply a discount”. B, specific: “connect accounts and services, all from a single app”. The task was to see how it works and say what they understood.
What they understood about the app after seeing each version of “How it works”. With B, everyone named their own benefits: it went into the redesign.
What I took away
- The object before the screen. Until I took apart what a benefit is (cap, condition, access, category) I could not decide what to ask the person for, and in what order.
- Measuring the qualitative. Four people are enough to find where a flow breaks, if every task has a success rate, a time and a perceived effort, and if two observers compare notes.
- Test before painting. The low-fidelity prototype, under a provisional name, let me change the flow without attachment. What you see above is what remained after the tests.