Web3 / DeFi Wallet UX Design

Self-Custody, Zero
Friction

Lumen is a self-custodial crypto wallet designed for people who want financial sovereignty without needing to become blockchain engineers. Hold, swap, and spend onchain assets with the interaction simplicity of a banking app — and complete control over your own keys.

Role Senior Product Designer
Timeline 2025
Category Web3 / DeFi
Type Landing Page & Wallet UX
Visit Project Read Case Study
Lumen — Self-Custodial Crypto Wallet
0 Chains Supported
150+ Token Assets
<3s Average Swap
NONCustodial True Key Ownership
The problem
Self-custody means a mistake is permanent. Most wallets front-load that danger in a seed-phrase warning nobody is ready to absorb.
The approach
Sequence the security, don't dump it. Progressive disclosure through onboarding, with trust architecture given its own visible section.
The outcome
A multichain wallet where the visual language signals who it is for, and the safety claims are prominent rather than buried in a footer.
5
Chains, one UI
<3s
Average swap
1
Trust section
3
Accent roles

01 — The Problem

73% abandon
at the seed phrase.

The Challenge

Self-custodial wallets have historically been the domain of users already fluent in seed phrases, gas fees, and chain-switching. The UX complexity wasn't accidental — it was inherited from the underlying technical architecture and nobody had bothered to abstract it away. Lumen's mandate was to serve the next cohort of users: people who want sovereignty over their assets but won't read a 40-page technical guide to get it.

The paradox at the centre of this project: make the most technically complex consumer financial product feel like opening a current account. The answer turned out to be progressive disclosure — not hiding complexity, but sequencing it so the user only encounters it when they're ready for it.

The Design Problem

Self-custody means the user holds all the risk. Which means the design holds all the responsibility for communicating that clearly without creating paralysis. Trust the user with their own keys — while making sure they understand what that means.

This tension — between empowerment and informed ownership — was the central creative challenge every design decision had to resolve.

Research Insights

INSIGHT 01
Fear of Loss is the Primary Barrier
The single largest barrier to self-custody adoption is not technical complexity — it's the fear of permanently losing access to funds. The seed phrase onboarding moment is where 73% of potential self-custody users abandon the process.
INSIGHT 02
Banking App as UX Benchmark
Crypto-curious users compare every new financial app to their banking app. If Lumen couldn't match the intuitive interaction model of Monzo or Revolut, it would fail at first contact regardless of its technical merits.
INSIGHT 03
Transparency Without Complexity
DeFi native users need to see what's happening under the hood — gas costs, slippage, routing. Non-native users need those same operations to feel invisible. Progressive disclosure was the architectural answer.

05 — User Stories

What Users Need

As a... I want to... So that... Priority
DeFi Native See a multi-chain portfolio view without switching between chain contexts I can manage my entire onchain portfolio in one interface High
Crypto-Curious User Set up a wallet and buy my first ETH in under 5 minutes I can get started without needing to watch YouTube tutorials first Critical
Financial Professional Earn yield on my USDC without interacting with DeFi protocols directly I get the returns without the complexity of protocol management Medium
Privacy Advocate Verify that Lumen is non-custodial and open source I can independently confirm my keys never leave my device Critical
International Sender Send crypto internationally in under 30 seconds with transparent fees I can use Lumen as a remittance tool without surprises at confirmation High

06 — Competitor Analysis

Market Landscape

Feature MetaMask Phantom Rainbow Trust Wallet Lumen
Non-Custodial ✓ ✓ ✓ ✓ ✓
Multi-Chain ~ ~ ~ ✓ ✓
Banking-App UX ✕ ~ ✓ ~ ✓
In-App Swap ✓ ✓ ✓ ✓ ✓
DeFi Yield Access ~ ~ ✕ ~ ✓
Easy Onboarding ✕ ~ ✓ ~ ✓
Open Source ✓ ✕ ~ ✕ ✓

Solution Exploration

Three decisions that
shaped the wallet.

Decision 01
Crypto-native iconography vs. Abstract mesh visual language
Problem
Web3 products default to literal crypto iconography — coins, chains, blockchain graphics. This signals "for crypto natives" and excludes the mainstream user Lumen is designed for.
Option A — Crypto-Native Visual
ETH logos, blockchain node graphics, chain link imagery. Immediately legible to DeFi users — and immediately alienating to the 35-year-old finance professional who is the actual target.
Option B — Iridescent Mesh Gradient (Chosen)
Abstract iridescent mesh communicates the multi-chain financial internet without literal crypto imagery — technically credible to natives, abstractly expressive to newcomers.
Why Option B
The target user is not the DeFi native. Lumen's job is to make self-custody feel attainable to people who have heard of crypto but never touched a wallet. The visual language had to match that user, not the existing market.
Reasoning: Visual language signals who the product is for before a word is read. Crypto iconography closes the door on mainstream adoption at the first impression.
Decision 02
Upfront seed phrase warning vs. Progressive security disclosure
Problem
Self-custody requires users to understand seed phrase responsibility before they can use the wallet. The standard approach — full warning at first screen — causes the exact user Lumen is for to abandon setup.
Option A — Upfront Full Warning
"If you lose this phrase, no one can recover your funds" as the first substantive screen. Accurate, necessary — and the single largest drop-off point in every self-custody wallet that does this.
Option B — Progressive Disclosure (Chosen)
Security responsibility introduced gradually: wallet creation first, small amount first, seed phrase education framed as a graduation — each step building confidence before the next requirement is introduced.
Why Option B
The 35-year-old finance professional who put the phone down at the seed phrase screen is the user we are designing for. The message cannot be softened — but the sequence can be designed so it feels manageable.
Reasoning: The seed phrase screen is not a UX problem — it's a sequencing problem. The information is correct; the moment it appears determines whether the user is ready to receive it.
Decision 03
Security as footnote vs. Trust architecture as product section
Problem
Crypto wallets have a trust deficit with mainstream users — hacks, rug pulls, and exchange collapses dominate the news. Security claims in footer text are discounted before they are read.
Option A — Footer Security Note
"Open source and audited" in small text at the bottom. Technically accurate, visually insignificant — treated by users as boilerplate rather than substance.
Option B — Trust Architecture Section (Chosen)
Open source, third-party audits, and non-custodial architecture given a dedicated section with the same visual weight as core product features — communicating that trust is architecture, not afterthought.
Why Option B
For a mainstream user considering self-custody for the first time, security is not a reassurance — it's a prerequisite. The trust section needed feature-level prominence to be processed as substance rather than decoration.
Reasoning: In a category with a trust deficit, security claims buried in the design are ignored. Visual prominence is not emphasis — it's credibility.

10 — Design

The internet of money,
made human.

Web3 product design has a documented dark pattern problem: gas fees that appear only at confirmation, slippage hidden in small print, "confirm" buttons that look like "cancel." Lumen was designed with an explicit brief to surface total cost — asset value plus gas — on the swap preview screen, before any commitment. That's not a nice-to-have; it's a trust foundation. The iridescent visual system communicates that this is native internet finance, not a legacy bank trying to look modern. The distinction matters to the users this product is trying to reach.

lumen.finance — Self-Custodial Wallet
Lumen — Main View

Lumen — Web3 Self-Custodial Wallet UX

Lumen — Screen 2
Lumen — Screen 3
Lumen — Screen 4

Design Highlights

🌌
Iridescent Mesh Gradient
Problem
Crypto-native iconography (coins, chains, blockchain graphics) signals "for DeFi users only" — closing the door on the mainstream user Lumen is designed to reach.
Approach
Abstract iridescent mesh communicates the multi-chain, multi-asset financial internet without literal crypto imagery — technically credible to natives, abstractly expressive to newcomers.
User Benefit
Mainstream users encounter a visual environment that feels modern and aspirational rather than technical and excluding. The product reads as approachable before the first feature is described.
Business Benefit
An abstract visual identity is category-defining rather than category-following. Lumen's mesh is distinct from every other wallet that defaults to blockchain iconography — differentiation at first glance.
🔮
Violet/Purple Accent
Problem
Fintech blue communicates precision and compliance — the register of a bank. DeFi green communicates growth and aggression. Neither communicates the sovereignty and empowerment that self-custody represents.
Approach
Violet #8B5CF6: the colour of the onchain economy — sovereign, expressive, distinct from legacy finance and the aggressive DeFi aesthetic simultaneously.
User Benefit
The accent communicates that Lumen belongs to a new category — not a bank, not a DeFi protocol, but a new kind of financial sovereignty tool. The colour sets the right expectation before the product is used.
Business Benefit
Violet is ownable in a wallet category that splits between blue (fintech-adjacent) and green (DeFi-native). A distinct colour identity compounds recognition at every marketing and product touchpoint.
⚡
Amber on Action
Problem
CTAs in crypto products typically use aggressive colours — bright green, electric blue — that signal urgency. In a product handling financial sovereignty, urgency is the wrong tone at the conversion moment.
Approach
Amber #FF8A3D on primary CTAs: warm, human contrast to the cool violet mesh. The colour signals "act now" with warmth rather than pressure — the right tone for irreversible financial actions.
User Benefit
Users approaching first-time self-custody are already anxious. An amber CTA reduces the pressure signal at the conversion moment — inviting action rather than demanding it.
Business Benefit
A warm action colour reduces hesitation at the onboarding funnel's most sensitive steps — seed phrase confirmation, first send, first receive. Lower friction at high-stakes moments improves activation rate.
📐
Syne Display Font
Problem
Crypto products use either aggressive geometric display fonts (signaling DeFi aggression) or generic sans-serifs (signaling nothing). Neither communicates technical precision with human approachability.
Approach
Syne: geometric, futurist, confident without aggression. The typeface communicates technical precision while feeling designed for humans rather than for engineers or DeFi traders.
User Benefit
Mainstream users read Syne as "this is a serious technical product, but it was designed with me in mind" — the exact balance a self-custody wallet targeting non-natives must strike.
Business Benefit
A deliberate, non-generic typeface signals that the entire product was designed with the same intentionality. Typography is the first non-visual signal of product quality for technical buyers.
🛡️
Trust Architecture Section
Problem
Crypto has a mainstream trust deficit — hacks, collapses, and rug pulls dominate the news. "Open source and audited" in footer text is treated as boilerplate rather than substantive evidence.
Approach
Open source codebase, third-party security audits, and non-custodial architecture given a dedicated section with the same visual weight as product features — trust as architecture, not afterthought.
User Benefit
For a mainstream user considering self-custody for the first time, security is a prerequisite, not a reassurance. Feature-level prominence makes the trust claims impossible to miss and easy to evaluate.
Business Benefit
A prominent trust section converts security-literate users who would otherwise default to a centralized exchange. It is the section that converts the user who almost didn't try self-custody.

Design System

The language
of sovereign finance.

A cohesive design system built to communicate financial empowerment at every touchpoint — from the iridescent mesh to the amber action accent, every token was chosen to make the user feel powerful, not anxious.

Brand Colour Palette
Violet #8B5CF6
Amber #FF8A3D
Cyan #3DE0FF
Deep Void #0D0A1E
Soft White #E8E0FF

Violet anchors sovereign identity. Amber warms human action. Cyan communicates the precision and speed of onchain execution. Deep void provides the infinite depth of the onchain universe.

Web3 Typography
Display Sovereign
Heading Your keys. Your coins.
Body 12 chains, one wallet
Label Open Source · Audited

Syne leads display with geometric confidence. Sora handles body copy with clean, universal legibility.

Design Tokens
Violet Sovereign Iridescent Mesh Amber Action Cyan Precision Progressive Disclosure Trust Architecture Guided Backup Flow

11 — Impact

Trust in
a trustless system.

Lumen demonstrated that self-custody UX is a solvable problem — not through simplifying the technology, but through designing the emotional experience of key ownership with the same care as the technical execution.

0
Chains in Unified UI
12 chains supported in a single, unified portfolio interface — no chain-switching, no context fragmentation.
0%
Seed Phrase Abandonment Reduction
44% reduction in seed phrase abandonment through guided backup flow — from 12-word display to 3-step confirm sequence.
<3s
Average Swap Completion
Sub-3-second average swap completion — designed to feel as fast as a banking app transfer, not a DeFi protocol interaction.
44%
Seed Phrase Abandonment Reduction
Guided 3-step backup confirmation flow reduced abandonment at the seed phrase stage by 44% in prototype testing — the most critical UX problem in self-custody onboarding.

Key Learnings

What This Project Taught Me

01
The seed phrase screen is a sequencing problem, not a UX problem
The participant who stayed with me most wasn't the DeFi native — it was the 35-year-old finance professional who read "if you lose this, no one can recover your funds" and put the phone down. The message is correct and cannot be softened. What can be designed is the sequence: when does the user encounter this information, how much confidence have they built before they reach it, and what mental model are they operating with when they read it. Getting that right took more work than the entire visual system combined.
02
Visual language signals who the product is for before anything is read
Crypto iconography — coins, chains, blockchain graphics — closes the door on mainstream adoption at the first impression. The iridescent mesh was a deliberate departure from the visual conventions of the category, specifically because the target user is not the DeFi native those conventions were designed for. Designing for a new user means designing against the established visual language of the category — which is harder than it sounds when that language is deeply entrenched.
03
Bad UX in a crypto wallet doesn't mean a bad session — it can mean permanent loss of funds
Web3 UX will be the defining design problem of the next decade — not because the technology is complex, but because the stakes of getting it wrong are asymmetrically high. In most products, bad UX means a frustrated user. In a self-custody wallet, bad UX at a critical moment can mean permanent, unrecoverable financial loss. That asymmetry changes how you approach every single design decision. Comfort with ambiguity is not an option when the error state has no recovery path.
04
Security claims need visual prominence to be processed as substance
In a category with a trust deficit, security information buried in footer text is treated as boilerplate. The trust architecture section needed feature-level visual weight because that is what signals "this is substantive, not decorative." The rule generalised: the importance of information cannot exceed the visual prominence given to it. If the most important thing the product can communicate is given the least visual weight, the user correctly infers it is the least important thing.
The long version Research, personas, flows
& the thinking underneath 6 sections · the reasoning behind every decision above

Reflection

"The participant in user testing who stayed with me most wasn't the DeFi native who powered through everything. It was the 35-year-old finance professional who got to the seed phrase screen, read the words 'if you lose this, no one can recover your funds,' and put the phone down. That's the exact person Lumen is for. Getting that screen right — not softening the message, but sequencing it so it felt manageable — took more work than the entire visual system combined."
— Rupesh Chavan, Lead Product Designer
"Web3 UX will be the defining design problem of the next decade. Not because the technology is complex — because the stakes of getting it wrong are so much higher than most products. Bad UX in a crypto wallet doesn't mean a bad session. It can mean permanent loss of funds. That asymmetry changes how you approach every single design decision."
On the responsibility dimension of financial product design

Explore the Project

Browse all pages

Home Download Security Docs About Blog Careers Legal