All work

Case 02 · Options & futures trading · Luxembourg · 2022 · NDA

optionsstream

An in-house platform for trade communications, order collection and the hard working scenarios of the options and futures market.

Client
NDA
Geography
Luxembourg
Role
Lead UX/UI Designer
Year
2022
Platforms
Web · Mobile companion
Status
NDA-safe case study
A laptop on a black plinth showing the dark OptionStream terminal: an instrument card with put and call charts

The Trades Market Explorer terminal in the public version. Data and names are changed.

Intra-corporate system of trade

communications, and collection of orders

Options and futures, inside one company

01

Goals & Principles

Context. A professional desk trading options and futures worked in scattered tools. Chat sat in one place, orders in another, portfolios and analytics somewhere else again. They came to me for one interface that holds all of it and stops a specialist from rebuilding the picture in their head after every switch of a window.

Brief. Put the hard workflows into a single product interface: finding and analyzing instruments, working with portfolios, adding positions, setting parameters, talking to other specialists and keeping track of linked operations.

Principle. Working density without chaos. Tables, charts, side navigation, forms, modal states and chat threads live in one system. A specialist does not lose context when moving between operations.

  • UX architecture: flows for traders and advisers, and the chain “instrument → position → discussion → operation”.
  • Design system: components, field and button states, type and a palette built for dense data.
  • A mobile companion for watching key operations away from the desk.
  • Branding for the platform: a quiet identity for an internal product.
Data, names and some interface details are changed in the public version
The dark blue OptionStream sign-in screen with a login form and diagonal shafts of light
The sign-in screen. A strict threshold into an internal system.
02

Design system

The kit the terminal is built from: components, field and button states, tables, dialogs and the palette. Everything dense screens are made of, sorted and named.

The OptionStream design system component sheet: form fields, buttons, palette, tables and modal windows
The platform component sheet: fields, buttons, colors, tables and confirmation dialogs.
03

Big UX & UI flow

The densest screens in the system, up close. The terminal holds tables, charts and forms in one window and stays manageable.

The Trades Market Explorer terminal: a list of CBOE instruments, an option card, put and call charts
Trades Market Explorer. The instrument card keeps data, put and call charts and portfolio actions in one window.
The OptionStream professional chat: instruments discussed with trade cards embedded in the thread
Professional chats. The discussion does not leave the context of the trade.
A Success modal: positions added, and they will show up in the portfolio
Operation states. Positions land in the portfolio with feedback a trader can read.

Density here is a working tool. The fewer times a trader switches windows, the lower the price of a mistake.

A dense OptionStream position table with color coding for put and call values
Position tables. Color coding leads the eye through dense data.
The step-by-step Add trades flow: a hint walks the user through the trade form
Add trades. Step hints walk a user through a complicated form.
The OptionStream UX architecture: flows A–D and screen clusters for client manager, trader introducing, compliance and support
The system map: four flows and the role clusters, client manager, trader introducing, compliance, support. Every screen knows its place in the engine room.

+ mobile app

The mobile companion. Key operations and portfolios stay reachable away from the desk.

The OptionStream mobile app: a portfolio dashboard with a list of AAPL CBOE positions
04

Branding

A quiet identity for an internal product. All the character sits in one mark, the blue slash between “options” and “stream”.

The light OptionStream identity cover: a gray logo on white silk
The light version. The quiet of a document.
The dark OptionStream identity cover: a white logo with a blue slash on hatched navy
The dark version. Hatching as the texture of a terminal.
05

Typography & Styles

Typefaces that behave in dense data, with a size scale, and a large set of color schemes for the states the interface goes through.

OptionStream type and color: Axiforma and Inter specimens, a heading scale and a palette of tints
Axiforma and Inter specimens, the H100–H800 scale and a palette running from Black 950 to the success and error accents.
06

Some platform capabilities

Creation of various portfolios

A desk can keep as many portfolios as it needs, with different instruments, different ways to compare and monitor them, and forecasts on futures and options.

Build coefficients models

Working with coefficients: hypotheses, futures charts and volatility forecasts inside a portfolio.

Professional chats

Access to discussions with futures and options professionals, inside the platform.

Trades Market Explorer

Instruments from several markets in one list: hypotheses, adding to portfolios, experiments with strategies.

Complex parameters

Any instrument can take different models and strategies, and the parameters can be assembled to taste.

07

Outcome

The strongest effect was on the speed and quality of work inside the client’s departments. New services for clients came out of the platform, and new people were brought into the work faster. That assessment is the client’s. I did not measure it, and I have no baseline to publish.

The public version of this case is left without numbers on purpose. Data and names are changed. The rest happens in a call.

All work

A similar problem with dense data? Tell me what the screens have to hold.