Optimizing User Experience: A Case Study in Cryptocurrency Trading App Design

User Flow, High-Fidelity Mockup, Prototyping

Freelance Work

UI/UX Designer

Airaa is a cryptocurrency application that incorporates automated trading features or bots. This application enables users to configure profit or purchase amounts according to their preferences automatically. Additionally, users can also deposit or transfer their balances within the application. One feature that facilitates users in analyzing cryptocurrencies is the presence of market data and detailed information related to cryptocurrencies.

Goals

In my discussions with the client, I focused on delineating the objectives for this project, which are as follows: to create an application that simplifies users' ability to monitor the cryptocurrency market and to implement an Auto Trade feature designed to assist users in generating profits from cryptocurrency.

Faced new challenges

But, I faced some challenges when I got this design project from the client. These challenges might affect the decisions I make for the design later on. The challenges I faced include:

Limited experience in the field of cryptocurrency.
The a need for an in-depth analysis of design patterns related to cryptocurrency.
The abundance of information within the cryptocurrency space necessitates extensive exploration for the right layout.

How the competitors work

To understand the business processes and tackle the challenges I'm facing, I tried to gather information on three competitors who are similar or have the same type of business. It was a bit challenging to find comparable ones, but eventually, I succeeded in discovering them through the Chamjo website. These three competitor applications are widely used for crypto transactions, information I obtained from a friend who is a cryptocurrency investor.

I defined 4 scopes to benchmark these competitors:

Information structure
Layout to show crypto information
Managing consistency between elements
How the design pattern works

Let's break it down!

Rekeningku

The app is made to be super easy for you. It's got shortcuts so you can quickly find important things. It's all about helping you get the hang of cryptocurrencies without any confusion. The layout is straightforward and not too tricky, with a special emphasis on showing you how much money you can make with each type of cryptocurrency. Everything is set up to be simple and clear for you to navigate and understand easily.

Pintu

The addition of the 'Top Movers' section showcases trending cryptocurrencies, accompanied by a well-structured and easily understandable information layout. The user-friendly interface boasts a tidy and clean structure, ensuring ease of navigation even when there is a substantial amount of data. On the 'Market' page, filters and a search function are available to locate specific cryptocurrencies efficiently.

Binance Life

The design is user-friendly with a straightforward and uncluttered structure, ensuring that users can effortlessly locate the information they need. This includes a curated list of 'Hot' coins or cryptocurrencies, along with additional categories for comprehensive exploration. The overall aesthetic adopts a clean and minimalist approach, prioritizing essential information and emphasizing critical data such as cryptocurrency prices. The 'Market' page mirrors the design principles of the 'Home' page, maintaining a consistent and cohesive look for a seamless user experience. This continuity in design not only enhances visual appeal but also contributes to a sense of familiarity and ease of navigation throughout the application.

What is the summary?

I made sure the layout stayed clean and organized, even with lots of information. I present everything in a way that's easy for me to understand, using simple language. I focus on important stuff, like my balance and trends in cryptocurrencies. I follow familiar layout patterns from other products, keeping things user-friendly and easy for me to navigate.

Solution concept and tackle the challenge

Adapted similar flow

After analyzing how competitors operate, I took the findings and crafted a plan for the user flow in Airaa, aiming to make it straightforward for users to grasp. This initial plan provides a foundation for the application's development, ensuring it aligns with what users need. While there might be adjustments during the design phase, this strategic approach serves as a crucial starting point, allowing for a user-friendly and effective design for the Airaa app.

Design with a simple layout

The approach for this simple design is to display information that is considered crucial for users to know. Since the main feature of this application is Auto Trade, other less important information will not be shown. This also avoids distracting users with unnecessary elements.

Design questions

But… after I discussed with stakeholders, I had a few important questions to think about. These questions popped up because there's a ton of information about cryptocurrencies, and I want to make sure the app is user-friendly. I'm also considering using similar designs as other apps to keep things consistent.

Here are the questions:

How can people easily find the information they need on the home page? With so much crypto info available, I'm concerned the layout might become cluttered and confusing.
How can users see which cryptocurrencies are popular right now in the market? I aim to provide clear and up-to-date information on what's trending.
How can users understand the details of each cryptocurrency? Given the wealth of information, I want to avoid creating a crowded and overwhelming layout on the details page, ensuring users can easily grasp the relevant information.
How can users understand the information about auto trades? Auto trade is a primary feature, and since no other app has it, I need to be extra careful when designing it to ensure it's straightforward for users to use.

Tackling and "Got it" moment

Why so big?

I feel that the cards in the "Your assets" section are too large, taking up a lot of space for a single home page. Then, I thought about it from the perspective of a user. Would I look for other important information? What if I don't have any assets when I first sign up? This takes up a significant amount of space, and it might be better to add other important information based on user needs.

Not the best UX

Looking at this page's design, I think there's something not so good with how easy it is to use. Can users quickly see all their Crypto Trades? What if they have a lot of Crypto Trades? I assume users will have many of them, so we need a simple way and important info that they need.

Not the best way to show the detail

There are some components in my approach that I feel are lacking in displaying information about a cryptocurrency. Is this the best way to showcase a lot of crypto information? Is the card header in the details really necessary? I assume that users might get distracted by the gradient card and overlook the essential information needed to read the crypto details.

Make it better again

Restructure and simplify the layout

In this case, I modified the layout structure to be more informative and kept it simple in each section. So, there are no more oversized information cards, but rather a simple and informative setup for users to find desired information easily. I also added a "Trending" section to identify trending cryptocurrencies. Additionally, I made the "Balance" and "Today's Profit" information more informative by arranging them into two columns, eliminating the need for users to scroll to read either piece of information.

A simple way to show information

There have been significant changes to the Auto Trade and Crypto Detail pages. Feeling that the card components with gradients lacked visual appeal, I attempted to modify their structure into lists for Auto Trade and simplified and made them more informative for the detail page. Despite the abundance of information on the detail page, it can still be neatly displayed and easily readable for users.

End Result

The final outcome of the Airaa application project received positive feedback from the client, who expressed satisfaction with the design results. Unfortunately, due to a lack of time to test it with potential users, I conducted design testing with stakeholders or clients as validation of the initial hypotheses.

Moving forward, the project is still in the development stage, awaiting the final results of the Airaa application MVP release.

Lesson Learn

Design aligns with business

During my design journey, I've realized that it's essential to keep the design aligned with the business while ensuring that vital information is easily conveyed to users. Neglecting these aspects in design can render features ineffective and lead to reduced user engagement, ultimately impacting conversion rates.

Consistency Design

I believe that maintaining consistency with the agreed-upon style is crucial in design. Inconsistent design can confuse users as they navigate the application due to variations in style.