WordPress VIP Design SystemNo. 014

Foundation

The VIP Design System, launched in early 2020, redesigned the WordPress VIP Dashboard. We generated new, accessible color ramps, expanding the limited brand palette scales with sufficient contrast for dark mode, product UI and marketing. We validated the work with direct customer feedback from clients like MediaNews Group and Pew Research.

Public Launch

In mid-2021, we extracted the VIP Dashboard’s component library from its private repository to a public, open-source repo on GitHub. In August 2021, we deployed the first version to the Dashboard’s beta environment and ran a company-wide call for testing, asking customer success, engineering and support teams to stress-test the new system. The public repo was born with PR #2 and eventually grew to 700+ merged pull requests over the next five years.

Token Pipeline & Integration

2022 was the year we closed all “human API” gaps.

I defined the WordPress theme architecture for our web properties, governed by shared tokens. I authored the token and component model, establishing a structure and a full semantic token vocabulary.

In June, our team held an in-person meetup in NYC to tackle design system maturity issues — Figma file architecture, governance processes, product vs. brand system unification and documentation for new designer onboarding.

In July we successfully established a live pipeline from Figma to production code. We used a variety of off-the-shelf and eventually custom tools to do this. We published the Design System Bridge as a dedicated tool for the tokens-to-WordPress part of the sync and offered that as a utility to customers. I created a custom Figma plugin to do the rest.

Accessibility & FedRAMP Compliance

The next milestone was a massive undertaking to meet Section 508 accessibility criteria. This was tied to WordPress VIP’s FedRAMP approval. The scope was enormous. We shipped “countless PRs” across both the design system and dashboard repos between December 2022 and March 2023 — fixing and rebuilding many system components. The work culminated in a completed Accessibility Conformance Report sent to NASA in spring 2023, satisfying requirements for both NASA and existing FedRAMP customers.

For ongoing support, we established an A11Y Guild to ensure accessibility remained embedded in future work, and in 2024 commissioned an external follow-up audit against the stricter WCAG 2.2 AA standard.

Vision for The Future

Our design system work has always been deeply intertwined with our usage of WordPress. With the token pipeline running and accessibility in place, I articulated a broader vision for how design systems could empower large organizations using WordPress as part of a larger system. This represented our approach to building enterprise WordPress applications that embrace pragmatic author empowerment. The argument was that enterprise WordPress sites shouldn’t need six-figure custom builds if they have sharp, system-linked tools that get out of the way.

The system produced several concrete products — the Valet WordPress theme, the Design Bridge and Figma token export tools, and VIP Block Governance plugin — with more in development.