Projects Cardinal
Be card smart — how do you help people spend smarter when they carry five cards but barely understand one?
00 At a glance
01 Challenge
By 2020, the average consumer carried multiple credit and debit cards — each promising benefits, cashback, and discounts from different banks. But there was a catch: almost no one knew which card to use where.
The mental overhead of tracking 3–5 card benefit programs is enormous. Banks communicate offers through emails no one reads, apps no one opens, and PDFs no one downloads. The result? People defaulted to whichever card was on top of their wallet — leaving real money on the table at every checkout.
COVID-19 made this worse. Businesses flooded the market with time-limited cashback promotions, exclusive card deals, and location-specific discounts. The signal-to-noise ratio collapsed entirely.
The business problem
Merchants needed card-eligible customers at their door. Banks needed their cards to be the preferred choice at POS. Neither had a clear channel to reach users at the moment of decision.
The user problem
Consumers had no single, neutral, low-friction place to ask: “Which of my cards gets me the best deal, right here, right now?” Cardinal was designed to answer exactly that question.
So what?The market was enormous and growing cashless — but the UX layer between cardholders and their benefits was completely broken. A genuine product gap, not a marginal improvement.
02 Research
With 2.8 billion cards globally and growing cashless adoption, the infrastructure for card-linked offers existed — but the consumer-facing discovery layer didn’t. Banks and merchants both had motivation to close this gap. The question was: who was already trying?
Most card-management apps were either bank-owned (biased toward their own products) or aggregators (feature-heavy, overwhelming, poorly designed). None solved the simple question of “which card should I use at this merchant, right now.”
No competitor offered real-time, location-aware offer discovery
Existing apps required sharing full card numbers or linking accounts — a major trust barrier
Category-based browsing (food, travel, groceries) was rare; most used bank-centric navigation
None designed for the moment of purchase — the 5 seconds before you tap
So what?The competitive white space wasn’t in features — it was in framing. Cardinal could win by being radically simpler and privacy-respecting.
Uses one card for everything. Doesn’t know their benefits. Not opposed to offers, just never in the mindset to seek them.
Knows their cards have offers. Spends mental energy remembering which is which. Gets it wrong regularly. Mildly resentful of banks.
Downloaded 2–3 bank apps. Got overwhelmed. Now ignores all of them. Has mentally given up despite wanting to optimize.
Key findingUsers didn’t want to manage their cards. They wanted to use them better — with minimal overhead at the moment of decision. The product had to intercept users before they paid, not review data after.
03 Key insights
“Which card?” is a 5-second question asked at a register, not a 5-minute one asked at home. Cardinal had to be fast, local, and contextual.
Users distrusted sharing card numbers with third-party apps. Cardinal needed to work with card names, not card numbers.
The highest-value moment was “show me what’s near me, with my cards, right now.” Location-aware surfacing was the differentiator.
Users thought in categories — food, travel, groceries — not card names. “Best food deal today?” is how people actually think.
Power users wanted to bookmark offers and merchants. A Favourites tab brings users back when they aren’t actively shopping.
First-time setup was the biggest drop-off risk. Onboarding had to be short and low-commitment: no linking, no numbers — just “which cards do you carry.”
04 Product strategy
Principle 1
Cardinal deliberately didn’t show every offer from every bank — it surfaced the most relevant offer at the right moment. A curated, fast experience beats a comprehensive, slow one.
Design decisionBottom nav limited to four tabs — Home, Nearby, Favourite, Profile. No hamburger menu. Every feature within two taps.
Principle 2
No card numbers, no account linking, no bank login. Cardinal only needed to know which cards a user carried.
Design decision“Add a card” meant selecting a brand from a dropdown, not entering 16 digits — surfaced in onboarding as “Absolutely safe — no need to share card numbers.”
Principle 3
Instead of making users navigate to nearby offers, Cardinal defaulted to location-aware suggestions.
Design decisionThe Nearby tab loaded with current location pre-set and offers pre-filtered to walking distance; permission requested in context.
Principle 4
Offers displayed as “20% off on DBS card” — tied to the specific card in the user’s wallet, not the bank broadly.
Design decisionOffer cards always showed the card type alongside the value, turning abstract promotions into personal savings.
05 Information architecture
Cardinal’s architecture was deliberately flat — three levels maximum from any screen to any action, with everything living in the bottom navigation.
Cardinal
* Keeping everything in the bottom nav (no hamburger menu) was the right call; consolidating the Profile tab’s 10+ items would help at V2.
06 Design exploration
The name Cardinal — a bird known for vivid red plumage and sharp navigational instinct — gave the brand its foundation: directional, confident, sure of where to go. The wordmark =cardinal used a custom equals-sign prefix — a nod to equivalence and comparison (which card equals better value here?).
Tone: knowledgeable friend, not corporate bank.
The palette inverted the typical fintech aesthetic. Most banking apps are white, blue, and corporate — Cardinal went dark, making every offer card pop with warmth. The yellow-gold primary reads as reward, not warning: the color of value and return. A dark UI is also easier to read in the variable lighting of shops and streets — and signals premium.
#0E1A2B#F4C430#2F6FED#E0413ETypeface — Avenir (geometric clarity, warm neutrality)
Page Heading — 24, Bold
Section Heading — 16, Semibold
Body Text — 12, Regular
Onboarding used bold, geometric yellow objects on dark backgrounds — a wallet, a pin, a card, a shield — communicating each value proposition instantly, without photography. Custom illustration in fintech is rare and signals real craft: someone cared how this feels, not just how it works.
07 Design system
The atomic unit — merchant logo, offer headline, card-name badge, favourite icon. Two states: full-width list and compact map tooltip.
Yellow-gold background, dark text, full-width. For primary actions: Get Started, Add Card, See Offer.
Dark-gray background, white text. For alternative actions: Skip, Cancel, Back.
Four tabs — Home, Nearby, Favourite, Profile. Active tab fills yellow-gold; inactive at 50% opacity.
Horizontal-scroll pills on Nearby: Hotel, Flight, Taxi, Train, Real Estate, Groceries, Food, Bus.
Native map with offer pins using the Cardinal “C” mark. Tapping a pin expands the offer tooltip.
Swipe-right pagination with dot indicators — each screen earns its view.
Heart tap = instant favourite, no confirmation. The micro-interaction feels immediate.
Tap to expand tooltip, tap tooltip for detail — two taps to conversion intent.
Requested in context on first Nearby visit, with a clear why.
08 Final experience
Journey 1 — First-time onboarding
Fintech onboarding is historically the most abandoned stage — users expect friction, forms, card linking, KYC.
Key moves
You earn trust after you’ve earned attention.
Journey 2 — Home: personalized offers
Generic feeds create noise, not value — if the first offer isn’t relevant, users never reach the second.
Key moves
Journey 3 — Nearby: offers in the real world
The Nearby tab loaded with location pre-set, map view visible, and offer pins already populated — no “search first” friction.
Key moves
09 Outcome
Cardinal was a concept and prototype — not a shipped product with measured KPIs. But the outcomes were real at the design level.
“Which of my cards gives the best deal here?” was answerable in under three taps — a claim no product on market could make in 2020.
The onboarding-to-offer funnel was designed for under 60 seconds. Replacing card numbers with card-name selection structurally removed the primary adoption barrier.
Cardinal created a neutral aggregation layer between users, banks, and merchants — a position banks and merchants couldn’t credibly occupy, which is why users would trust it.
112 views on Behance at publication; community feedback “clean and neat work,” validating the premium, minimal aesthetic against typical fintech density.
10 Reflection
The most important design decisions aren’t visual. The privacy architecture (no card numbers), the card-attribution framing, the Nearby tab being second in the nav — these structural choices shaped the entire experience before a single pixel was placed. And constraint produces clarity: with no backend or business model yet, the design had to ask only “if this worked, what would it feel like?”
Cardinal in 2020 asked users to bring their own context. Cardinal with AI brings the context to users.