Observability tooling for design systems
Blog post from Webflow
Webflow has developed observability tools to enhance the adoption and effectiveness of its internal design system, Spring, which was created in 2022. This system includes a component library and foundational design elements like color palettes and typography. Despite its benefits, companies often struggle with design system adoption, so Webflow created dashboards and workflows using tools like Google Forms, Sheets, Looker Studio, and GitHub Actions to monitor usage and adoption. These tools help answer critical questions about system usage, component adoption, and user challenges. Specifically, Webflow tracks adoption across product surfaces like Dashboard and Marketplace, where Spring is heavily utilized, and areas like Designer, where migration from legacy systems is ongoing. The company also uses a tool called "DS Watch" to review pull requests and identify design system usage violations. Additionally, the Design System Inspector provides real-time visualization of component usage within the app, aiding teams in migrating to Spring. These observability tools facilitate collaboration across engineering, product, and design teams, offering insights into design system performance and areas for improvement.