Work
Authentication Innovation Company-Wide Design System Enterprise Security Platform Healthcare Collaboration
Process
5-Step Design Framework
LinkedIn
← Back to Work

Company-Wide Design System

Role: Design System Designer · Timeline: 2020–2024 · Bitdefender, Cluj-Napoca

Co-creating a scalable, company-wide design system that unified multiple enterprise security products and gave dozens of teams a shared language for building faster and more consistently.

CONTEXT & ROLE

The Problem and My Part in Solving It

Bitdefender was undergoing a platform redesign with multiple products running different design patterns leading to UI inconsistencies across the product suite and duplicated effort between design and engineering.

I was one of four designers chosen to build the design system from scratch. My responsibilities spanned the full lifecycle:

  • Component design and documentation: from simple inputs to complex patterns like wizards and smart views
  • Cross-team collaboration: running workshops to understand component requirements across product lines
  • Engineering alignment: working closely with developers to ensure the system translated cleanly into Storybook
  • Adoption: presenting the system to teams and collecting feedback to iterate
PROCESS

How We Built It

Audit documentation
Phase 1

Audit

We started by documenting every existing pattern across all products. This gave us a complete picture of what existed, what overlapped, and what was broken. This became the foundation for everything that followed.

Top components by priority
Phase 2

Prioritization

We mapped component frequency across products and prioritised by impact. Starting with the most-used components meant we could deliver value quickly and build trust with teams before tackling more complex patterns.

Component design in Figma
Phase 3

Design

Components were designed in Figma with engineering involved from the start, not as a handoff step. Close collaboration at this stage prevented costly misalignments and kept the Storybook implementation accurate.

Component guidelines and usage
Phase 4

Documentation

Every component shipped with usage guidelines: when to use it, when not to, and how to handle edge cases. Good documentation is what separates a component library from an actual design system.

Workshop and education
Phase 5

Education

We ran workshops across product teams to present new components, walk through usage, and collect feedback. Adoption doesn't happen automatically. It requires making other teams feel ownership over the system too.

COMPONENTS

Design System Library

1 / 11
RESULTS

Impact & Outcomes

Company-Wide

Adopted across all Bitdefender products

Faster

Accelerated design and development with Storybook

Consistent

Unified UI patterns across the entire product suite

The design system was implemented as a web component library in Storybook, providing a clear and rapid implementation path for engineering teams. This technical foundation enabled faster development cycles and kept design and development in sync throughout the product lifecycle.

KEY LEARNINGS

What I Learned

Design Systems are 50% design and 50% people management

The technical work of building components is the easy part. The harder part was gaining colleagues' trust at the beginning, when we were presenting a few simple components while holding the vision of the entire system in our heads.

After delivering high-impact components like grids with filters, side panels, and wizards, teams started seeing the real benefits. That momentum made adoption self-sustaining.

What I'd do differently: I'd push for closer involvement from product teams in the audit phase, not just as information sources, but as co-owners. The adoption curve would have been shorter if teams felt the system was partly theirs from day one rather than something delivered to them.