24Cryptex.com

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

Introduction - Design of the Platform and Usability Tests

About project

Our team’s task was to review 24Cryptex’s trading app which experienced some difficulties with its usability and the overall look and feel of their platform.

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

Old version problems

Redesign goals

Our process

Icon for Research In the Process Section

Research

Icon for Redesign In the Process Section

Redesign

Icon for Visuals and testing In the Process Section

Visuals and testing

The original design of the platform

The first version of the crypto binary trading platform was designed in 2016 without any prior research or user tests. The whole platform was developed without further assistance of any UI/UX designers, which offered plenty of space for our 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

Visuals and testing

After the initial research which included a competitive analysis and guerilla testing, we recreated the whole sitemap, information architecture and an onboarding flow. The next logical step was to create a new style-guide and refresh the platform for 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 various color schemes for the light version and 2 schemes for the dark version of the app. Check out the final design below. We used a lot of negative space, bigger fonts, brighter colors and finally, we highlighted the most vital 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 brought the app to life first by having it tested by users who were regular traders and also people who were simply interested in binary trading. After the initial phase of testing, we were lucky to find some opportunities for making the platform even more user-friendly.

Photo For Clickable Prototypes In Figma

Clickable prototypes

Our UX team created the 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 the visual changes to the live app.

What was the outcome? A satisfied customer.

Tomáš Paulus, a UX designer from TopMonks, really knows his business. Based on his research, he adapted the platform into a highly usable form with an immaculate design. Hit us up if you are interested in his work.

Karel Dostál, 24Cryptex

That’s all Folks!

We are always on the lookout for new and interesting projects. If you are in need of any help, let us know. We always welcome feedback and any questions you might have.

[foto] Lea Petrášová

Lea Petrášová

CEO of TopMonks Blockchain Studio

blockchain@topmonks.com