fund dashboard
Project
Designed an internal dashboard that brings fund information into one place, from a quick overview to detailed performance metrics.
Users
Regional Consultants who sell funds to financial analysts, and Product Strategists who compare and position them.
Challenge
Fund information was scattered across applications, the corporate website, and other departments.
The data stays the same. The presentation follows the question.
One dashboard structure, two ways to show the same performance data.
One dashboard, two ways to read performance
Two groups needed the same fund data for very different reasons. A Regional Consultant is usually on a call and needs a number now. A Product Strategist is trying to understand why a fund is ahead of or behind its benchmarks.
“While on a call, I need to find the fund’s current price, expense ratio, yield, etc…”
“I need to find where and why this product is doing best/worst compared to our benchmarks.”
Rather than build two dashboards, I kept one structure and changed how the Standardized Performance data is presented.
For Regional Consultants, it stays a compact table that’s fast to scan mid-conversation. For Product Strategists, it expands into an interactive chart with quartile ranking bands, built for comparing a fund against its category and benchmark over time.
Testing the hierarchy before the screens
I started from component wireframes based on the business requirements. Before designing any screens, we tested what belonged on the dashboard and in what order, using paper prototypes and card sorting sessions with both user groups.
Once the hierarchy held up, we moved to Axure and InVision prototypes for early user testing, and only then designed the framework.
Two charts for two kinds of question
The detailed views answer different questions, so they behave differently. One shows how a fund’s price has moved over time. The other shows how its returns rank against competitors.
Historical price
Most people check this chart for what happened recently, so the y-axis sits on the right, next to the latest data. The range goes from one month back to the fund’s inception, at daily or monthly granularity.
There are three ways to set the timeframe: preset buttons (1M, 3M, YTD, and so on), the range navigator, or start and end dates. All three stay in sync. Each device gets the controls that suit it: the navigator on desktop, and tapping, dragging, or pinch-to-zoom on tablet.
Standardized performance
Floating stacked bars show the spread of returns in each ranking quartile, so a Product Strategist can see whether a fund’s rank reflects a real difference in returns.
Over one day, the quartiles barely differ. Over three years, they spread wide. Showing the spread makes it clear which rankings actually mean something. Hovering or tapping a period shows its returns and quartile ranges.
