🎙️ This week on How I AI: The internal AI tool that’s transforming how Stripe designs products

05/04/26
Source: Lenny’s Newsletter by Lenny Rachitsky. Read the original article

TL;DR Summary of How Stripe Built Protodash, an AI-Driven Prototyping Platform

Protodash is an innovative AI-powered prototyping tool developed at Stripe that transforms design systems into production-quality prototypes quickly. It overcomes limitations of generic AI design tools by integrating Stripe’s unique design system, Sail, ensuring accuracy and consistency. The platform empowers both designers and PMs to collaborate more effectively, explore real product ideas early, and iterate with dynamic, data-driven prototypes. This approach enhances workflows, improves design reviews, and reduces reliance on traditional tools like Figma for complex use cases.

Optimixed’s Overview: Elevating Product Design with Stripe’s Custom AI Prototyping Solution

Introduction to Protodash and Its Origins

Protodash began as a set of Cursor rules and React components aimed at simplifying the prototyping process within Stripe. Designed by Owen Williams, a design manager with an engineering background, the platform evolved into a full web-based tool that lowers the technical barrier for designers by enabling them to generate clickable, production-quality prototypes just by running simple commands.

Challenges with Generic AI Prototyping Tools

  • Generic AI tools often produce inconsistent and inaccurate designs, dubbed “blurple slop,” due to lack of knowledge about specific design systems.
  • Stripe’s high design standards and its Sail design system required a tailored solution that could reliably produce components matching brand guidelines.
  • Protodash addresses these issues by leveraging an MCP server and custom AI rules to interpret design inputs and generate precise code.

Empowering Designers and Product Managers Alike

Unlike traditional workflows where prototyping is designer-centric, Protodash has enabled product managers (PMs) to become active creators of prototypes. This shift has improved communication and collaboration between designers and PMs, allowing PMs to:

  • Build prototypes that accurately reflect Stripe’s design language
  • Test and explore ideas earlier in the product development cycle
  • Advocate for design resources with concrete prototypes rather than abstract discussions

Dynamic, Data-Driven Prototyping

Protodash allows teams to toggle through different data states or business scenarios within prototypes—something difficult to manage in static design tools like Figma. This capability helps designers and stakeholders explore edge cases and real-world conditions sooner, improving product quality and user experience.

Integration with Design Reviews and AI Workflow Tips

Owen implemented a design review mode that facilitates commenting and AI-generated summaries directly within prototypes, streamlining feedback and iteration. Key lessons for working with AI include:

  • Being specific in initial prompts to guide the AI effectively
  • Not hesitating to reset or restart when the AI output is unsatisfactory, avoiding sunk-cost fallacy

Protodash exemplifies how customizing AI tools to a company’s unique design system and culture can significantly enhance internal workflows, empower teams, and accelerate product innovation.