24Cryptex.com

24Cryptex is the trading platform with crypto assets based on binary options. Blockchain team of TopMonks delivered backend and frontend solution, design of the platform and usability tests.

Introduction - Design of the Platform and Usability Tests

About project

Our team was asked to review the 24Cryptex trading app which had problems with usability, overall look and feel of their platform.

UX Designer: Tomáš Paulus
Project Manager: Lea Petrášová
Developers: Jiří Lafek, Vašek Slavík

Original design of platform

First version of crypto binary trading platform was designed in 2016 without research or any user tests. Whole platform has been developed without further assistance of UI/UX designers so we had a lot of space for creativity and research based design.

Original Design of Platform - Investments Graph
Original Design of Platform - User Profile
Original Design of Platform - New Withdrawal
Original Design of Platform - Active Investments

Visual and testing

After initial research, competitive analysis and guerilla testing we re-created whole sitemap, information architecture and on-boarding flow. The next logical step was to create new style-guide and refresh platform for year 2018.

Colors & Typography

Black Triangle Icon In the Colors Section

Main color

Blue Triangle Icon In the Colors Section

Brand color

Green Triangle Icon In the Colors Section

Success

Yellow Triangle Icon In the Colors Section

Warning

Red Triangle Icon In the Colors Section

Error


Landing page headline / 48px Extra bold

ACTIVE INVESTMENTS

Headline / 32px Regular

Active investments

Active investments

Sub Headline / 24px Regular

Active investments

Active investments

Basic font / 16px Regular

Active investments

Active investments

Detail font / 14px Regular

Active investments

Active investments

Subtle font / 12px Regular

Active investments

Active investments

Graph font / 10px Regular

Active investments

Active investments

Refreshed visuals

Our team tested 4 colour schemes for light version and 2 schemes for a dark version of the app. The final design can be seen down below. We used a lot of negative space, bigger fonts, brighter colours and we tried to highlight the most important information for users.

Scheme For Light Version - Investments Graph
Scheme For Dark Version - Investments Graph
Scheme For Light Version - Online Wallet
Scheme For Light Version - Online Wallet
Scheme For Dark Version - User Account
Scheme For Light Version - Authentication Settings

Testing and clickable prototypes

Photo For Qualitative Testing

Qualitative testing

We tested the app with users who are regular traders and also with people who just want to try binary trading. After the initial set of subjects, we did a lot of changes to make the platform even more usable.

Photo For Clickable Prototypes In Figma

Clickable prototypes

Our UX Designer created clickable prototypes in Figma. These prototypes were used by developers to understand the interactivity of the trading platform. We also used these prototypes for user testing before implementing visual changes to the live app.


What’s the outcome? Satisfied customer.

Tomáš Paulus, UX designer from TopMonks, really knows what he's doing. Based on his research, he adapted the platform into a usable form with a professional design. We certainly recommend him further.


Karel Dostál, 24Cryptex

That’s all Folks!

We are always on the lookout for new interesting projects with good people. Need a hand? We have 120 of them. If you would like to discuss further, share feedback or ask any questions, please get in touch with Lea.

[foto] Lea Petrášová

Lea Petrášová

CEO of TopMonks Blockchain Studio


blockchain@topmonks.com