UI UX design for Web3 crypto wallet

CJM Design system Graphics Logo UI design UX design UX research Web design +5
Client
Ci Wallet
Timeline
4 months

Ci Wallet is a Web3 wallet that lets users securely store cryptocurrencies while also providing opportunities to earn through staking and asset swaps. We designed a user-friendly interface with tools to help users manage and grow their digital assets.

2022

Colors & typography

The color palette was carefully selected to ensure clear visual perception, while the fonts were chosen for easy readability.

Monochrome and color logo variations

We developed monochrome and color logo variations, adjusting them to highlight the brand’s professional focus.

Monochrome version
Color version
What we did:

Designed the user interface and integrated intuitive UI components that simplify key operations like staking and asset swapping

The design of the app and the landing page

When designing the Web3 wallet with features such as staking, swapping, and more, our main focus was on creating an appealing, intuitive, and clear interface to ensure a positive user experience.

Scenarios

Developed user scenarios to understand how users interact with the app, analyzing their needs and expectations to make the interface intuitive and accessible.

Wireframing

Created wireframes to test functionality and user flows before development, allowing for early feedback and adjustments.

Onboarding

Added tooltips and instructional elements to help new users navigate the app, improving overall usability and reducing onboarding friction.

App icon design

Our team designed a new app icon specifically for the App Store.

Logo
App icon
Logo
App icon

Stylized 3D graphics

Mobile and web versions of the app with a focus on simplicity and functionality

The interface is designed to be intuitive, enabling users to easily access key features such as balance management, transaction tracking, and more.

UI
Dashboard
UI
Staking
UI
Swap
UI
Staking

Transparent crypto staking process

Users can select staking durations with detailed information on potential risks and rewards to make informed decisions.

Flexible options and periodic updates on staking status and earnings enhance transparency and user control.

UI
Mobile

Dynamic and engaging landing page design

We gave special attention to the staking section, providing clear explanations on how users can earn passive income by staking their crypto assets. This section highlights proactive financial management and showcases the potential for long-term investment growth.

Landing page
Staking calculator
Landing page
Staking
Landing page
Guides
Landing page
Hero section
Landing page
Guides
Landing page
Hero section
Landing page
Hero section

UI components that merge modern design with functional usability

The UI components simplify the development process while ensuring a high-quality final digital product. They offer a balanced combination of functionality and visual appeal, enhancing user interaction and overall experience.

UI
Components

Controls

Designed for quick option selection, providing clear visuals and improving navigation within the app.

Icons

Created for consistency and clarity, enhancing information display while maintaining a modern look.

Buttons

Developed for ease of use with optimal sizing and clear labels, ensuring accessible interactions.

Inputs

Built for seamless data entry, featuring user-friendly visuals, clear hints, and validation for accurate input.

Have a project in mind?
Let’s get in touch

Share your project idea with us! If our partnership isn't the right fit, we're happy to provide valuable insights that could still benefit you.

Get in touch

View our projects

See how we transform businesses with our research-driven and innovative design approach.

Dr. David Mok View project
Topcow Productions View project
Smartphones displaying a website with comic book imagery and a newsletter signup form.
Haircheck View project