This is a project I've done as a product designer for a cryptocurrency exchange platform called Tetherland.com. I helped the company over the course of 2 years and designed the P2P trading panel, OTC trading website, the Android/ iOS apps and its landing page.
Their app has now more than 100,000+ users with 4.4 rating and is one of the most popular exchange platforms in Iran.
Challenge: How I design a big crypto exchange platform, shape its design roadmap and bring consistency over the whole platform?
(Please note that some of the designs and images are in the Persian language. I'm working on translating them for easier reading 🙂)
There are 4 main deliverables that I helped Tetherland with:
1. Trading platform (P2P) for desktop where it consists of main exchange panel, dashboard, wallet, market overview, profile, security section and referral page (jump into exchange panel).
2. Android/ iOS apps with the same ability as the desktop version (jump into app version).
3. The landing page for introducing the product, downloading the apps and with the ability of OTC trading
4. Design System to able to bring consistency over the whole platform and save time on the design and development process (jump into the design system).
Since the product I was working on was a very advanced tool with many financial capabilities and that the end users are professionals in finance who need a robust and an easy to use platform, it was essential for me to form the same mentality that a trader has. As a result and before I go into the design process, I did mainly 3 things:
1. Get into the basics of trading and learn about cryptocurrencies; I tried to educate myself in finance, different trading methods, P2P trading concepts and even theoretical knowledge about blockchain.
2. Regular meetings with the crypto specialist; The biggest opportunity for me was that I had the chance to discuss everything with their professional traders and crypto experts. So I spent a lot of time with them understanding how traders usually use a trading platform and what are their expections.
3. Become a beginner trader; To fully get the experience of trading, I started to buy and sell crypto assets on Binance. While doing this, I could feel the stress and pressure of trading and realized how a well structured platform can help the trader with their job.
Since I was the only designer on the team and we also had limited budget on user testing, I decided to heavily rely on benchmarking. Specially with companies like Binance, Coinbase, Kraken and etc. that put endless amount of time and money on researching and optimizing their product, this was a very effective approach for me to do reverse engineering and hack the reason why they are doing things in particular way.
I did this for nearly 6 platforms. Here is one part of the benchmarking where with that I could propose the optimal layout of the main P2P page:
One crucial aspect of the platform was to have a secure authentication mechanism to make the transactions safe and prevent fraud in the system. For that I helped the engineering team sharing my findings on authentication flows on competitors and mapped the desired flow for our platform.
Here is the diagram containing all the methods for signing in/up into the platform:
Since the trading platforms have many functionalities (we listed nearly a hundred), it was essential that I as the product designer identify the fundamental features that were necessary for the first launch, but also have a long-term vision for future scaling
So we listed every possible ability that I noticed on my watchlist and then with all the team members we group them into 4 categories of must have, should have, nice to have and won't have (MoSCoW method). This helped us with 2 things:
- Must have features for lunching the product
- A roadmap for scaling and development
The first batch of the designs was the desktop version of the P2P panel with all of its pages, tables, components and their variants. Here are some part of the deliverables:
Dark mode version was a later feature I designed after we got many request from our users. Since I already designed all the light mode, the main challenge was to create a color palette fits the dark mode.
Here is a screenshot of the designs of the mobile app:
I built the design system a couple of weeks before I started the design exploration phase. The reason for that was I first needed to make sure what fit based on the surface and visual level. After I became confident that everything was working well, I created the design system. It consists of typography, color pallets, iconography, grid layouts and components grouped into atoms, molecules and organisms.
Working on this project has thought me how stressful it can be when you are buying digital (or physical) goods and as a result, how I can help traders to have a relaxing and satisfying experience.
Besides that I also learned:
- Trading cryptocurrency; I entered to the trading world and experienced some aspected of a trader's life and learned different trading methods.
- Importance of design system; This project thought me in practice how putting extra time into building a reusable design system can pay off and keep consistency while changing and adding new features to the product. I've also experienced how much it saves time for both on design and development phases.
