cs/13 · design systems & figma plugins · asbl
Enterprise B2B SaaS Design System
Scalable Design System for 5000+ Screens
Problem
ASBL's product ecosystem had grown to 5000+ screens across 24 modules, and consistency was becoming impossible to maintain by hand. Every new feature created more visual drift, more duplicated components, and more handoff friction between design and engineering.
Role
I led the design-system strategy and structure in Figma, defined the token architecture, and worked with design and engineering teams to turn the system into a usable source of truth.
Constraints
- The system had to support enterprise-scale complexity across many product modules.
- Both light and dark themes needed to work reliably across the entire UI.
- Designers and developers needed a structure that could scale without constant manual cleanup.
- Changes had to propagate safely across thousands of screens.
Process
I audited patterns across all 24 modules, identified repeated UI structures, and mapped where components, typography, colors, and spacing were drifting. I also aligned with designers, developers, and product stakeholders on what the system needed to standardize first.
Decisions
- Built a token-based foundation: 300+ primitive tokens and 1500+ semantic tokens created a clear source-to-usage relationship.
- Used variables-based mapping: colors, typography, borders, radius, and component states were wired to update consistently at scale.
- Created element-specific token groups: icons, text, borders, buttons, and other UI layers each got their own semantic structure.
- Designed for dual-mode support: light and dark themes were built into the system instead of treated as an afterthought.
Outcome
The design system became an enterprise-ready foundation that teams could build from instead of designing every screen from scratch. It reduced ambiguity, improved reuse, and made the platform easier to scale without piling on more design debt.
Impact
- Enabled consistent design across 5000+ screens and 24 modules with a single source of truth.
- Reduced design-to-development handoff time by ensuring developers have access to exact token specifications.
- Accelerated feature development as designers and developers could reuse components and tokens without reinventing patterns.
- Simplified maintenance - design updates now propagate automatically across the entire platform through token changes.
- Established a scalable foundation that supports continued platform growth without design debt accumulation.