Overview Joko
Joko is a French cashback app, and referrals are one of its real growth engines. The brief was focused: revamp the referral flow end to end. I treated it as a real product problem, audit what exists, learn from the best in the category, then rebuild the flow around two goals quietly in tension: faster acquisition for Joko, and a clearer, more rewarding experience for the person doing the referring.
Details
role
Product designer. Research, UX, UI, design system, motion.
scope
Audit, benchmark, flow, wireframes, UI kit, hi-fi screens.
tools
Figma, Mobbin, Gemini, Photoshop.
type
Self-directed concept.
The brief, in three lines
Problem:Joko's referral flow worked, but it leaked. A custom contact picker added friction, the referral link wasn't personalized so referrals got lost, and once you invited someone there was no way to track or nudge them.
Approach:Audit every screen against the user's mental model, benchmark the category, then redesign the whole path, discovery, share, and a tracking dashboard that didn't exist before.
Result: A complete, build-ready redesign: fewer steps to share, a personalized link that keeps the referral intact, a re-engagement loop, and a tracking dashboard wrapped in a playful brand narrative.
The audit
I mapped the existing flow screen by screen, from both sides, the referrer and the referee. A few findings drove everything after.
- 01
The custom contact picker was slower than the system.
Joko had built a four-screen in-app picker. Sharing a code took about six taps, against three in Revolut. My call was to remove the whole sequence and trigger the native share panel from the first action, faster, more graceful with contact privacy, and already optimized by the platforms. Rebuilding it would cost real research time to maybe match what users already trust.
- 02
The link wasn’t personalized.
Once a friend tapped through, the referral connection was lost unless they typed the code by hand. This was the most expensive leak in the funnel, and the clearest fix.
- 03
There was no way back in.
If a friend stalled halfway, the referrer couldn’t nudge them. No reminder, no status.
- 04
The notification broke the mental model.
Tapping a notification about a specific friend dropped you on a generic invite page, not that friend’s status.
The benchmark
I went through the referral flows of Airbnb, Revolut, Headspace, Oportun and others. The pattern was consistent: the best flows use the native share panel, send a personalized link, and many use the moment to push brand narrative. HelloFresh let people send a reminder straight from the hub. That confirmed the direction and gave me proven patterns to build on instead of guessing.
The redesign
I rebuilt the path as four clear steps, discovery, hub, instant share, and a tracking dashboard, then took it from flow to wireframes to high fidelity, on a small UI kit I set up for the case.
The decisions that mattered
Native share, from the first tap. The four-screen picker is gone. One action opens the system panel with a personalized link inside a short, on-brand message, the referral code easy to spot rather than buried in a paragraph.
A tracking dashboard that earns trust. Joko's promise is generous, you keep ten percent of a friend's earnings for a year, but the old flow gave you nowhere to watch it happen. I designed a dashboard with real states: empty and full, active, awaiting and done, down to a per-friend view of daily gains across the year. It turns an abstract promise into something you can see.
A re-engagement loop. Pending friends get a “send reminder” action that opens a prefilled SMS, with a clear two-step status (signed up, bank connected) so the referrer knows exactly what's missing.
The creative layer
The category is full of cold reward dashboards. Joko's brand leans playful and relatable, so I gave the tracking a story: a harvest. Referrals are seeds, gains grow them from a sprout into a golden tree, and the sections read as active, potential, and past harvests. Empty states became small invitations (“nothing growing yet, plant your first seed”) instead of dead ends. I made the 3D icons and growth animations myself in Gemini and Photoshop, so the metaphor ran all the way through, not just in the copy.
Reflections
Restraint is a decision.
The strongest move in the whole case was removing a feature, the custom picker, in favor of something the platform already does better. Knowing when not to design is part of the job.
A flow is also a story.
The tracking dashboard could have been a table. Tying it to a brand narrative turned a functional screen into the part of the flow people might actually enjoy.
Business and user goals can be reconciled.
Joko wants acquisition, the user wants speed and clarity. The native-share and personalized-link decisions served both at once.