Kendo UI Design System

 

Overview

Role: Junior Product Designer → Design Team Lead  Timeline: 2018 – 2022

Company: ProgressProduct: Kendo UI

Between 2018 and 2022 I led the transformation of Kendo UI, a web-component library used by thousands of developers worldwide, from a set of static Photoshop files into a scalable, cross-framework design system supporting React, Angular, Vue, and jQuery. When I joined, I was the only designer; by the time I left, I was leading a small but mighty team of three. Together we established a unified design foundation, introduced accessibility and tokenized theming, and built a shared language between design and engineering that streamlined delivery and raised quality across more than 120 UI components.

 
 

When I arrived, Kendo’s design process relied entirely on static assets. The lack of a system caused visual inconsistency, accessibility gaps, and slow iteration. As the product expanded to new frameworks, these problems multiplied: each framework had its quirks, theming was complex and undocumented, and no one could maintain parity. We needed a design system flexible enough to support multiple technologies yet strict enough to ensure a coherent experience.

 

Three different renderings of the same component (DatePicker) across the different frameworks Kendo UI worked with were present when I started working on the product.

 

My goal was to build a single source of truth for all components, embed accessibility and scalability into every decision, and create documentation and processes that would let both designers and developers contribute confidently. We also wanted to grow an internal design team able to sustain the system beyond my leadership.

The work began with a full audit. I catalogued every existing component, revealing missing metrics, inconsistent spacing, and conflicting color logic. From that research I co-created a roadmap with front-end architects and established “Design System Ops” as a recurring line in the product roadmap.

Next came migration and component creation. We moved designs from Photoshop (after a short Adobe XD pilot) into Figma, standardizing foundational elements like spacing and grid ratios before tackling complex components. Redesigning data-heavy elements such as the Pivot Grid and Data Table patterns was particularly impactful, both gained improved keyboard navigation and overall ease of interaction.

 
 

With engineering, we introduced modern design tokens for color, typography, spacing, and elevation, defining inheritance rules that supported theme scalability. We structured the system using Atomic Design principles and paired it with a separate documentation site. High-use patterns like forms, dialogs, and navigation were standardized so that components behaved identically across frameworks, and every release passed through a UX review focused on pattern consistency and accessibility.

Documentation evolved alongside the system. What began as notes in Figma and GitHub grew into a dedicated portal integrated with Kendo UI’s live demo site. I authored usage guidelines, accessibility checklists, and clear “do / don’t” examples, ensuring designers and developers could adopt the system quickly and consistently.

As the system matured, I focused on people. I hired and mentored three designers, first as interns, then as full-time contributors, and fostered tight collaboration with front-end architects and product managers. Together we built a culture of shared ownership where design reviews and engineering discussions worked in tandem instead of sequence.

By the time I transitioned out, Kendo UI had a fully established, cross-framework design system. Visual and UX consistency were unified across four frameworks, design-to-development turnaround dropped by roughly 40 percent, and core components met WCAG 2.1 AA standards.

 
 

Looking back, I learned that a design system is as much about governance and culture as it is about components. Incremental foundation work builds credibility and momentum for large-scale change, and achieving cross-framework consistency demands deep empathy for developer constraints and frequent iteration. Those lessons continue to shape how I lead design systems today.

 
 

Building Accessibility Into the Heart of the Product

read next case study