A unified billing product for Africa

I ran on-site field research across African markets to understand how merchants actually get paid — not how we assumed they did. The pattern was everywhere and invisible in our analytics: getting paid was a human process, not a product one.

South African merchants rarely had a self-serve billing page. To recover outstanding payments they leaned on manual recovery — call-centre follow-ups, SMS nudges and WhatsApp/email reminders, often sending bank details or a reference and asking the customer to confirm once paid.

• Money owed was chased one conversation at a time — expensive and slow.
• Customers paid into a void, then had to prove they'd paid.
• No shared source of truth between merchant and customer.

Without a self-serve billing page, merchants chased outstanding payments manually while customers paid with no confidence the payment landed. As Moment, we needed a scalable, self-serve billing product that adapts seamlessly across diverse merchant use cases — without custom builds — yet stays dynamic and scalable, meeting global standards while remaining intuitive for local users.

Identifying quick wins

• Replace manual recovery with a self-serve billing & payment flow.
• Merchants need to "get paid without chasing."
• Customers need to "pay safely, with confidence."
• One product that scales across merchants and payment methods, not bespoke builds.

I mapped the jobs people perform in a Moment checkout across three altitudes — the sky-level emotional & social goals, the backbone of the core flow, and the fish-level tasks users repeat most. This kept the team anchored on user value, not screens.

• Emotional goal: "I want more control over my bill payments."
• Social goal: contextual moments — e.g. paying the DStv bill before the match.
• Core value: decide a payment method that feels quick & trustworthy, then know the transaction succeeded.

Then I pressure-tested the flow with real users — first-time and repeat — to surface where trust broke and which decisions mattered most.

I consolidated the entire customer journey into a single architecture, then reduced it to a repeatable spine: EBP → Checkout → Payment details → Redirect → Status → Receipt, with failed/cancelled/expired routes folding back in.

From there I identified the common elements across every screen — branding, country, amount states, breakups, points, transaction details — so a single component set could power every merchant and every method.

To make "no custom builds" real, I built a scalable design system from scratch that maps directly to the common-element model — so product, engineering and business could compose any merchant experience from the same parts. I also integrated AI into the design workflow to move from spec to variations faster.

• Wireframes acted as a shared contract between design, eng and business.
• Components encoded dynamic states (locked vs editable amounts, partial payments, VAT, discounts).
• Drove cross-functional delivery so the same system shipped across markets.

The bill page went through dozens of iterations — tuning hierarchy, the amount field, due-date framing, error guidance and trust cues until first-time users could pay without hesitation.

I made it responsive across breakpoints, with a desktop summary that exposes the full amount breakup — subtotal, discounts, previous advance and VAT — without overwhelming smaller screens.

The shipped product is a complete, self-serve flow that handles every local method — cards, Capitec Pay, bank transfers and vouchers — through to a shareable receipt.

Customisable to each merchant's brand

Scalable across merchants & solutions

One checkout, every African market

Beyond a single set of methods, every African country gets its own localized list of payment methods, ready to switch on. A merchant integrates one checkout and instantly offers the rails their customers actually use — market by market. The result connects all of Africa through a single integration, while the payment experience stays local and familiar for every buyer.

No-code products for any team

To remove engineering as a dependency, I shaped no-code products on top of the same system — a shareable Payment Link and a hosted Payment Page — so a merchant with no developers can request and collect money in minutes.

Mobile & web SDKs for builders

For teams that do build, the same flow ships as mobile and web SDKs — drop-in checkout that inherits every method, brand theme and local market, without re-implementing the payment logic.

Cash payments for cash-based markets

Large parts of Africa still run on cash. To capture those buyers I introduced a cash payment option — generating a reference the customer settles at an agent or outlet — bringing offline, cash-first markets into the same unified, trackable flow.

Unified Billing replaced manual recovery with a self-serve product that merchants can stand up themselves and customers trust — built once, scaled across brands, methods, markets and the whole of Africa.

• Conversion 20% → 40% — the unified flow doubled completion across products.
• Faster checkout — cut the time taken to complete a transaction.
• Higher transaction rate — cash payments via a token number pulled cash-first buyers into the flow, lifting completed transactions.
• 1 scalable billing system — replaced per-merchant custom builds.
• Local methods in every African market — one checkout for cards, Capitec Pay, transfers, vouchers and cash.
• No-code + SDKs — payment links, hosted pages and mobile/web SDKs for any team.