Banking App
A flexible, white-label banking app built to deliver clear, confident money management for users, while enabling teams to launch and rebrand quickly across clients.
My Role
Led product and system design for a zero-to-one white-label banking platform.
The Problem
No shared design language, no reusable components, and aggressive delivery timelines across multiple clients.
Impact
Shipped a scalable banking app and a tokenized system that enabled rapid rebrands and repeatable client launches.
Design Approach
Design Approach
I created the following workflow: research → flows/prototyping → identifying reusable patterns → component creation → tokenizing → engineering handoff. This ensured that every screen contributed directly to a scalable, multi-brand design system.
Cards Design
Originally, card actions lived in a stacked list farther down the screen. It was complete, but slow: users had to scroll, hunt, and then double-check they were acting on the right card, especially when managing multiple cards. In early sessions we saw hesitation around high-impact actions like Freeze and Terminate, plus a lot of back-and-forth just to confirm they had the correct card selected.
We iterated by moving the most-used actions closer to the card and adding quick-access controls (Link Account, Pay Card, etc.) as dedicated modules instead of burying them in the stack. The intent was to reduce time-to-action while making risky actions feel deliberate. In testing, users completed common tasks faster, made fewer mis-taps, and reported higher confidence because the controls were grouped with the card context and the primary workflows were immediately available.
Commercial Dashboard
Research showed CFOs need an at-a-glance view of cash position, urgent approvals, and recent activity without digging through account menus. We redesigned the commercial dashboard to prioritize decision-making signals first (total cash balance, pending approvals, latest transactions), with drill-down paths to account types, category breakdowns, multi-currency balances, and loan exposure.
In usability testing, this layout reduced time-to-find for key information (cash balance, approvals, and recent transactions) and improved task success for common workflows like reviewing approvals and locating specific account details. Clear grouping and hierarchy reduced navigation steps and decreased user hesitation when switching between accounts and financial categories.
Rewards
We explored a few more “clever” data visualizations for Rewards (including a treemap-style grid of differently sized squares), but early testing showed users couldn’t quickly explain what the charts meant or how to act on them. Since success was measured by how fast users could understand their rewards status and breakdown, we simplified the visuals into two scannable views: a bubble summary and a category ring.
In the bubble view, size does the heavy lifting. Larger bubbles represent where a user has more points or stronger performance, while smaller bubbles represent less, so users can grasp the story at a glance without decoding a chart legend. The second view provides a clearer numeric breakdown by category for users who want details, and the tabs let people switch between “quick understanding” and “deeper analysis” depending on their intent. This iteration improved comprehension speed in testing and reduced confusion while keeping the experience engaging.
One Component, Infinite Variations
Building on Material 3, I created custom banking components including dashboards, cards, onboarding, status modules, alerts, and tiles. Each was designed as a scalable variant connected to the token system, ensuring consistent styling and predictable implementation for engineering.
Build Once, Brand Anywhere
Using Material 3 as the foundation, I customized our core design primitives and mapped them into Token Studio with M3 naming conventions. This became a unified source of truth for design and engineering, enabling every screen in the product to be fully tokenized and automatically brand-adaptive.