Symbridge is a trading platform for institutional and professional traders to buy, sell and exchange digital assets. Regulated exchange offering access to digital assets and tokenized commodities with enhanced security, speed, and transparency

I was hired to join product and develoment team to create product design for the to-be-launched exchange. I also provided design consulting on matters of product design flows, communication and branding.

There was no design assets nor any system at the start. Time pressure — we had to works as fast as possible all while the brand creation went in parallel and needed to be adjusted later.”Usual” startup difficulties — lack of MVP-aimed features and non-existent user base.

I approached to the task with an idea that design should serve as a metaphorical bridge where the management, product team and developers will meet and align their expectations. To achieve that I organized and led as many workshops as possible: to collect business requirements, technical restrictions. We utilized those meetings to quickly iterate and test design ideas on the product team. I possess a skill to create wireframe on the fly, why teammate is still talking, so it was a good project to use it on.

The team agreed to my proposal to go brandless and focus on UX, and adapt updated visuals later. I've created a detailed UI kit which served for me as hifi prototyping to save time. Of course the components were tuned in such a way that I would change them later to update design ”automagically”.

With the developers we agreed that is would also serve as single point of UI decisions — think of design tokens before they were mass-adopted in the industry.

As the project began, the navigation was quite simple — Account/Settings/"Everything" section and the heart of the exchange — trading terminal. However as the roadmap grew and features list expanded there was a need to improve the user experience a bit.

Some new features were rather products for the institutional clients and had to be easily found, as well as the basic ones like wallets management or security settings.

I've explored and tested different types of navigation, each with its benefits and drawbacks. The final decision was to display a large menu with three major sections: important sections (aka products), former "Everything" and a line with current platform status, latency and other important info. We hid it from the main screen to save some more trading space.

One of the interesting pecularitieson this project was blockchain technology impact. For instance, one of the early concepts was to make a unified data table with extended filtering. Idea behind it was to create one entry point for the user to any (table) data on the service. Some kind of reporting tool made friendlier.

However I've learned from the developers that it's not possible to pull data from the blockchain fast enough to provide smooth interaction for the users.

In the end I decided to go with a more common approach and created individual tables for each context. Well, some neccessary filters survived though. The filter placement logic within collapsible panel was reused too.

When designing data heavy apps it is important to think how to represent that data in the best suitable way. Unfortunately the angular material framework doesn't have comprehensive behavior for numbers.

Challenge accepted, the fintech users must have good table design!

There were a lot of questions I have asked myself:

What kind of data do we have at all? How to display numbers? How to display long texts? Can we collapse data? If not, how it will look and behave? How to add more info layers and show infographics? What happens when the whole table doesn't fit in the screen? Can we group columns and how to represent it? On top of that the users need to interact with the data — easily access hidden data, copy, change, change visual representation etc.

Once done you get a very powerful tool to cater to your users. Interestingly enough almost all use cases fit then into a single table or two.

Being deeply involved into brand creation process I have explored the proposed design assets to get the better feel of the language.