Financial Data

Component Library

Role
Product Design | System Design
Year
2025 - 2026

150+ white-label financial research products.

Built for flexibility and designed for seamless client customization.

Intro

Powered by financial-grade component library

2,700+ reusable components built around real market data, designed for scalability, and fully synced with development.

Intro
Goal
Goal

Design and build hundreds of modular financial products, adaptable to diverse data sets and customizable for various client needs.

Establish a robust financial design component library, tightly aligned with the codebase to enable fast and efficient customization through close collaboration with engineering.

Project Outcomes
Project Outcomes
0
+
Financial module designs
Built since Q1 2025 to Q4 2026
0
+
Modules sold to Clients
Since Q2 2025 to Q4 2025
0
+
Clients using the modules
Since Q2 2025 to Q4 2025
0
+
Reusable components
Since Q1 2025 to Q3 2025
BMO
CommSec
JPMorgan Chase
NAB
RBC
Reuters
TD Bank
BMO
CommSec
JPMorgan Chase
NAB
RBC
Reuters
TD Bank
Key Features
Key Features

A scalable design system built to turn complex financial data into clear, adaptable, and insight-driven experiences.

Scan. Explore. Analyze.

A modular research flow that supports every stage — from quick-read data to comprehensive, strategy-driven analysis.

Quote
See the story in the data

Designed rich, meaningful data visualizations that help users explore, compare, and interpret complex financial information with confidence.

Growth of 10K
Built for global, scalable complexity

Each module supports variations across regions, security types, data providers, and market structures, backed by deep financial domain knowledge.

Global Markets
Designed for reuse, built for speed

A flexible component system powered by variable libraries and dev sync, enabling fast, client-specific customization and seamless delivery.

Component System
Responsive by nature

Designed for flexibility across devices, breakpoints, and themes, from desktop terminals to mobile views, light to dark.

Desktop View
Design Process
Design Process

From insight to execution, a scalable design process that transforms business goals and data into flexible, client-ready product experiences.

01

Define Requirements & Feature Scope

Define a clear and focused set of features aligned with the product vision, based on the business plan, client and user needs, and research insights.

02

Data Research & Expert Collaboration

Collaborate with financial experts and data teams to identify what matters to users, and determine how to visualize that data with clarity and value.

Data Research & Expert Collaboration
03

Design Exploration & Full-scale Iteration

Explore the full version of the product with all intended features, using scalable components from the design system to build at maximum complexity.

Design Exploration & Full-scale Iteration
04

System Updates: Components & Variables

Add or refine components and variables in the design library to support scalability across modules, markets, regions, and data providers.

System Updates: Components & Variables
05

Final Design for Release

Distill the design into a focused MVP or release version, with variations tailored to platform constraints or business priorities.

Final Design for Release
06

Client-Specific Customization

Select relevant modules based on each client’s data entitlements, then tailor them using custom variable libraries, enabling efficient front-end implementation in sync with engineering.

Client-Specific Customization
Challenges
Challenges

Every challenge was an opportunity to scale — here's how I approached it.

Ready for more?
Next Project
or
Learn about Me