Apty Design System

The Problem

As Apty scaled past 3 million monthly active users across enterprise customers with wildly different KPIs and workflows, our dashboards were drifting apart. Every new customer request tended to produce a one-off layout instead of a reusable pattern, and the gap between what design specified and what engineering shipped kept widening.

• Different companies required different KPIs and workflows
• Dashboards became inconsistent as one-off requests accumulated
• Customization was introducing UX complexity design couldn’t control

The Solution

I designed and led the build of a Storybook-based, token-driven design system for Apty Analytics: a shared component library and set of rules strict enough to stay consistent at scale, but flexible enough to support customizable dashboards across dozens of enterprise use cases.

Designed for adaptable analytics experiences

Modular Dashboard Architecture

Instead of building each customer’s dashboard as a bespoke layout, I designed every widget as a self-contained module: one component that could adapt to different data types, sizes, and user needs rather than a family of near-duplicate components. That single decision is most of why the system held together as the platform kept growing.

• Configurable metrics and layouts from a shared component set
• Responsive widget behavior built once, reused everywhere
• Designed to support multiple dashboard compositions without forking code

Scalable Navigation System

The navigation experience was redesigned to improve usability while supporting role-based customization and growing product complexity.

• Customizable navigation structure
• Improved discoverability and hierarchy
• Built to support different user roles and workflows

Light & Dark Theme System

Accessibility was a company-wide push at Apty as we expanded into European and U.S. public-sector customers, so I built contrast and readability rules directly into the token set rather than leaving them to per-screen judgment. That decision is a big part of why accessibility compliance reached above 97% platform-wide.

• Unified visual language across themes
• Contrast and readability enforced at the token level, not per screen
• Consistent component behavior between modes

Responsive & Cross-Platform

The system was designed to scale seamlessly across screen sizes and devices, enabling a consistent analytics experience everywhere.

• Adaptive layouts for multiple resolutions
• Shared design language across platforms
• Built for long-term scalability

Outcome

The system cut custom CSS/JS across the platform by 87%, lifted accessibility compliance above 97%, and contributed to a 60% increase in user engagement, while becoming the shared language between design and engineering as Apty scaled to 3 million monthly active users across dozens of enterprise use cases.