Leveraging Subtractive AI Context for Sustainable Design Systems

Original Title: 736: Building Design Systems Using AI with TJ Pitre
ShopTalk · · Listen to Original Episode →

From One-Shot Chaos to Context-Driven Systems: The Future of AI in Design

AI is often sold as a magic button for design systems, but this is a dangerous simplification. Relying on AI to generate entire systems from scratch ignores the need for design system hygiene, which leads to technical debt that compounds over time. The real competitive advantage lies in using AI to audit, maintain, and enforce parity across the design to code gap rather than replacing human decision making. Teams that prioritize context based workflows, where AI is constrained by strict, high quality component libraries, will outpace those that treat AI as an autonomous architect. This shift requires patience, as it demands the work of grooming existing systems, but it creates a durable moat that most organizations are too impatient to build.

The Hidden Cost of AI Slop

The initial allure of AI in design is the ability to generate a full component library in seconds. However, TJ Pitre warns that this often results in a Xerox of a Xerox effect. When you unleash AI on a system with poor hygiene, such as unknown hard coded values, detached components, or inconsistent naming, the AI makes its own judgment calls to fill the gaps.

> That is like when you are unleashing AI chaos on a design system without knowing, because we are all human and we are all subject to just missing parts or forgetting things where the AI is going to make judgment calls.
>
> -- TJ Pitre

This creates a hidden consequence: the system becomes a black box. You end up with 130 percent of what you asked for, including extra variants and properties you did not need, which introduces maintenance overhead that is not visible until you attempt to scale the product. The immediate benefit of a generated system is quickly eclipsed by the downstream effect of having to debug components that do not align with your organization actual standards.

The Shift to Subtractive Context

The most sophisticated teams are moving away from additive prompting, where you ask the AI to do more, toward subtractive context. By providing the AI with a limited, canonical source of truth, such as your existing, well groomed component library, you force the model to be obedient to your established architecture.

This is where the concept of Evals becomes the filter. Using tools like Playwright or custom MCP (Model Context Protocol) harnesses, teams can run deterministic tests to ensure the AI output matches the reference design.

> Now, since those things are understood already the training models already know like the stuff that they did not know back then about the intricate details of what it takes to build a good design system. Now there are, since less is more, now we are actually peeling away things, now it is subtractive.
>
> -- TJ Pitre

By using AI to audit existing components for hard coded values or poor layer naming, you transform the AI from an unreliable creator into a high speed diagnostic engine. This approach requires the discomfort of manual cleanup today, but it pays off in 12 to 18 months by ensuring that your design system remains a reliable foundation rather than a source of technical debt.

The Ping Pong Method: Closing the Gap

The most durable systems operate in a ping pong cycle between Figma and code. Pitre emphasizes that the true truth of a design system is a moving target. Instead of forcing a one way flow from design to code, teams should leverage AI to round trip data.

When a design is prototyped in code, it can be pushed back into Figma to allow designers to noodle on the composition. This keeps the design file in sync with the actual implementation. The competitive advantage here is speed: by using AI to scaffold 16 different versions of a dashboard, teams can fail fast and identify the most effective interface before committing to a long term engineering build. This avoids the common trap of over investing in a design that does not actually work when implemented.

Key Action Items

  • Audit Your Hygiene (Immediate): Use AI to run a diagnostic report on your current component library. Identify hard coded values and detached components. This creates immediate visibility into the dark spots of your system.
  • Adopt Subtractive Prompting (Next Quarter): Stop asking AI to build me a design system. Start providing a manifest of your existing components and instruct the AI to only use those specific properties.
  • Implement Automated Evals (Next 3 to 6 Months): Integrate tools like Playwright or custom MCPs into your workflow to automatically verify that AI generated code matches your visual design references.
  • Establish the Ping Pong Workflow (12 to 18 Months): Build a pipeline where code changes can automatically update Figma components. This creates a single source of truth that is resilient to team turnover and scaling issues.
  • Prioritize Decision Models (12 to 18 Months): Explore models like Jev for constrained decision making. Instead of letting an LLM hallucinate new components, use a decision model to choose from your existing, pre approved set. This is the path to radically adaptive UIs that stay within the guardrails of your brand.

---
Handpicked links, AI-assisted summaries. Human judgment, machine efficiency.
This content is a personally curated review and synopsis derived from the original podcast episode.