Built with LottieFiles
Mobile Crypto & Investment App Design - Using Lottiefiles
Henry Tochukwu
Overview
This project involved designing a mobile crypto and investment app focused on clarity, trust, and simplified portfolio management. The goal was to create an experience that feels secure for financial transactions while remaining approachable for both new and experienced investors.
The product allows users to deposit, withdraw, monitor portfolios, explore stocks and crypto assets, and track tax progress. Interactive elements were implemented using LottieFiles to enhance feedback, motion clarity, and perceived responsiveness.
Problem
Crypto and investment platforms often overwhelm users with dense information, volatile charts, and complex financial terminology. Many users struggle with:
Understanding total balance versus portfolio breakdown
Distinguishing between crypto and stocks quickly
Knowing the state of transactions
Feeling confident when moving money
The challenge was to design an interface that balances financial depth with simplicity and trust.
UX Decisions
1. Strong Visual Priority on Balance
The total balance is bold and positioned at the top to reinforce financial awareness. This builds trust and anchors the experience around value.
Trade off:
Prioritizing balance reduced space for quick market insights above the fold.
Impact:
Improved clarity for users who primarily check account status.
2. Clear Primary Actions
Deposit is styled as a dominant blue button while Withdraw is secondary.
Reasoning:
Encouraging deposits supports business growth while still providing equal functional access.
Trade off:
Visual bias may subtly push behavior toward funding rather than withdrawing.
Impact:
Higher likelihood of conversion on deposit action.
3. Segmented Control for Stocks and Crypto
Instead of mixing assets, a toggle separates categories.
Reasoning:
Reduces cognitive overload and improves scannability.
Trade off:
Users cannot compare stocks and crypto side by side instantly.
Impact:
Cleaner visual structure and improved focus.
4. Lottie Micro Interactions
LottieFiles was used for:
Loading states
Notification feedback
Success confirmations
Subtle button state animations
Reasoning:
Financial actions need reassurance. Motion provides feedback and emotional validation.
Trade off:
Overuse of motion could reduce performance on lower end devices.
Impact:
Improved perceived reliability and responsiveness.
5. Tax Progress Component
Including a tax tracker directly on Home reduces friction in financial awareness.
Reasoning:
Helps users feel more in control of compliance.
Trade off:
Adds another information block, increasing vertical scroll.
Impact:
Differentiates the app from purely trading focused platforms.
Notification Design
The notification section includes:
Empty state with icon
Categorized alerts
Mark as read and Delete options
This gives users control over system communication.
UX decision:
Batch actions reduce repetitive gestures.
Trade off:
Destructive actions must be carefully spaced to avoid accidental taps.
Visual Design System
Neutral background with white cards for separation
Rounded components for softness
Blue accent for action clarity
Green and red indicators for gains and losses
Consistency across cards improves scannability and trust.
Challenges
Balancing density with simplicity
Making financial data feel friendly
Designing for both beginner and experienced investors
Ensuring micro interactions enhance clarity rather than distract
Measurable Impact
Although this is an early stage product, expected outcomes include:
Reduced time to complete deposit flow
Increased deposit conversion rate
Improved daily active engagement
Lower support tickets related to transaction confusion
Areas for Improvement
Add contextual education tooltips for beginners
Introduce performance summary charts above portfolio
Improve empty states with guided actions
Add transaction status tracker with timeline visualization
Enhance accessibility, contrast ratios and dynamic type support
Implement skeleton loaders for heavy data screens
Next Steps
Conduct usability testing on deposit and withdrawal flows
A B test balance placement versus portfolio first approach
Optimize Lottie animations for performance
Add biometric confirmation for high value transactions
Introduce smart insights powered by user behavior
Reflection
Designing this crypto and investment app required careful prioritization of clarity, emotional reassurance, and functional hierarchy. The integration of Lottie micro interactions strengthened trust and reduced friction in key financial moments.
The experience demonstrates how thoughtful layout decisions, interaction feedback, and structured navigation can transform a complex financial product into a clear and confidence building mobile application.
Like this project
Posted Feb 23, 2026
Designed a crypto and investment app with clear portfolio tracking, secure transactions, structured navigation, and Lottie powered micro interactions.
Likes
1
Views
3
Timeline
Feb 10, 2026 - Feb 23, 2026
