NCR's Data Visualization Design System

A scalable Data Visualization Design System for NCR to unify charts across products and streamline design

A scalable Data Visualization Design System for NCR to unify charts across products and streamline design

I helped start a Data Visualization Design System at NCR to standardize how charts and graphs were used across banking, retail, and hospitality products. This involved creating a shared visual language, implementing design tokens, and making data visualizations scalable, flexible, and consistent. My goal was to build a system that supported both design and development—saving time and reducing inconsistency across teams.

TEAM

Ryan Burch, Amy Street, John Hickok

Ryan Burch, Amy Street, John Hickok

WORK DONE

Research, Product Auditing, Information Architecture, Design Token Implementation, Documentation and guidelines

⚠️ Challenge

Synthesis overload: Each team had different needs, chart preferences, and user contexts

Scalability: Visualizations had to function across responsive breakpoints, especially for mobile interactions like long-press, zoom, or swipe

Alignment with business goals: It wasn’t just about what teams wanted—we had to prioritize charts that delivered impact

Balancing customization vs. standardization: We needed flexibility without losing cohesion

Cross-team coordination: Getting buy-in from multiple departments with competing needs required diplomacy and clarity

🛠️ Approach

Competitive and comparative research

  • Studied data viz systems from Google’s Looker and other industry tools

  • Assessed how existing products handled customization, accessibility, and responsiveness

  • Identified what came “out of the box” and what we’d need to build ourselves

Scaled using tokens + responsive behaviors

  • Built components using design tokens for spacing, color, typography, and states

  • Documented responsive chart behavior across desktop and mobile

  • Planned for enhanced mobile interactions like long press, zoom, and tooltips

Audited existing products across LOBs

  • Collected real visualizations from projects in banking, retail, and hospitality

  • Interviewed project leads to understand missing needs and chart pain points

  • Created a usage matrix to track which charts were needed across teams

Prioritized core visualizations first

  • Focused initial efforts on common charts: bar, line, pie, donut, scatter

  • Deferred more complex charts (e.g., Sankey, radar, treemaps) to future roadmap

  • Allowed product teams to submit requests for advanced visualizations

🚀 Impact

✅ Reduced design time – Designers spent 15% less time searching for or recreating data visualizations.

✅ Improved consistency – Standardized charts and graphs across LOBs, decreasing design inconsistencies by 80%.

✅ Faster development cycles – Engineers could quickly implement visualization

✅ Scalable and customizable – Teams could modify charts using design tokens while maintaining brand alignment.

✅ Stronger brand identity – Unified data visualizations helped establish a more recognizable and cohesive product suite.

✅ Streamlined design-developer collaboration – Reduced back-and-forth between teams, improving efficiency and communication.

Let’s
Collaborate

Book a call with me :-)

FIDELITO

©

FIDEL FLORES CACERES

2025

Let’s
Collaborate

Book a call with me :-)

FIDELITO

©

FIDEL FLORES CACERES

2025

Let’s
Collaborate

Book a call with me :-)

FIDELITO

©

FIDEL FLORES CACERES

2025