Jump To
Overview
The goal was to build an MVP for a beginner-friendly crypto investment platform called BitbyBit. My role was to validate and refine the app’s core features, create user flows, logos and icons, and high-fidelity prototypes.
Limited resources, integration challenges, and regulatory requirements were taken into consideration during the design process.
Responsibilities
UX Design, Content Strategy, UI Design, Animation, Graphic Design, Information Architecture, and Product Design
Role
Product Designer
Timeline
3 Weeks
People still don't trust crypto
When asking people about cryptocurrency, I received the following answers:
“It moves up and down too much”
“I don’t want to risk losing my money”
“I heard crypto was a scam”
I gathered that:
People tend to view cryptocurrency negatively
Crypto is seen as a high-risk investment
People are not up-to-date with cryptocurrency news and developments
How do we introduce new investors to crypto?
BitbyBit is a crypto app enabling passive, consistent investing by rounding up purchases and investing the difference in Bitcoin and other cryptocurrencies. Our goal is to educate and help cautious users invest small amounts in credible digital assets.
How it works
Payment conducted with linked card
Transaction total is rounded up to next dollar amount
Change is added to your "Pockets"
When your Pockets reach a certain capacity, the app auto-invests the money and starts accumulating change again.
Benefits for users
Diversifies savings and hedges against inflation.
Lowers entry barriers, enabling small-capital investors.
Automates investing, reducing complexity and intimidation.
Offers a low-risk introduction to crypto.
Provides education to close the cryptocurrency knowledge gap.
BitbyBit uses a scalable revenue model by leveraging transaction volume
BitbyBit charges a fee of $0.01 per transaction and a small markup on crypto transactions it facilitates via a US-regulated exchange like Kraken or Coinbase.
User personas
Narrowing down core features based on impact and constraints
After research and interviews, 5 themes (seen below) were chosen to guide the app’s design, ensuring they resonated with user personas. Core features were prioritized by business goals, ease of implementation, and resource constraints.
Information Architecture
Home
Provide users with an overview of their account status, recent activity, and quick access to key features.
Assets
Provides detailed insights into users’ investment and funds.
Learn
Central hub for educational content to help users understand cryptocurrency and investments.
Account
Centralized location for managing user settings, security, and account preferences.
User Flows
See All
Onboarding Flow
Scenario: Lisa hates signing up for new finance apps because one-it takes long, and two-it requires a bunch of personal information.
Personal information is mandatory, but BitbyBit enhances the onboarding experience by splitting it into 3 phases, using progressive disclosure, minimizing manual input, and adding animations and success screens.
Phase 1 - Account activation
Phase 2 - KYC verification
Phase 3 - Link Bank and Cards
Withdrawal Flow
Scenario: Lisa completes onboarding and is exploring the app. She is trying to figure out how she can withdraw her money when she needs it.
The initial wireframe (Component V1) hides “Swap,” “Transfer,” and “Withdraw” buttons under a “...” icon, while the revised version (Component V2) displays all actions upfront. I chose Component V2 because it saves a step to access “Withdraw,” shows new users available actions, and does not contribute to redundancy as it is the sole component of its type on the screen.
Investment Settings Modification Flow
Scenario: Alex, who more of a risk-taker, feels that investing the change rounded up from transactions is too little for his liking.
All investment settings and customization options are consolidated in the “Account Settings” screen for easy access. Users are able to customize settings such as investment threshold, auto-invest, round-up multipliers, and more.
Initial Wireframes
See All
Visual design process
Gathering Inspiration to create a modern-looking crypto and finance app
Kraken
Seamless, multi-step cryptocurrency app onboarding with KYC
Clean, minimalist user interface
Clean charts and visuals
Simple monochromatic color scheme
Dave
Brand mascot
Spending categories
Round-up feature execution
Coinbase
Learn to earn rewards
News and updates
Cryptocurrency staking
Color
Inspired by Kraken, Coinbase, and Dave, I chose a simple palette of orange, yellow, and complementary colors to represent Bitcoin and reflect the app’s name, “BitbyBit.”
Primary
#FF9505
Secondary
#FFBB5F
Primary Background
#FFF5EE
Secondary Background
#FFECDE
Primary Text
#21190D
Secondary Text
#6A512F
Neutral 1
#8D7656
Neutral 2
#AA9D8F
Neutral 3
#B4A897
White
#FFFFFF
System-Red
#ED3737
System-Green
#42CA31
Typography
Visuals
A mascot was created, like Dave's, to inspire trust, friendliness, and lightheartedness, aiding trust-building in high-risk finance and cryptocurrency.
Icons
Cartoon-themed icons with rounded corners and varied shades create a lighthearted, gamified feel, appealing to younger users and fostering comfort.
Prototype
Next steps
Build trust, gather data, emphasize security
Flesh out security aspects and features
Fine-tune onboarding process and in-app onboarding
Gather data to improve core features and user experience
Test & Iterate
Focus on gathering data and feedback for the app.
Analyze the feedback to plan and prioritize features and improvements for the next iteration
Key learnings
Building a successful app starts with building successful core features
While brainstorming features like Bitcoin payments, lending, and staking, I realized even basic options like staking require technical expertise and regulatory oversight. For startups, focusing on the right features to allocate your limited resources to is crucial for making a successful MVP.
Crypto’s learning curve requires patience
Research shows new crypto users need time to adjust. Education, seamless onboarding, and low-risk investments ease their transition.