MoMo Merchant.
Migrating a high-volume payments app to the MoMo NextGen brand.
- Role
- Senior Product Designer
- Platform
- iOS · Android
- Markets
- 7 · EN + FR
- Scope
- Brand + UX refresh
About
One of MTN MoMo's flagship merchant apps — an interim brand refresh while the full MoMo Business app was still in build.
MoMo Merchant is used by millions of small business owners and informal traders across seven African markets. As part of the consolidation under MoMo Business, I led the visual redesign — migrating from the legacy yellow MTN identity to the new MoMo NextGen brand.
The catch: it had to ship as an interim release, ahead of the full MoMo Business app, without destabilising the experience for millions of merchants already transacting daily.
Refresh the brand and cut the usability debt — without making millions of merchants relearn the app.
Outcomes · Three months post-launch
All deltas measured against the pre-refresh baseline.
+22%
Transaction volume
The clearest signal the refresh translated to real business outcomes.
+17%
Transaction value
Higher-value transactions, not just more of them.
+18%
Active merchants
Merchants returning more often, not one-off spikes.
+12%
Session duration
+9%
Task completion (78→85%)
−15%
Error rate
−20%
Time to complete
Secondary metrics — engagement and task-level improvements, three months post-launch.
Phase one · The brief
Two problems, one refresh.
Constraints
- Core flows must stay intact
- A refresh
- not a rebuild
- Tight NextGen timeline
- Millions of live users
Brand misalignment. The app still carried the old yellow MTN identity, fighting the new MoMo NextGen brand rolling out across the ecosystem. With the full MoMo Business app still in development, the Merchant app needed an interim refresh — it couldn't wait for the rewrite.
Usability debt. Underneath the brand: overly detailed illustrations standing in for clear icons, weak hierarchy in the balance and transactions section, low-contrast text, small tap targets, and a transact flow that didn't scale to new payment options.
Senior-level work is defined as much by what you choose not to change. Core functionality and IA stayed put — the refresh had to be safe to ship without retraining a live user base across seven markets.
Process
A decision-first audit rather than a full discovery cycle — map the app, map the brand, ship the high-value wins.
- 01
Audit
- 02
Brand mapping
- 03
IA preservation
- 04
UX wins
- 05
Prototype
- 06
Validate
- 07
Delivery
Phase two · The people
Three merchants, three counters.
Three merchant archetypes shaped the refresh — the high-frequency agent, the spaza-shop owner, and the independent retailer. Every UI decision ran past what they'd tolerate at a busy counter.
Adaobi
Spaza shop owner
Runs a neighbourhood spaza shop. Takes payments through the day without slowing the queue — QR receive, supplier payouts, tracking what cleared.
What she needs
Speed, clarity, and a one-thumb workflow — non-negotiable when there's a queue in front of the counter.
Kojo
Mobile money agent
Runs a roadside MoMo agent stall — cash-in, cash-out, bills, airtime. Processes dozens of transactions an hour.
What he needs
Visible balances, fast confirmations, fewer form errors, and a transact flow that can absorb new options without retraining him.
Nadia
Independent retailer
Runs a small fashion boutique, in-store and online. Issues receipts, generates per-customer QR codes, tracks daily takings.
What she needs
Visual clarity and brand-trustworthy presentation — her customers see the app over her shoulder.
Drawn from the broader MoMo research register rather than a Merchant-specific study — a gap I'd close with more time (see reflections).
Phase three · Key problems
The two that mattered.
- 01
Problem
Brand misalignment
The app still carried the old yellow MTN identity, fighting the new MoMo NextGen brand — and the full MoMo Business app was still months away.
Solution
A bridged identity
Led with MoMo Blue (#004F71) as the primary, but kept Sunshine Yellow (#FFCB05) as a deliberate accent, with the underscore mark carrying recognition. Don't abandon the yellow — use it to anchor continuity for millions of users mid-transition.
- 02
Problem
Usability debt
Detailed illustrations doing the job of icons, weak hierarchy, low-contrast text, small tap targets, and a transact flow that couldn't scale.
Solution
Targeted UX wins
A bespoke 33-icon library replacing the illustrations, tighter home-screen hierarchy, higher contrast, tap targets to platform standards, and a transact button rebuilt to absorb future payment options without re-layout.
Phase four · MoMo QR
Brand recognition at the point of payment.
The MoMo QR is the single most-used surface in the app — every merchant transaction starts with a customer scanning it. That made it the highest-leverage place to anchor the new brand: not a splash screen or an onboarding moment, but the point where the customer is already looking at the screen.
I embedded the MoMo logo into the QR mark itself, tightened the layout, raised contrast on the merchant name and amount, and made the underscore + MoMo Blue treatment a consistent signature. A small change on a surface rendered millions of times a day compounds into measurable brand recognition for the whole NextGen rollout.
Phase five · System & features
Foundations the next app inherited.
Foundations
- Palette
- Typography
- Icons
- Grid & spacing
- Brand signature
The refresh established the visual foundations that carried forward into the broader MoMo Business family — built to bridge MoMo NextGen (developed for marketing surfaces) into a live, high-volume mobile product, and to be inherited by the full MoMo Business app already in development.
- MoMo Blue #004F71 and Sunshine Yellow #FFCB05, with a grayscale text stack and a gradient background system.
- MTN Brighter Sans — the bespoke MTN typeface, Extra Bold → Extra Light, documented across the system.
- A bespoke 33-icon library, replacing the legacy illustrations and scaled for clarity at mobile sizes.
- A grid and spacing rhythm codified so future product surfaces stayed consistent without rework.
- The circle (from the MoMo logo) and the Sunshine Yellow underscore + MoMo Blue treatment, codified as the brand signature.
Phase six · Selected screens
Selected screens.
The key surfaces at a glance.
Dashboard — before and after. A cleaner balance display and stronger hierarchy, readable from across a counter mid-transaction.
Reflections
The no-rebuild boundary was the real constraint. Given a longer window I'd have pushed harder on the transact-flow IA — the scalable button was the right near-term answer, but the underlying hierarchy of payment options deserves a deeper rethink. I'd also have run a Merchant-specific research pass; the personas here are scaffolded from the broader MoMo register.
This work also pre-dated AI in my workflow. Designing it today, I'd use AI for the brand-system mapping — translating marketing-surface tokens onto product patterns — for rapid prototyping of the transact-button variants against simulated merchant behaviour, and for in-context localisation across the seven markets. Same product; a faster, sharper path to it.
Continuity is a design decision — we led with MoMo Blue but kept the Sunshine Yellow on purpose, so millions of merchants never felt the ground move.
— What I learned
More case studies
