
Written by a model from the transcript; not yet reviewed.
Reddit principal UX engineer Blair Metcalf joins the podcast to showcase Reddit Proto, a custom prototyping harness built for product managers and designers to generate production-like prototypes using real user data. The tool eliminates the friction of Git and local environments by providing a desktop scaffold, design system components, device and theme switching, and live signed-in data rendering. The discussion covers how this system drives instant alignment during leadership reviews, how the team developed a custom Model Context Protocol (MCP) to map design tokens from Figma to production code, and how non-technical team members successfully prototype complex features without exposing GitHub.
Claire Voe introduces the episode, guest Blair Metcalf, and the topic of Reddit’s custom prototyping tool.
The host announces Firecrawl as the episode sponsor, outlining its AI data scraping capabilities.
Blair explains why Reddit decided to build its own prototyping harness to accelerate feature delivery.
Description of the harness’s architecture, including design system integration, device/theme toggles, and real‑world data usage.
Blair demonstrates how designers can annotate components to inject live Reddit data via Cursor, enabling realistic testing.
Discussion of internal URL sharing, dashboards, and a searchable console for prototype discovery and visibility.
Insights into who uses the harness most—designers, product managers, and other roles—and the culture of experimentation.
Explains the MCP workflow that translates Figma frames into production‑ready code and PRDs, integrating with engineering.
Final thoughts, contact info, and a recap of key takeaways for building custom prototyping harnesses.
Highlights how automatically generated PRDs provide context and streamline hand‑off to engineering teams.
Blair shares creative AI projects outside prototyping, such as generating team playing cards and illustrations.
Prototyping With Real Production Datainsight
The guest explains that instead of relying on static Figma mockups that fail to impress leadership, Reddit Proto allows designers to pull real user data and test features like search against actual LLM-ranked results.
Obfuscating Git For Designersstrategy
To lower the barrier to entry, the team created a desktop app that lets product managers and designers spin up a new project and start vibe-coding in any IDE without ever needing to touch Git or cloning repositories.
Vibe-Coding Search On The Spotstory
The guest demonstrates adding real search functionality and type-ahead results to a prototype simply by writing brief text annotations and letting Cursor generate the code on the spot.
Scaling Prototypes Internallydata
The guest notes that the company's internal dashboard currently hosts around 700 prototypes, prompting the team to build a searchable console categorized by tags, device types, and team ownership.
Mapping Design Systems To Productionstrategy
The guest walks through a visual representation mapping every design token across Figma, iOS, GitHub, and production code, explaining how the team uses trial, failure, and CI reviews to refine their custom MCP.
Stepping Back When AI Strugglesinsight
When asked about prompting strategy when the AI is not listening, the guest advises against yelling and instead suggests stepping back, exiting the project, and describing the intent large like a movie director.
“We wanted to innovate, go faster, and get new features into users' hands.”
“If designers are mocking everything in Figma and then they show that to leadership, leadership is going to look at that and be like, why? This isn't relevant to me.”
“We have a hundred percent adoption in UX and product. But there are like some surprising folks that show up, like a visual designer turned out to be one of our best prototypers.”
“If you make one of these real world prototypes with real data, they'll put it through the paces of like some new feature.”
Blair Metcalf is the principal UX engineer at Reddit and the builder of Reddit Proto, the company’s in-house vibe-coding harness. With a design system MCP that maps Reddit’s product language to production code, Proto has reached 100% adoption across Reddit’s UX and product org, and more than 700 prototypes are live on it. What you’ll learn: Why Reddit built its own prototyping harnessHow designers share prototypes with leadership safelyWhy real Reddit data beats mock dataHow one annotation becomes a code edit in CursorWhat a “feature capsule” isWhy Blair built a “Rosetta stone”Blair’s surprising fix when AI goes sidewaysWho turned out to be Reddit’s best prototypers— This entire episode is brought to you by: Firecrawl https://firecrawl.dev/howiai—Give your AI agents web data and beyond — In this episode, we cover: (00:00) Introduction to Blair (02:31) Reddit Proto demo (09:15) Annotations to Cursor: the targeted edit workflow (11:19) Internal deployment and adoption (14:14) How leadership reviews and gives feedback (15:52) Engineering handoff and the feature capsule (17:50) How the custom MCP was built (21:41) Quick recap (24:55) Lightning round and final thoughts — Tools referenced: • Cursor: https://www.cursor.com/ • Figma: https://www.figma.com/ • Figma MCP (Figma’s Model Context Protocol integration): https://www.figma.com/mcp-catalog/ • Code Connect (Figma’s code mapping tool): https://www.figma.com/developers/code-connect • Gemini: https://gemini.google.com/ • ChatGPT: https://chatgpt.com/ • Vercel (referenced as inspiration for internal deploy infra): https://vercel.com/ — Other references: • Reddit: https://www.reddit.com/ • Kubernetes: https://kubernetes.io/ — Where to find Blair Metcalf: LinkedIn: https://www.linkedin.com/in/jblairmetcalf — Where to find Claire Vo: ChatPRD: https://www.chatprd.ai/ Website: https://clairevo.com/ LinkedIn: https://www.linkedin.com/in/clairevo/ X: https://x.com/clairevo — Production and marketing by https://penname.co/. For inquiries about sponsoring the podcast, email [email protected].
5,250 words · 2 speakers
Speaker names marked are inferred from speaking time and the show’s known hosts — they are not voice-verified.
Page updated · transcript and summary are machine-generated