Building Internal AI Tools for Design Fidelity and Efficiency

In a world awash with AI design tools promising rapid iteration, a critical question emerges: are we building faster, or just building faster bad? Owen Williams, Design Manager at Stripe, tackles this head-on in his conversation on the "How I AI" podcast, revealing how his team bypassed the pervasive "blurple slop" of generic AI outputs by building an internal prototyping studio, Protodash. This isn't just about faster prototyping; it's about fundamentally altering design reviews, engineering handoffs, and even the roles of Product Managers. Those who understand the deep, often uncomfortable, work of aligning AI tools with a specific design system and company culture will gain a significant advantage in product quality and team efficiency. This episode is essential for anyone grappling with the practical application of AI in product development, particularly those seeking to maintain a high bar for design quality.

The "Blurple Slop" and the Quest for Fidelity

The initial allure of AI design tools is their speed. However, as Owen Williams points out, this speed often comes at the cost of authenticity. Generic AI outputs, lacking an understanding of specific design systems, result in what he terms "blurple slop"--prototypes that feel "weirdly uncanny valley" and break immersion. This isn't a minor aesthetic issue; it's a systemic problem that undermines the credibility of prototypes in design reviews.

"We call the indigo 'blurple' internally, so 'blurple slop' is what I would call them. They do a really, really good job, but they don't know about your design system."

-- Owen Williams

The consequence of this "blurple slop" is a cascade of inefficiencies. Designers spend precious time trying to force generic outputs into a specific brand's aesthetic, often with limited success. This leads to design reviews where the focus shifts from the product's functionality and user experience to the awkwardness of the prototype itself. The downstream effect is a diluted feedback loop, where the core ideas are obscured by the imperfect presentation.

Williams's solution, Protodash, directly addresses this by embedding Stripe's design system, Sale, into the AI's understanding. This isn't merely about teaching an AI to recognize components; it's about constructing a system where the AI operates within the established design language. The immediate benefit is a significant increase in prototype fidelity, making them "so convincing that I'm like, 'Is this the real product, or am I looking at something fake?'" This elevated realism transforms design reviews from a critique of a JPEG or a clunky Figma file into a dynamic exploration of a near-real product. The advantage here is clear: teams can have more meaningful conversations about the product itself, leading to faster, more informed decisions.

Beyond the Browser: Devboxes and the "Demos, Not Memos" Revolution

The problem of prototype fidelity is compounded by the practicalities of development environments. Traditionally, designers might struggle with local setup, or the tools themselves might not be easily shareable. Williams tackled this by leveraging Stripe's Devbox infrastructure, creating a browser-based Protodash Studio accessible via a URL. This seemingly small architectural shift has profound implications.

Firstly, it democratizes access. Designers no longer need to worry about complex local installations; they can access a fully configured environment through a simple URL. This lowers the barrier to entry, allowing for more experimentation and iteration. The consequence is that even Product Managers, who might not have the same technical inclination as designers, can readily use the tool. Williams notes with surprise that PMs are now some of the most frequent users, able to explore product ideas visually without needing a designer to translate their concepts. This bridges a critical communication gap, allowing PMs to articulate their vision more concretely and enabling designers to focus on refinement rather than initial concept generation.

Secondly, it fuels a culture shift towards "demos, not memos." The ability to share a live, interactive prototype directly from a URL means design reviews can move beyond static presentations.

"Can I just say, being in a design review where I can click things is my favorite? I love design reviews... But for maybe the last five years, it's been like you're drowning in presentations, right? Show me a JPEG and your Figma, all of these things. How magic is it when somebody comes and they're like, 'Okay, I'm not going to screen share, here's my prototype, here's the context, let's just go through it and give feedback.'"

-- Owen Williams

This transition from static artifacts to live demos accelerates the feedback cycle. Instead of abstract discussions about potential interactions, teams can directly experience and interact with the proposed solution. This leads to more precise feedback, fewer misunderstandings, and ultimately, a more robust product. The delayed payoff here is a more efficient and effective product development process, where conversations are grounded in tangible, interactive experiences.

AI as a Co-Pilot for Craft, Not a Replacement

A persistent concern with AI in creative fields is its potential to dilute craft and lead to generic outputs. Williams actively combats this by positioning Protodash as a co-pilot, not an autopilot. The tool is designed to get users "90% of the way," providing a solid, on-brand foundation. The remaining 10%--the high craft, the subtle refinements, the unique touches--is where the designer's expertise remains paramount.

The integration of features like "annotate for AI" and AI-powered summarization of design reviews further exemplifies this philosophy. Instead of AI dictating the design, it acts as an intelligent assistant, taking specific, actionable feedback and implementing it. The "annotate for AI" feature allows designers to directly interact with the canvas, providing precise instructions for modifications, bypassing the often-frustrating experience of trying to articulate complex visual changes through text prompts alone.

"The idea there being like if you want to keep pushing it, you can. The other thing actually that we have built in, and this is where the opinionated part comes through, is you don't have to just use our design system."

-- Owen Williams

This approach creates a powerful feedback loop. Designers can leverage AI for speed and efficiency, but the AI's output is constantly guided by human expertise and the specific constraints of the design system. This ensures that while the process is accelerated, the quality and uniqueness of the design are preserved. The competitive advantage lies in this synergy: teams can explore more ideas, iterate faster, and still maintain a high level of craft, a feat difficult to achieve with off-the-shelf AI tools. The delayed payoff is a team that is not only more productive but also more creatively empowered, able to push the boundaries of what's possible within their established brand identity.

Actionable Takeaways for Building with AI

• Embrace Internal Tooling for Specificity: Recognize that off-the-shelf AI tools often lack the contextual understanding of your specific design system and workflows. Invest in building or heavily customizing internal tools to bridge this gap.
• Integrate Design Systems into AI Prompts: Train or configure AI models to deeply understand your brand's design system. This is crucial for avoiding "blurple slop" and ensuring consistent, high-fidelity outputs.
• Leverage Infrastructure for Accessibility: Utilize existing infrastructure (like Devboxes) to make powerful tools accessible via simple URLs, lowering the barrier to entry for designers and non-designers alike.
• Foster "Demos, Not Memos" Culture: Prioritize interactive, live prototypes over static assets. This accelerates feedback and leads to more informed decision-making.
• Empower PMs and Non-Designers: Build tools that allow individuals outside of traditional design roles to contribute visually. This can unblock ideas and improve communication between teams.
• AI as a Craft Augmentation Tool: Position AI as an assistant to enhance designer capabilities, not replace them. Focus on features that allow for precise feedback and iteration on AI-generated content.
• Iterate on Feedback Mechanisms: Develop sophisticated ways for users to provide feedback to AI, such as direct canvas annotation, to ensure AI outputs align with specific requirements.
• Build for Iteration, Not Perfection: Understand that internal tools don't need to be production-grade. Focus on rapid iteration and adding features based on user needs, accepting that occasional breakage is acceptable.
• Consider Low-Fidelity Modes for WIP: Implement modes that clearly signal work-in-progress, such as specific fonts or grayscale views, to manage expectations during design reviews.
• Long-Term Investment: Building and refining these internal AI-powered tools is a long-term investment that pays off in increased product quality, faster iteration cycles, and a more collaborative product development culture. The initial discomfort of building such a system yields significant competitive advantage over time.