Zero out of twelve. Redesigning MetaMask Card for 30 million users.
Delegation completion improved by nearly 50% with the redesigned onboarding.
Delegation completion improved by nearly 50% with the redesigned onboarding.
Client
MetaMask
DELIVERABLES
Research User Interviews Prototype Testing
Client
MetaMask
DELIVERABLES
Research User Interviews Prototype Testing
Year
2025
Role
Lead Product Designer
Year
2025
Role
Lead Product Designer
"Someone needed to just shout it: get USDC on Linea, here's how to swap. That's it. Nobody was saying that." — P1, Power User. Onboarding research session.
This was a power user. Someone already comfortable with crypto. And even they couldn't figure out how to fund the card without being walked through it. For less experienced users, the picture was worse. In our research sessions, zero out of twelve participants completed onboarding without assistance. Average time to complete: over 40 minutes. MetaMask Card had a product problem disguised as a UX problem. The interface assumed users thought like blockchain developers. Most people just wanted to spend their money.
I joined as Lead Designer on the Card team during a critical window. The product was live but conversion was broken. My scope covered the full onboarding experience from post-KYC to first spend. I helped write the research scripts and sat in on interviews, asking follow-up questions to understand users' mental models, their spending habits, and the language they actually used when talking about money. Those conversations directly shaped every decision I made. I also prototyped the redesigned solutions and ran unmoderated testing with users before anything went to engineering. Research to design to validation, I owned that loop.
What Was Actually Breaking
Failure Point 1: The unguided funding drop-off
After completing KYC, a 19-minute process, users who didn't already have USDC on Linea were shown a modal telling them to swap their tokens, then handed off to MetaMask's native swap interface. No explanation of what Linea was. No reason given for why USDC specifically was required. No path back. A third-party walkthrough filmed before the redesign shows exactly how that experience played out: Watch the original funding flow → Understanding why this failed requires understanding who MetaMask Card was built for. The product was deliberately marketed beyond the Web3 core. Many users owned MetaMask for investment or simple trading. They'd bought ETH, held it, maybe moved it once. They weren't DeFi natives. Concepts like bridging, swapping, and layer-2 networks were either unfamiliar or actively intimidating. When the onboarding flow dropped them into a swap interface mid-journey with no context, they didn't know what they were looking at or whether they were about to lose money.
Failure Point 2: The spending limit intimidation
The delegation screen presented users with a default spending cap of $2,192,020.00 USDC. The number wasn't just large. It was formatted to look like a contract, because it was one. The label "spending cap" made users think they were granting permanent access to their funds at that scale. The research flagged this explicitly: users weren't just confused, they were scared. The language made it sound like they were handing someone a blank cheque. Two options were given equal visual weight. Neither was explained in terms a non-technical user could evaluate. The screen asked users to make a financial permissions decision with no frame of reference for what either option meant in practice.
Failure Point 3: No path forward after onboarding
Users who made it through had no persistent guidance. Skip a step and the dashboard gave no signal about what was missing or what to do next. The product assumed a completion that hadn't happened.
The Decisions I Made
Decision 1: Replace chaos with a stepper
People don't abandon hard things. They abandon unclear things. Make the path visible and most people will walk it.
The fundamental problem wasn't any single screen. Users had no mental model of the journey ahead. They didn't know how many steps there were, which step they were on, or what completion looked like. I introduced a stepper pattern as the structural backbone of the redesigned onboarding. Four steps, named in plain English: Connect Wallet. Get compatible tokens. Approve card spending. Add card to Apple Pay or Google Pay. The stepper told users the journey was finite and manageable before they started it. It let them skip steps they'd already completed. It made progress visible. Here's how the stepper took shape The stepper pattern wasn't the first direction explored. Early on, the question was whether the setup checklist should live inside the app itself, surfacing as part of the dashboard experience once users had already signed in. KYC alone was a 19-minute process. By the time users reached the dashboard, they'd already invested significant time and effort. Dropping them into an app shell with a setup checklist made them feel like the finish line had moved. The standalone stepper reframed the expectation: this is the last stretch, not more of the same. I also explored whether the wallet connection step could follow the tab pattern already established earlier in the KYC flow, keeping visual consistency across the full journey.
Decision 2: Speak the language users already had
The research sessions revealed something specific. Users understood token logos immediately. They struggled with token names in text. The blue circle with the dollar sign was immediately recognizable. "USDC on Linea" required prior knowledge. I replaced text-based token references throughout the flow with token chips, the visual identity system users already knew from their wallets. When we expanded to multi-chain in Phase 2, the chain selector became a dropdown with chain logos rather than a list of network names. This was a language decision as much as a design decision. Every word removed that required blockchain literacy was a point of friction eliminated.
Decision 3: Abstract the funding complexity in two phases
This was the hardest problem and the team solved it twice. Phase 1 redesigned the funding step to surface exactly what the user needed: compatible tokens, which chains they lived on, and a direct path to get them. The flow listened for the swap completion event from MetaMask so that once users finished, they were automatically returned to the stepper and the step marked complete. No manual confirmation, no uncertainty about whether it worked. Phase 2 went further. The team integrated Daimo Pay, a stablecoin ramp that accepts deposits from across chains and bank rails, automatically routing funds to the supported token without requiring users to bridge or swap manually. Users saw a clean payment modal showing their available balances with one tap to proceed. The complexity happened invisibly underneath. This is what abstraction as a design principle looks like in practice. The blockchain complexity didn't disappear. It ran underneath. Users never had to touch it.
Decision 4: Make the spending limit decision disappear
The $2.2 million default cap and the equal-weight binary choice were killing delegation completion. The fix was opinionated. Early wireframes presented both options — automatic approval and a custom limit — at equal weight on the same screen. The critical shift was recognizing that this framing was still asking users to make a decision they had no context for. The final design removed the choice from the default view entirely. Users were shown a single, clear action: approve card spending with a plain-language description of what that meant. The custom limit option lived behind an "Edit limit" link, surfaced only for users who actively sought it. The "Recommended" label appeared in that expanded state as confirmation, not as a nudge between competing options. Delegation completion improved by nearly 50%.
Decision 5: Design for users who don't finish
Not everyone completes onboarding in one session. Some skip the token step intending to return. Some dismiss the Apple Pay prompt. The original dashboard had no mechanism to re-engage these users. I designed three persistent states. An empty state with a prominent "Add Funds" button positioned contextually around the card, not buried in a menu. A banner for users who skipped adding their card to Apple Pay or Google Pay. A token management screen where users could see which tokens were already activated for spending and which still needed approval, with the same spending limit flow from onboarding repeated in a familiar pattern.
Onboarding doesn't end when the stepper ends. I designed for the whole journey.
What Changed
Delegation completion improved by nearly 50% with the redesigned onboarding.
At MetaMask's scale, that number isn't a UX metric. It's a revenue metric. Every percentage point of delegation completion is a meaningful increase in the number of users who actually spend with the card. The multichain expansion in Phase 2 extended the same abstraction principles to Solana and Base without fragmenting the experience into separate flows per chain. One interface, multiple chains, zero additional cognitive load for users.
Reflection
Behavior informs design. And the best design is invisible.
The abstraction had a ceiling. Once a user chose to approve, the native MetaMask confirmation window surfaced the raw contract parameters — spending caps in the billions, wallet addresses, token tickers — which we couldn't redesign. It was a reminder that designing within an ecosystem means working with constraints you don't own. The users who went through this redesigned flow didn't think about what we built. They connected their wallet, got their tokens, approved their card, and spent their money. The blockchain complexity ran underneath the whole time. That invisibility was the goal from the start. It's also how you know when you've actually solved the problem.
"Someone needed to just shout it: get USDC on Linea, here's how to swap. That's it. Nobody was saying that." — P1, Power User. Onboarding research session.
This was a power user. Someone already comfortable with crypto. And even they couldn't figure out how to fund the card without being walked through it. For less experienced users, the picture was worse. In our research sessions, zero out of twelve participants completed onboarding without assistance. Average time to complete: over 40 minutes. MetaMask Card had a product problem disguised as a UX problem. The interface assumed users thought like blockchain developers. Most people just wanted to spend their money.
I joined as Lead Designer on the Card team during a critical window. The product was live but conversion was broken. My scope covered the full onboarding experience from post-KYC to first spend. I helped write the research scripts and sat in on interviews, asking follow-up questions to understand users' mental models, their spending habits, and the language they actually used when talking about money. Those conversations directly shaped every decision I made. I also prototyped the redesigned solutions and ran unmoderated testing with users before anything went to engineering. Research to design to validation, I owned that loop.
What Was Actually Breaking
Failure Point 1: The unguided funding drop-off
After completing KYC, a 19-minute process, users who didn't already have USDC on Linea were shown a modal telling them to swap their tokens, then handed off to MetaMask's native swap interface. No explanation of what Linea was. No reason given for why USDC specifically was required. No path back. A third-party walkthrough filmed before the redesign shows exactly how that experience played out: Watch the original funding flow → Understanding why this failed requires understanding who MetaMask Card was built for. The product was deliberately marketed beyond the Web3 core. Many users owned MetaMask for investment or simple trading. They'd bought ETH, held it, maybe moved it once. They weren't DeFi natives. Concepts like bridging, swapping, and layer-2 networks were either unfamiliar or actively intimidating. When the onboarding flow dropped them into a swap interface mid-journey with no context, they didn't know what they were looking at or whether they were about to lose money.
Failure Point 2: The spending limit intimidation
The delegation screen presented users with a default spending cap of $2,192,020.00 USDC. The number wasn't just large. It was formatted to look like a contract, because it was one. The label "spending cap" made users think they were granting permanent access to their funds at that scale. The research flagged this explicitly: users weren't just confused, they were scared. The language made it sound like they were handing someone a blank cheque. Two options were given equal visual weight. Neither was explained in terms a non-technical user could evaluate. The screen asked users to make a financial permissions decision with no frame of reference for what either option meant in practice.
Failure Point 3: No path forward after onboarding
Users who made it through had no persistent guidance. Skip a step and the dashboard gave no signal about what was missing or what to do next. The product assumed a completion that hadn't happened.
The Decisions I Made
Decision 1: Replace chaos with a stepper
People don't abandon hard things. They abandon unclear things. Make the path visible and most people will walk it.
The fundamental problem wasn't any single screen. Users had no mental model of the journey ahead. They didn't know how many steps there were, which step they were on, or what completion looked like. I introduced a stepper pattern as the structural backbone of the redesigned onboarding. Four steps, named in plain English: Connect Wallet. Get compatible tokens. Approve card spending. Add card to Apple Pay or Google Pay. The stepper told users the journey was finite and manageable before they started it. It let them skip steps they'd already completed. It made progress visible. Here's how the stepper took shape The stepper pattern wasn't the first direction explored. Early on, the question was whether the setup checklist should live inside the app itself, surfacing as part of the dashboard experience once users had already signed in. KYC alone was a 19-minute process. By the time users reached the dashboard, they'd already invested significant time and effort. Dropping them into an app shell with a setup checklist made them feel like the finish line had moved. The standalone stepper reframed the expectation: this is the last stretch, not more of the same. I also explored whether the wallet connection step could follow the tab pattern already established earlier in the KYC flow, keeping visual consistency across the full journey.
Decision 2: Speak the language users already had
The research sessions revealed something specific. Users understood token logos immediately. They struggled with token names in text. The blue circle with the dollar sign was immediately recognizable. "USDC on Linea" required prior knowledge. I replaced text-based token references throughout the flow with token chips, the visual identity system users already knew from their wallets. When we expanded to multi-chain in Phase 2, the chain selector became a dropdown with chain logos rather than a list of network names. This was a language decision as much as a design decision. Every word removed that required blockchain literacy was a point of friction eliminated.
Decision 3: Abstract the funding complexity in two phases
This was the hardest problem and the team solved it twice. Phase 1 redesigned the funding step to surface exactly what the user needed: compatible tokens, which chains they lived on, and a direct path to get them. The flow listened for the swap completion event from MetaMask so that once users finished, they were automatically returned to the stepper and the step marked complete. No manual confirmation, no uncertainty about whether it worked. Phase 2 went further. The team integrated Daimo Pay, a stablecoin ramp that accepts deposits from across chains and bank rails, automatically routing funds to the supported token without requiring users to bridge or swap manually. Users saw a clean payment modal showing their available balances with one tap to proceed. The complexity happened invisibly underneath. This is what abstraction as a design principle looks like in practice. The blockchain complexity didn't disappear. It ran underneath. Users never had to touch it.
Decision 4: Make the spending limit decision disappear
The $2.2 million default cap and the equal-weight binary choice were killing delegation completion. The fix was opinionated. Early wireframes presented both options — automatic approval and a custom limit — at equal weight on the same screen. The critical shift was recognizing that this framing was still asking users to make a decision they had no context for. The final design removed the choice from the default view entirely. Users were shown a single, clear action: approve card spending with a plain-language description of what that meant. The custom limit option lived behind an "Edit limit" link, surfaced only for users who actively sought it. The "Recommended" label appeared in that expanded state as confirmation, not as a nudge between competing options. Delegation completion improved by nearly 50%.
Decision 5: Design for users who don't finish
Not everyone completes onboarding in one session. Some skip the token step intending to return. Some dismiss the Apple Pay prompt. The original dashboard had no mechanism to re-engage these users. I designed three persistent states. An empty state with a prominent "Add Funds" button positioned contextually around the card, not buried in a menu. A banner for users who skipped adding their card to Apple Pay or Google Pay. A token management screen where users could see which tokens were already activated for spending and which still needed approval, with the same spending limit flow from onboarding repeated in a familiar pattern.
Onboarding doesn't end when the stepper ends. I designed for the whole journey.
What Changed
Delegation completion improved by nearly 50% with the redesigned onboarding.
At MetaMask's scale, that number isn't a UX metric. It's a revenue metric. Every percentage point of delegation completion is a meaningful increase in the number of users who actually spend with the card. The multichain expansion in Phase 2 extended the same abstraction principles to Solana and Base without fragmenting the experience into separate flows per chain. One interface, multiple chains, zero additional cognitive load for users.
Reflection
Behavior informs design. And the best design is invisible.
The abstraction had a ceiling. Once a user chose to approve, the native MetaMask confirmation window surfaced the raw contract parameters — spending caps in the billions, wallet addresses, token tickers — which we couldn't redesign. It was a reminder that designing within an ecosystem means working with constraints you don't own. The users who went through this redesigned flow didn't think about what we built. They connected their wallet, got their tokens, approved their card, and spent their money. The blockchain complexity ran underneath the whole time. That invisibility was the goal from the start. It's also how you know when you've actually solved the problem.