Tokenization Platform

About

VC-backed institutional grade technology platform for digitizing trading, settlement and ownership of assets, beginning with precious metals based on blockchain technology

My role

As principal designer I was to create completely new product which had legacy business features and was based on already two years in development sister tokenization platform Eternyze. I hired and organized design team. Besides that I was amidst the communication across teams — product, design, development, and QA.

Pain points

Building from scratch: our product team wanted to create completely different look and feel and not just copy the existing project (EU), mainly due to different market (US). This led to delayed major feature delivery product-side and consequently to the design pivot.

Legacy: sounds contradictory to the previous point, but we did have major product features available. The point was to reinvent them for different product, different market and yet align to existing blockchain restrictions.

First steps

I've focused design efforts on establishing design library which first was based on the Angular Material framework, and together with the product owners created "basic" user flows like user onboarding, account management, banking and so on. Both in wireframes and hi fidelity screens and prototypes.

Do it with style

We kicked off with a basic brand book, but as our ideas grew, so did our style guide. I've updated it as the design language was progressing to make sure everything matched up with the big plans for the product.

I've teamed up with our frontend developers to create a special 'design-in-code' library accessible to everyone. This made it super easy to keep our design consistent and up-to-date across the whole platform.

Design pivot

As product team learned more from the business, they decided to explore fast trading interfaces, which we did. It did fit the whole platform so amazingly that the rest of the platform wrapped around the new trading interface. So I did with the design too.

To be honest ChatGPT wrote (with my guidance!) the rest of the paragraph quite well so I'll just leave it.

Our first major shift focused on crafting the trading interface, a pivotal component for our platform. Drawing from the gold standard of trading interfaces, we committed to a dark theme, a choice driven not by trend but by the practical needs of our traders. This necessity for a darker interface comes from its ease on the eyes, crucial for users spending long hours working in data-heavy environment and night trading caused by different time zones.

To integrate this essential feature, we revisited and adjusted our existing designs, ensuring a seamless blend with the new interface. This process also sparked an opportunity to refine our overall design language, enhancing the platform's usability and aesthetic appeal for our users.

One (almost) flow to rule them all

As we designed quite a number of features I've discovered repeating patterns in the user flows and unified them, utilizing mostly expandable right column. It won "competition" as the best solution, which

would not force users to lose context (separate pages go away) — most importantly on the fast trading screen;

not block screen (bye-bye popups);

and would provide enough space for complex flows. When not needed, it is dismissed and will free up even more space again.

Where are my assets?

In the wallets for sure! It's tricky as a user (or organization) can have multiple wallets with different types of assets. And they need to manage them. And the people assigned to the wallets too. Depending on the context the Wallets have corresponding functionality.

A-B-Filter

As product development progressed, I've felt the need to 1) unify all filters experience across the design and 2) save some space.

To put the filters to their respective columns was quite an obvious solution (I think...) , but how to tell users, that there are filters and their status? Not every column is filterable too.

The product team leaned towards B and I was almost sure that A was better for the reason of more prominent filter indicators. To solve this I organized a quick testing in a group of traders, who were quite into tables, but far from design pecularities. Fun fact: they didn't even notice difference and were comfortable with both scenarios!

During the test we also learned that our user base was using Excel a lot, so I've made a decision to cater to those habits and go with the in-header filter button.

Token in superposition

Token entity is a cornerstone of the whole platform. Each tokenized asset is represented differently depending on the context and its lifecycle. Data and actions vary accordingly too

Dirty hax: how to update all your tables and not miss anything

1. Collect each and every table in your product on one figma page.
2. Reassemble them with the new components.
3. Make your product owners to review everything.
4. Copy paste result back into corresponding layouts.

Some of the early day researches


Concept design assets