Discovery

CypherD approached us to design their multi-chain app idea to simplify the user experience for the mainstream users of blockchain along with a crypto debit card. We started with a kick-off meeting to understand specific goals and requirements the stakeholders were looking for. CypherD’s talented team conveyed their idea on the app, we followed up with specific questions to help them share important information.

Research

• Competitor Analysis
• User Personas

With the input and understanding from the discovery phase, we started to investigate the problems faced by the users by conducting important research strategies like auditing the user experience in the current product, benchmarking the competitors and creating user personas to get to the root cause of the problem.

Design

• User Flows
• Information Architecture
• Wireframe
• Visual Design
• Clickable Prototypes
• Usability Testing

A: Competitor Analysis

By recognizing the needs and requirements of the app, we commenced by analyzing over 15 analogous applications which made over $100 Millions during the financial year. Some of them provide virtual wallets, some have multi-chain links and only a few combine both of these facilities. The most common drawbacks in these applications were they didn’t have mobile gateway browsers to blockchain Dapps and there’s no option to redeem their cryptos into cash instantly with a non-custodial crypto debit card.

B: User Persona

With the features in hand, we built user personas of ideal users to picture their problems and goals to devise product strategies for better understanding. The goal of an ideal user of this app is to receive, transfer and store multiple coins/tokens on different blockchains in the same wallet while using only a single private key to control.

A: User Flows

To begin the design process, we laid out an easy, seamless flow for users to reach their goals quickly. Users mainly have 3 functionalities in the app. Firstly, they can choose a custodial or non-custodial wallet (with a special passphrase) to begin with. Secondly, they can transfer and receive assets seamlessly. Lastly, there’s a Cross Chain Transfer feature, to send assets from the Ethereum blockchain to any other 3 blockchains: Polygon, Avalanche, Binance and vice versa. We created flows that connect these features to bring out a special, unique app for blockchain transactions.

B: Information Architecture

After finalizing the user flows, we organized the functionalities in the app in a way that meets the user’s needs. We created an experience that allows users to focus on their goals from the initial onboarding to main transactions. After this, we laid out each screen so that the user can easily find the information they need.

C: Wireframe

When creating designs for solutions that involve financial transactions, it is essential to nurture trust and loyalty within users. Seamless usability and accessibility are the two of the main factors when building trust. We focused on a simple and minimalistic approach that gives importance to easy navigation and accessibility, by highlighting the important features each page conveys.

D: Visual Design

The UI of this app is inspired from the logo given by the client. We created a mood board for stakeholders to select design inspirations, preferred fonts, iconography inspirations, characters and patterns for the app. We adopted fun, attractive colors and illustrations to take away the seriousness of the blockchain industry. The typography style has been chosen to keep legibility in mind.

E: Clickable Prototypes

In order to get a better idea of how the app will look and feel, we did a clickable prototype to test the current user flow. This helps us to optimize the flow by redesigning the missed edge cases during the initial stage of wireframing for a seamless experience throughout the app.

F: Usability Testing

We tested the final product of CypherD from the user’s perspective. We considered the overall user experience and navigation of the product. We compared the designed app with the user’s goals and expectations. We made sure all the features were integrated seamlessly.