Data visualisation framework

About the project

First, here’s a peek behind the scenes, if you’d like to explore the full design system.

As Cint’s product offering grew, so did the need for better, more consistent data visualizations. But designers weren’t sure which charts to use or how to style them (data vis knowledge is a skill), and developers were often blocked by unclear or inconsistent design decisions. This project aimed to create a shared data visualization framework for our design system and a set of ready-to-use Figma components, so teams could move faster and stay aligned.

My role in it

I led the research and design of the framework. That included defining best practices, building a chart selection guide, and creating ambitious Figma components in close collaboration with the engineering team.

Why it mattered

Product teams were constantly reinventing the wheel: designers didn’t know which charts made sense for which data, and many weren’t sure what already existed. Developers had to make custom decisions on the fly, which slowed down implementation and led to inconsistent visuals across the board. We needed a standard that was easy to adopt, flexible, and scalable across all products.

How we did it

I started by interviewing designers and product managers to understand their actual pain points—not just mine. That led to clear personas (Product Managers, Designers) and surfaced frustrations around uncertainty, repetition, and technical constraints.

Next, I audited all live products to document existing charts and gaps.

Based on that, I proposed a four-part solution:
• A chart selection framework for common use cases – view here
• General best practices (formatting, accessibility, color usage) – view here
• Chart-specific guidelines – view here
• Flexible, responsive Figma components

The Figma components were the most complex I’ve ever built. Each chart type had its own structure, built on a grid system, with smart toggles for headers, legends, and other elements—making them flexible and visually consistent.

What it achieved

The framework was fully adopted by product and design teams, and engineers updated their workflows to support it. Designers no longer had to second-guess chart decisions or design from scratch—data visualizations started appearing consistently across dashboards and reports.

Unexpectedly, the framework also caught on outside product. Teams creating presentations loved it because it was fast, easy to use, and visually aligned with the brand. The result? Clearer, more polished communication across the company.