Vitol

Vitol · 2020-2022 · Finance, Commodities & Trading

As Vitol’s sole product designer, I turned thirteen disconnected internal apps into one coherent, configurable operating system: the company’s own Bloomberg-class workspace, built on a shared design system and Vitol’s own data.

Introduction

Vitol is one of the world’s largest commodities trading and shipping businesses, and I joined during Covid as its only product designer, responsible for the entire internal product ecosystem: roughly thirteen apps that teams across the US, Switzerland and London were each building independently. I had always wanted to design an operating system, and this was a rare chance to shape every part of one. The apps I inherited were well crafted on the surface but strategically incoherent: every one had its own navigation, its own UX and its own visual language depending on which team had built it, with no shared environment, no reusable foundation, and constant friction between teams who each wanted ownership of their product. Each trading desk made money its own way and had its own requirements, and most people used several apps at once, but never all of them and never with any consistency between them.

There was no formal brief, and that was rather the point. I set out to do what nobody had asked for: to stop designing app by app, and build a single coherent system the whole business could stand on. I broke it into three stages: unify the surface, build the foundation, then deliver the platform.

Challenges overcome

The obstacles were as much organisational as they were design ones. With thirteen apps and no shared system, moving between products meant relearning the interface each time; a team in America shipped something that looked nothing like a team in Switzerland, so there was no pattern to recognise and nothing for anything new to plug into. The previous designer had real UI finesse but had worked app by app, from scratch each time, which simply doesn’t scale with one designer: the moment a product needed something new, like a calendar component, everything stalled, because every build problem routed back through me. And the business was used to asking me for small, button-level changes, so the hardest part was making the case for a fundamentally different direction rather than more of the same.

Strategic thinking & planning

I worked in three stages. First I unified the one thing every app shared, the main navigation: wherever you landed you got the same buttons and the same interactions, steering the suite toward the way the Microsoft Office family feels like one thing. I gave each app its own colourway, redesigned every app icon so they read as a set of internally owned products, and deliberately left the big in-flight builds untouched so I wouldn’t disrupt the teams. I built a presentation and sold the direction into the business; because it was “just navigation” at that stage, it was low-friction enough to win everyone over, and for the first time the apps felt like a coherent family. That planted the real vision: this could become an internal, web-based operating system. Second, I built the foundation. The old way had small dev teams building full React component libraries from scratch, reusable nowhere, so I made the case for a supported library rather than a bespoke one. A developer audited the options and we landed on Kendo UI, which had everything we needed, a distinct style of its own, and top-tier vendor support, so component issues could be fixed by the platform rather than by us. We wired it into Vitol’s proprietary backend, which had to be done anyway, and it roughly halved the work, freeing design to focus on experience and construction instead of rebuilding primitives. On that foundation I designed Vitol’s first app, Orca, which made the vessel-clearance process visible so charterers, operations and compliance could work in one place instead of over endless email. Each vessel moved through defined clearance stages against dates and deadlines, tracked with a traffic-light status; teams could slice the data to just what applied to them, follow many vessels at once, and hold the requests and conversations that used to live in email directly in the app, visible to everyone in the chain. Working closely with a few team members throughout gave it a built-in advocate and a fast feedback loop, and Orca became the bedrock for everything that followed. Third, I delivered the platform itself. Even with a design system the apps were still standalone, and most people ran several Vitol apps alongside Bloomberg and Refinitiv Eikon across multiple monitors, which neither scales nor matches how the business actually works. When the head of our team changed over I drew a clear line: the teams no longer needed me for small iterative changes, because there was a library they could pull from and they were equipped to evolve their own apps. That freed me to focus on the vision, a single central system configurable to each person’s needs and saved to their profile, powered by an API layer that touched all the underlying APIs and shaped the information around whoever was using it. This became Detail Workspace. Everything I’d learned mapping where apps started, stopped and overlapped fed into it, so Orca, Lighthouse, Shark, GPW, Wave and Ivy could all live in one fully interactive dashboard, share the same data sources and interact. Everyone in the company runs the same app, but each person slices it into their own picture of the world. It ran on the design system I’d built, worked in light and dark mode, and was made to be future-proofed, designed hand in hand with the developers and backed by an excellent head of tech in London who understood the added difficulty was worth it.

Outcomes

Vitol ended up with an internal equivalent of a Bloomberg or Refinitiv Eikon: a unified, configurable workspace built on its own design system and its own data, replacing a fragmented set of standalone tools with one coherent operating environment. Orca alone saved hundreds of hours and hundreds of emails, with a clear snapshot replacing the dig back through inboxes, and let teams clear vessels far faster. Across two years I took thirteen disconnected apps and turned them into a scalable operating system, and the through-line was simple: refuse to design ad hoc or from scratch each time, and put the long-term needs of the business, pattern recognition, reusability and scalability, at the front of every decision, even when that meant challenging what I was asked to do.