Skip to content

[UX/UI Redesign] Complete Modern Redesign of Volt Wallet – Light/Dark Mode + Full Breez + Bitrefill #15

@auwalrg8

Description

@auwalrg8

We need to redesign the entire Volt Wallet UX/UI to significantly improve usability, make Lightning feel native, better showcase Breez SDK capabilities, and add real daily utility with Bitrefill integration, while staying true to the current clean, light-first aesthetic.
Goal: Create a premium, sovereign Bitcoin + Lightning wallet that feels professional yet approachable for both new and power users

Key Objectives

Maintain clean light-first design (white/off-white background) with excellent Dark Mode support (system preference).
Make sats the primary unit while keeping easy fiat toggles.
Fully leverage latest Breez SDK features (Stable Balance, Lightning Address, improved swaps, liquidity status, etc.).
Add Bitrefill integration for airtime, data, and eSIM top-ups.
Improve information hierarchy, reduce cognitive load, and shorten critical flows.

Design Direction

Keep current app’s clean style (light background, blue accents, generous spacing, friendly illustrations).
Use Satoshi font for balances and Inter for body text.
Primary accent: Electric Blue.
Bitcoin orange for highlights.
Fully responsive to Light / Dark mode.

Screens & Flows to Redesign (Priority Order)
Phase 1 (High Priority)

Onboarding Flow (shorten to 6-7 screens max)
Welcome → Create/Restore → Backup (mnemonic + descriptor) → Verify → PIN/Biometrics → Enable Lightning + Stable Balance

Home Dashboard (main screen)
Large sats balance with BTC/USD/Stable USD toggles
Lightning vs On-chain cards with Swap button
Quick actions: Send, Receive, Swap, Scan, Bitrefill
Lightning Status card (Breez SDK, Liquidity, Stable Balance)

Unified Send Flow
Receive Flow (Lightning | On-chain | Unified tabs)

Phase 2

Swap / Zap Screen (Breez Submarine Swap)
Bitrefill Integration (full flow: country → operator → amount → pay → order status)
Transaction History + Details
Settings (reorganized with Lightning section, Stable Balance, Lightning Address, etc.)

Phase 3

Advanced Mode screens (Coin Control, PSBT, Descriptors, etc.)
Error / Empty / Loading states
Success animations
Arabic RTL optimization

New Features to Expose

Stable Balance (Breez)
Lightning Address
Clear Lightning Liquidity & Channel status
Bitrefill top-ups (Airtime, Data, eSIM)
Unified address/invoice handling
Better fee estimation and RBF/CPFP hints (in Advanced Mode)

Acceptance Criteria

All core flows redesigned and implemented
Full Light + Dark mode support
Excellent mobile UX (large touch targets, clear hierarchy)
Breez SDK features prominently displayed
Bitrefill flow fully functional
Improved onboarding with immediate backup emphasis
Consistent design system (components: buttons, cards, balance display, etc.)
Arabic RTL tested

Image

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions