Case study
AXIOM Data Visualization
AXIOM Data Visualization
Creating shared chart patterns for complex financial information
Senior UX Designer · Edward Jones · 2021
Role
Senior UX designer
Timeline
2021
Scope
Chart families, interaction states, accessibility, docs
Delivery
Shared chart families and implementation guidance
Role
Senior UX designer
Scope
Chart families, interaction states, accessibility, docs
Timeline
2021
Delivery
Shared chart families and implementation guidance
A shared language for financial data
Charts across the platform used different labels, legends, scales, and interaction patterns. Advisors needed detailed financial information, while clients needed a clear view of what mattered to them. The design system needed to support both audiences without creating separate libraries that would drift apart.
Charts across the platform used different labels, legends, scales, and interaction patterns. Advisors needed detailed financial information, while clients needed a clear view of what mattered to them. The design system needed to support both audiences without creating separate libraries that would drift apart.
Finding the common jobs
I audited the existing charts and organized them around the jobs they performed: showing trends, comparisons, proportions, rankings, and distributions. That shifted the work from designing another chart for each request to defining a shared structure. The library needed to account for long labels, different currencies, negative values, limited space, and multiple display contexts.
I audited the existing charts and organized them around the jobs they performed: showing trends, comparisons, proportions, rankings, and distributions. That shifted the work from designing another chart for each request to defining a shared structure. The library needed to account for long labels, different currencies, negative values, limited space, and multiple display contexts.
Designing rules teams could reuse
I defined conventions for labels, legends, scales, color, tooltips, and interaction states, then developed chart families within the design system. I worked with engineers on implementation, piloted the patterns on product screens, and documented how teams should use them. Supporting advisor detail and client-facing clarity in the same library meant making density a deliberate choice. Each component needed enough flexibility to serve its context while keeping its behavior recognizable.
I defined conventions for labels, legends, scales, color, tooltips, and interaction states, then developed chart families within the design system. I worked with engineers on implementation, piloted the patterns on product screens, and documented how teams should use them. Supporting advisor detail and client-facing clarity in the same library meant making density a deliberate choice. Each component needed enough flexibility to serve its context while keeping its behavior recognizable.
Including the states around the data
Accessibility and empty, loading, and error states were part of the component definition. The guidance addressed color-independent meaning, contrast, and keyboard and screen-reader behavior. These decisions made the handoff more complete: teams had a defined response when data was missing or a request failed, alongside the intended presentation of a populated chart.
Accessibility and empty, loading, and error states were part of the component definition. The guidance addressed color-independent meaning, contrast, and keyboard and screen-reader behavior. These decisions made the handoff more complete: teams had a defined response when data was missing or a request failed, alongside the intended presentation of a populated chart.
Selected artifacts
Examples of shared chart structures and implementation guidance.
Shared rules for labels, scales, and legends across chart families.
Component guidelines document chart structure, behavior, and interaction states.
Result
The work established shared chart families and implementation guidance in place of separate one-off patterns. Teams could build from common components, with labels, interactions, and states defined together.
The work established shared chart families and implementation guidance in place of separate one-off patterns. Teams could build from common components, with labels, interactions, and states defined together.
© 2026 Arman Musaji
Email:
Email: