Case Study

UX Case Study

Exposure Timeseries

Redesigned a complex portfolio exposure visualization to help users see long-term trends and key drivers more clearly. I added both area and line chart options so users could view composition or make comparisons, and made it possible to group and drill down by asset class, sector, country, or company. This turned a static, hard-to-read chart into an interactive tool that helps investors make decisions more quickly and confidently.

UX Case Study

Exposure Timeseries

UX Case Study

Exposure Timeseries

Role & Context

Role: Product Design Lead

Product Area: Portfolio Analytics & Investment Exposure Visualization

Primary Users: Portfolio Managers, Investment Analysts, Financial Advisors

Scope: Institutional and advisory investment teams managing multi-asset portfolios across sectors, geographies, and hierarchical asset structures

Overview

Exposure Time-Series is a portfolio analytics experience designed to help institutional investors and advisors understand how asset exposure evolves over time. The original experience relied on a single stacked area chart that was visually dense, hard to interpret, and offered limited insight beyond high-level trends.

My goal was to transform this into a decision-support tool—one that enables users to explore exposure changes across time, drill into structure, and compare entities with confidence.

The Problem

The existing exposure chart had several usability and analytical issues:

Overloaded stacked area chart

Difficult to compare individual asset classes

Small changes were visually lost

Low information density

The chart showed what changed, but not why

Rigid hierarchy

.Users could not easily regroup data (e.g., Sector → Country → Industry)

Poor scalability

As portfolios became more complex, readability degraded quickly

As a result, users relied on exports or external tools to answer basic questions.

Core questions users needed answered

How has exposure shifted over time?

Which assets are driving change?
What happens if I regroup the same data differently?
Can I compare entities without visual noise?

Constraints & Considerations

Regulatory & Compliance

I had to ensure that financial data and exposure calculations complied with strict regulatory requirements, which limited how I could transform, aggregate, or visually approximate data.
I needed to ensure that my visualizations preserved numerical accuracy and avoided misleading representations, especially when comparing stacked versus unstacked values.

Data Latency & Availability

Since exposure data was not real-time and only updated at defined reporting intervals, I needed to design the UI to clearly communicate time ranges and avoid implying live market behavior.
The large volume of historical data influenced my decisions around default time windows and progressive data loading.

Performance & Scale

Portfolios often included hundreds of entities across multiple hierarchical levels, which created performance constraints for rendering interactive time-series charts.
I balanced analytical depth with responsiveness in my visualization choices, favoring progressive disclosure, selective rendering, and user-driven drill-down over showing all data at once.

Cognitive Load & Interpretability

As a financial user who requires precision but is often time-constrained, I designed interactions to surface insights quickly without requiring manual data manipulation or exports.

Goals

Make exposure trends legible at a glance

Support progressive disclosure from overview → detail
Enable flexible grouping and regrouping
Preserve analytical accuracy without overwhelming users
Support both trend analysis and comparison tasks

Solution Overview

I updated the experience to include two visualization modes that work well together, along with features for dynamic grouping and drill-down.

Dual Visualization Modes

Area Chart — Portfolio Composition Over Time

Improvements

Clearer color hierarchy
Better stacking logic to preserve relative weight
Used primarily to understand portfolio composition and macro trends

When it’s best

Answering: “How is my portfolio allocated over time?”
Spotting long-term shifts in exposure mix

Line Charts — Comparative & Analytical View

I added a line chart view to improve comparison and precision, offering another way to view the same data.

Why line charts

Easier comparison across entities
Clear visibility into volatility and inflection points
Scales better as the number of entities grows

Enhancements

Hover interactions for exact values
Isolated lines reduce visual noise
Enables side-by-side comparison without stacking bias

When it’s best

Answering: “Which assets changed the most?”
Comparing exposure trajectories across entities

Multi-Level Grouping & Regrouping

One of the most impactful changes was allowing users to dynamically group and regroup exposure data.

Supported grouping levels

Asset class

Sector
Country
Industry
Company

Users can:

Group at one level (e.g., Sector)
Drill down into a subset (e.g., Energy → Companies)
Regroup the same data without resetting context

This turned a static chart into an explorable analytical surface.

Progressive Drill-In

The experience supports progressive disclosure:

Start with high-level exposure
Select a segment or entity
Drill into deeper levels
Instantly see how the same time series behaves at a different granularity

This reduced the need for:

Separate reports
Manual filtering workflows
External data exports

Interaction Highlights

Toggle between Area and Line views without data loss

Hover to reveal precise values
Checkbox-based entity selection for focused analysis
Time-range control to isolate specific periods

All interactions were designed to feel analyst-grade but approachable.

Trade-Offs & Constraints

Comparing stacked area charts and their ability to show differences between data sets

Kept area charts because they make it easier to see how different parts contribute to the whole.
Added line charts to improve accuracy and make it easier to compare data points.

Performance limitations