Back/How I AI
How I AI

How I AI: Stripe’s Owen Williams on Killing ‘Blurple Slop’ with an Internal Prototyping Studio

Design Manager Owen Williams shows how he built Protodash, an AI-powered internal tool that has transformed how Stripe designs, reviews, and ships products—from a simple set of Cursor rules to a full-blown web studio.

Claire Vo's profile picture

Claire Vo

May 1, 2026·8 min read
How I AI: Stripe’s Owen Williams on Killing ‘Blurple Slop’ with an Internal Prototyping Studio

Welcome back to How I AI! I’m Claire Vo, and I am always on the hunt for people who are using AI in practical, inspiring ways to build better products. In this episode, I was so excited to sit down with Owen Williams, a Design Manager at Stripe. He noticed a problem that I think many of us have seen: designers using generative AI tools were creating prototypes that looked like, in his words, “generic tailwind indigo slop.”

These tools are amazing, but they don’t know your company’s specific design system. For a company like Stripe with an incredibly high quality bar, seeing prototypes with the wrong fonts, navigation, and an “uncanny valley” feel was immersion-breaking. Instead of just accepting it, Owen, who has a background in engineering, decided to build a solution. What started as a personal project has turned into an internal platform called Protodash that is fundamentally changing how designers and even PMs build and review products.

Owen walked me through the entire journey, from an initial set of Cursor rules to a full-blown, browser-based prototyping studio that lets anyone at Stripe spin up a high-fidelity, clickable prototype in minutes. We talked about why “demos, not memos” is transforming their design reviews and, surprisingly, how PMs have become the biggest users of the tool. It’s a fascinating look at the power of building custom internal tools that are precisely matched to your team’s culture.

Workflow 1: Building ProtoDash to Tame the ‘Blurple Slop’

The first problem Owen tackled was the disconnect between general-purpose AI tools and Stripe’s internal design system, called Sail. When designers used tools like v0, the results were close but not quite right. Owen called it “blurple slop”—prototypes that were good, but didn’t feel like Stripe. He realized that since design systems are predictable, an AI should be able to learn it.

### The Core Components and a 'Magic Trick'

The first version of Protodash was a pragmatic solution designed to lower the barrier to entry for designers. The goal was to create an environment where a designer might only need to know the command npm run dev to get started.

The technical stack was a combination of:

  • A React app that set up the basic Stripe dashboard chrome, navigation, and routing.
  • Stripe’s design system components from Sail.
  • An internal MCP server for Sail, allowing the AI to query for design components.
  • A bundle of custom rules for Cursor.

Initially, this ran locally. However, the real breakthrough was integrating it with Stripe’s internal dev box infrastructure. Now, a designer or PM can go to an internal URL, and in about two minutes, a fully configured development environment is spun up for them. They just connect to it via Cursor and it's ready to go. Owen calls this his “favorite magic trick” because it removes all the friction of local setup and instantly provides a shareable URL. This was the key to enabling a “demos, not memos” culture, a phrase championed by fellow Stripe design leader Dan Nelson. Instead of showing static Figma files in a design review, people could share a link to a live, clickable prototype.

### Teaching the AI with Rules

A critical part of this workflow was the set of rules Owen wrote to guide the AI. This wasn't just about providing the components; it was about teaching the AI how to use them correctly and what to avoid. Through trial and error, he refined a list of instructions.

These rules would tell the AI things like, "if a user pastes a Figma link, you should check the Sail MCP server before writing any code." It also included guardrails, like what to do if the MCP server is unavailable, because LLMs will happily hallucinate an entire design system if you let them. These rules were the secret sauce that ensured the output was 90% of the way there, leaving the final 10% for the designer’s craft and refinement.

This first version of Protodash was already a huge step forward. It solved the “blurple slop” problem and made it possible to quickly create high-fidelity prototypes for different data states, like showing a dashboard for a small startup versus a large enterprise—something incredibly tedious to do in Figma.

A developer's screen showcasing VS Code with 'Sail Component Philosophy' guidelines in a markdown file, including a JSON configuration for a 'sail' command, alongside an AI agent interface, while podcast presenters discuss the content.

Workflow 2: ProtoDash Studio, a V0 for Stripe

While the first version was a success, Owen wanted to push it further. The dream was to create an experience like v0, but one that was hyper-specific to Stripe's needs and workflows, and accessible entirely within a browser. He wanted to remove the need for an external editor like Cursor for simple tasks. This led to the creation of ProtoDash Studio, a web-based layer built on top of the original system.

### Building a Dashboard with a Single Prompt

ProtoDash Studio runs in a dev box and gives you a UI where you can see your prototypes, see what others are building, and even remix their work. The core feature is an embedded LLM that lets you prompt your way to a new design or variation right in the browser. During the demo, Owen decided to make a quick change to an existing analytics dashboard.

He simply typed:

I want to add a new variant of my prototype where the stacked chart, it's a line chart.
A dashboard view of 'Protodash Studio' showcasing various prototypes and projects, including data visualizations and abstract designs.

The tool went to work, and in moments, it generated a new variant with the requested line chart. This was all done in the browser, without opening a code editor. It even has a self-testing feature that takes a screenshot of its own work to verify the result before showing it to the user.

A user interacts with a 'Payments analytics' dashboard in 'Tofu Treasury,' while an AI assistant, 'Protodash AI,' processes a request to transform a stacked bar chart into a line chart, demonstrating a real-time development workflow with file read/write operations.

To show its power from scratch, we decided to build a completely new dashboard live. I chimed in, and we came up with this prompt together:

build a BFCM dashboard for a pet store showing live sales on a chart at the top of the page. A ticker with the latest sales. And trending products. Make sure the data is realistic and real time.

The AI went to work, calling the Sail MCP service to find the right components, figuring out the page structure, and assembling it. The first result was pretty good! The chart was a bit too tall, but it was a real, data-driven dashboard created from a single sentence.

### AI-Powered Iteration and Review

This is where the workflow gets really interesting. Instead of writing another prompt describing the element he wanted to fix, Owen used a feature he built called "annotate-for-AI." He clicked a button, selected the oversized chart on the page, and gave his feedback directly.

I don't want to lose my mind in cursor being like 'the element with class name 82 F, please fix this.' Being able to just select something and give the feedback is really exciting.
A detailed view of the 'Tofu Treasury' payments analytics dashboard, demonstrating how the 'Protodash AI' assistant interacts with and modifies dashboard display elements, including updating chart variants via code prompts and AI-generated instructions.

He told the AI, "the chart is way too tall. It should be a narrow page spanning chart," and sent it off. The AI understood the context from the visual selection and quickly fixed it.

This same thinking extends to design reviews. ProtoDash Studio has a Design Review Mode that replaces the old process of dropping feedback into a Google Doc. Team members can comment directly on the prototype. Afterwards, the designer can get an AI-generated summary of all the feedback and even queue up the comments as tasks for the AI to execute. It’s a closed-loop system that goes from feedback to implementation, all within the same tool.

Bonus Workflow: Vibe Coding a ‘Dad App’ on Parental Leave

I always love to hear what people are building in their off-hours, and Owen shared a brilliant little app he’s been vibe-coding during his parental leave. As a new parent, you end up buying a lot of stuff, and it’s impossible to keep track of it all.

So, he’s building a “dad app” to solve this. Here’s the workflow:

  1. You buy something expensive, like a bike or a TV.
  2. You take a photo of the receipt and the product with the app.
  3. The app uses AI to extract the product name, serial number, purchase date, and price.
  4. It then automatically downloads the user manual for that product.
A conceptual UI of the Tofu Treasury payment analytics dashboard, showing an optimization impact summary with recovered payment volume, cost savings, and feature-specific success rate increases.

Everything is saved in one place, so when something inevitably breaks 18 months later, you know exactly where you bought it, when the warranty expires, and where to find the manual. I even gave him a feature request: a reminder to sell the item in a few years when the kids have outgrown it! It’s a perfect example of how these tools allow us to quickly build useful, custom solutions for our own very specific problems.

More Than Just a Tool

Owen’s work on Protodash is such a powerful case study in leveraging AI to build better, faster, and in a way that truly fits your company’s culture. It’s not about replacing off-the-shelf products, but about identifying unique pain points in your workflow and building precise, opinionated tools to solve them. By doing so, he has not only improved the quality of prototypes but has also empowered PMs, streamlined design reviews, and even changed the nature of the engineering handoff.

It was fascinating to see how a project born from the frustration of “blurple slop” has evolved into a cornerstone of product development at Stripe. It just goes to show what’s possible when you combine deep domain knowledge with the power of modern AI tools.

Thanks to our sponsors!

Thank you to the sponsors of 'How I AI' for their support:

  • Celigo—Intelligent automation built for AI
  • Cursor—The best way to code with AI

Find Owen Williams on X/Twitter and his website. Find me, Claire Vo, on my website or on X/Twitter.

Start shipping
better products.

Join 100,000+ product managers who use ChatPRD to write better docs, align teams faster, and build products users love.

Free to start
No credit card
SOC 2 certified
Enterprise ready