Designing a Crypto Wallet App (Concept) (2024)

Concepts are a great way to put our designing skills and problem solving ability to test. As a product designer it’s always a learning to work on a concept project whenever you get time, to improve your skills. Concept designs are also a great way for beginners and budding product designers to start with their career. They not only help in improving the skills, but also a properly done concept design proves to be a valuable addition to the portfolio.

Why a Crypto Wallet?

It’s the age of blockchain tech and we could already see numerous crypto exchange apps, sites, even some cool concepts in Dribbble and Behance pop up very often. This made me want to try my hand in designing such experience. And instead of stopping with only one or two screens, or some fancy non doable interactions to just to post on dribbble, I decided to design an entire app.

The Challenge

So what does a wallet app have?
How do people use it?
What can be improved? were the main questions for which I was trying to find a solution.After trying out various wallet apps out there,I made a list of top three features which are a must have in a wallet app and decided to design a better experience for them.
1.The Dashboard/Home/Overview.
2.Coin Price Trends.
3.The Trade.
(For those who don’t know, A wallet app- is one where we can store all our crypto coins/money and also place trade for the same.)

The Dashboard/Home/Overview

This is the home screen where the user will be seeing his overall portfolio. For me as a user, it will be highly helpful if I can grab all the data at a single sight.

Data to show:
1.Main Wallet Balance
2.Individual Coin Portfolios

Some initial variations for the home screen,

1-Gives me the main balance at the top and the individual coins as cards that scroll vertically. But the individual coin cards are smaller in size and it’ll be a great challenge to fit in higher numbers and bigger names.
2-Bigger individual coin cards, but the user had to slide to move through and see other available coins.
3-Something similar to variation 2, but with vertical scroll. But again, there is limited amount of data at a single glance.
4&5-More compact view of 3, giving space to the main balance since that is what the user will need to focus on more and other split ups as a scrollable vertical list.
The final mockup of the home screen looks something like this.

Coin Price Trends

So from the home/overview screen, when the user clicks on a coin he’ll be taken to it’s individual detail page. This page will have all the trends, transactions of the coin.

Data to show:
1.Individual (Specific) coin balance.
2.Last made transactions.
3.Navigation to view other coins in the wallet.

Some initial level wireframes,

We already have the home screen that shows some similar data , so I decided to design the individual portfolio screens with the same template but with a better navigation. Tried out different sliders for the cards, but decided to use Card Flips (refer the gif in the last section to get a clear idea) to navigate between the coins — provides unique experience without affecting much data. Navigation indicators were included to let the users know where exactly they are in their portfolio.
Final mockup screens,

The Exchange/Trade

The last and the important part of the design was to come up with the flow of trade/exchange of the coins.

Data to show:
1.Buy/Sell Option.
2.Current Exchange rates.
3.Order Status.
3.Transaction List.

Designing this experience was pretty challenging. Almost all top wallet apps, takes the user to a different screen to trade, buy or sell and had multiple steps in between. I wanted to reduce the steps and also bring in some smoother and easier experience for a user to place his trade. Some initial thought process for the interactions,

Ideas are better conveyed when people can see the end results and the process. Prototyping a design is very useful for a designer to showcase his thought process to others. And not stopping with the screens, I decided to prototype the workflow. This was time consuming but worth the effort.

The whole process took me around 2 weeks time (spent 1–2 hours on it daily), and I was highly satisfied with the results. One advice I would like to give the upcoming designers is to try out their own concept apps and come up with interesting solutions like this.

(Note: There are obviously plenty of other better ways this could’ve been designed and there’s a long way of learning still to do for me. This is one of the many concepts I worked on but since this got more traction and people were asking me to share the work process, I decided to write on this one. Hope in future, I’ll write more like these (: Thanks! )

Get the free sketch file of this concept app design here.
Follow me on Dribbble if you liked my work and see more of my upcoming projects.
Get connected on Facebook, Twitter.