Designing a scalable design system, CMS architecture, and a modern financial web experience for one of the world's leading commodities brokers — unifying product, brand, and engineering into a single cohesive ecosystem.
Role
Senior Product Designer & Design Systems Lead
Scope
Design Systems, UX Strategy, CMS Architecture, Enterprise Web
Platform
Web · App · CMS
01 — Challenge
Marex's design system had been built primarily for mobile applications. As the company expanded — launching Neon, its flagship digital platform, and scaling into web, child sites, and enterprise products — the cracks became impossible to ignore. Components behaved differently across surfaces. Brand guidelines and digital execution diverged. The website's information architecture didn't reflect the complexity of Marex's product offering.
The brief was clear in scope, less clear in priority: fix the design system, redesign the website, modernise the CMS, and make it all ready for the AI-driven content infrastructure coming next.
Components built only for mobile — missing web layouts, navigation patterns, and responsive grid. No token architecture, no shared foundations.
Typography, spacing, and colour usage varied significantly between the marketing site and product interfaces — eroding trust with enterprise clients.
The website structure didn't clearly reflect Marex's product range, making navigation inefficient for both new clients and existing relationships.
Static content management limited marketing agility. New AI-driven systems required modular, structured content — which the existing architecture couldn't provide.
02 — Process
I started with a comprehensive audit across every touchpoint: mobile apps, the marketing website, internal tools, and the Marex brand guidelines. The goal wasn't just to catalogue what existed — it was to understand which components were load-bearing and which were inconsistent duplicates masquerading as intentional design decisions.
The audit revealed over 40 duplicate components with divergent behaviour, no shared spacing or typography tokens, and a complete absence of web-specific layout patterns. This became the foundation for the rebuild roadmap.
03 — Design System
The rebuilt system started with tokens: a structured set of colour, spacing, and typography decisions that could cascade consistently across every platform. From tokens, I defined a component library covering web and app — shared foundations with platform-specific expressions where necessary.
Critically, I worked with engineering from the start — not handing over a Figma file at the end. Component decisions were tested against implementation constraints in real time, which meant the system that shipped was the system that had been designed.
04 — CMS & AI Architecture
Working closely with the engineering and AI platform team, I helped design a CMS structure built around modular content blocks — each block aligned directly to a design system component. This separation of content from presentation meant marketing could scale content independently, while the underlying structure remained consistent and machine-readable.
This was the step that transformed the CMS from a page-builder into a structured content system: content that could feed the website, power internal AI tools, and support dynamic page generation — from a single source of truth.
05 — Information Architecture & Website
Marex's product offering spans commodities trading, clearing, risk management, and technology platforms — a combination that's genuinely complex to navigate. Through user journey mapping and content prioritisation workshops with stakeholders, I restructured the site architecture to surface the most relevant pathways without flattening the depth that existing clients needed.
The visual redesign focused on what financial UX demands above everything else: clarity and credibility. Clean hierarchy, deliberate use of density, and a consistent CTA structure replaced a site that had grown organically into incoherence. The result was a modern financial-grade experience that felt authoritative without feeling inaccessible.
06 — Leadership
I facilitated cross-functional workshops with marketing, brand leadership, engineering, and the AI platform team — ensuring design decisions weren't isolated within the design function but owned across disciplines. System governance sessions established how the design system would evolve after handover, so the work wouldn't become a snapshot but a living standard.
This was the part of the project that most directly determined long-term success. A design system without organisational buy-in becomes debt. These sessions turned it into infrastructure.
07 — Outcome
Marex moved from a collection of fragmented digital products to a cohesive, system-driven ecosystem. The unified design system now covers web, app, and child platforms from a single token foundation. The CMS supports both content team autonomy and AI-ready structured content. The redesigned website communicates the breadth and credibility of Marex's offering in a way the previous site never could.
Most tangibly: design-to-development workflow accelerated significantly — components that previously required bespoke engineering decisions were now resolved at the system level, before a single line of code was written.
Key Learning 01
A design system only becomes infrastructure when it's built with engineering from the start, not handed over at the end.
Key Learning 02
CMS architecture and design systems must be designed together — structured content and structured components are two sides of the same decision.
Key Learning 03
Financial UX requires balancing information density with clarity. The tension is the design problem — not something to resolve by choosing one over the other.
"Paria brought exactly the kind of structured thinking a project like this demands. The design system she built didn't just solve our immediate problems — it gave us a foundation we can grow on."— Brand Director, Marex
Next project
Abbott Lyon — Luxury Shopify Experience →If your digital products are growing faster than your design foundations, let's talk about what a unified system can do for your team.
Start a conversation →