Skip to content
How I AIHow I AI

Why this Claude Code engineer uses HTML files as AI specs | Thariq Shihipar (Anthropic)

Thariq Shihipar is an engineer at Anthropic working on the Claude Code team. He’s spent the past several months experimenting with HTML as a replacement for Markdown in planning and implementation workflows, discovering that richer visual formats lead to better human engagement—and, ultimately, better products. In this episode, filmed at Anthropic’s Code with Claude event in San Francisco, Thariq demonstrates how to use HTML artifacts to create interactive plans, build throwaway UIs for specific problems, and maintain living design systems that travel with your codebase. *What you’ll learn:* 1. Why HTML has replaced Markdown as the ideal format for AI agent communication and planning 2. How to brainstorm in HTML to get visual mockups and interactive demos instead of text lists 3. The technique for building throwaway micro-UIs to edit specific parts of your plan 4. How to create a living design system in HTML that lives in your repo and travels with every project 5. Why “complexity has to earn its keep” and how HTML helps you stay in the loop without over-constraining Claude 6. The prompting technique that gives Claude flexibility while ensuring that you get what you need 7. Why 99% of your AI-generated tokens should go to planning, interfaces, and communication—not production code *Brought to you by:* Celigo—Intelligent automation built for AI: https://celigo.com/howIAI Persona—Trusted identity verification for any use case: https://withpersona.com/lp/howiai *In this episode, we cover:* (00:00) Introduction (02:39) HTML as the new Markdown (04:30) The compute allocator mindset (05:51) How HTML makes specs more engaging (06:48) Demo: Brainstorming in HTML with Claude Code (09:24) From brainstorm to full implementation plan (11:20) Prompting philosophy: Trust Claude but give it constraints (13:50) The future of PRDs and tech specs (18:16) Making HTML specs editable (20:23) The abundance mindset (24:17) Just-in-time documentation and throwaway software (25:39) Using plans as artifacts for implementation (26:39) Demo: Living design systems in HTML (30:16) Adding comments and annotations to HTML plans (31:42) Recap: The HTML workflow (32:21) Lightning round and final thoughts *Tools referenced:* • Claude Code: https://claude.ai/code • Claude Design: https://claude.ai/design • AWS: https://aws.amazon.com/ • Figma: https://www.figma.com/ • GitHub: https://github.com/ *Other references:* • Anthropic Code with Claude event: https://claude.com/code-with-claude • SpaceX partnership announcement: https://www.anthropic.com/news/higher-limits-spacex • Jevons paradox: https://en.wikipedia.org/wiki/Jevons_paradox *Where to find Thariq Shihipar:* Website: https://www.thariq.io/ LinkedIn: https://www.linkedin.com/in/thariqshihipar/ X: https://x.com/trq212 GitHub: https://github.com/ThariqS *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 jordan@penname.co._

Thariq ShihiparguestClaire Vohost
May 18, 202635mWatch on YouTube ↗

At a glance

WHAT IT’S REALLY ABOUT

Using HTML specs to stay aligned with long-running AI agents

  1. As agent runs get longer and more expensive, planning and specs become a core “compute allocation” decision point rather than optional documentation.
  2. HTML is presented as a richer, more readable medium than Markdown for long plans, enabling visuals, mockups, and structure that humans will actually review.
  3. A workflow is demonstrated: brainstorm in HTML, interview the user to surface unknown unknowns, then generate an HTML implementation plan containing code excerpts, file structure, mockups, and logic.
  4. When a plan section is hard to edit in raw text, Claude can generate a micro-UI (a throwaway HTML app) to interactively edit decisions and then paste structured output back into the plan.
  5. The approach extends beyond one-off plans to reusable artifacts like “living design systems” encoded as HTML files that can be dropped into repos and referenced across projects and teams.

IDEAS WORTH REMEMBERING

5 ideas

Treat specs as the control surface for spend and risk.

Running an agent for hours maps directly to real cost, so the PRD/plan phase is where you decide what’s worth spending compute on and what success should look like.

Switch formats when the bottleneck is human attention, not model capability.

Models can parse Markdown fine, but humans stop reading 1,000-line plans; HTML increases engagement through layout, visuals, and scannability, keeping you “in the loop.”

Ask for “maximum context” while still leaving the model room to help.

Their prompting philosophy is a balance: specify key constraints (e.g., include code excerpts) but add an escape hatch (“whatever is needed”) so Claude can contribute structure you didn’t anticipate.

Use an interview step to surface unknown unknowns before locking a plan.

After picking an idea, Thariq has Claude ask targeted questions; this mimics good product discovery and produces a plan that matches real intent rather than assumptions.

Turn plan friction into a tailored interface, then paste results back.

Instead of editing dense tables or rules manually, generate a small HTML UI to edit fields, add/remove items, and export structured markdown/text back into the canonical plan.

WORDS WORTH SAVING

5 quotes

When you say, "Okay, Claude can run for eight hours," what you're really saying is, "Claude can spend, like, 500 bucks."

— Thariq Shihipar

All of us are becoming these compute allocators now.

— Thariq Shihipar

You're a compute allocator, babe. Like, that's, that's the job now.

— Claire Vo

HTML is a lot easier to read, and so it's just a richer communication medium between you and Claude.

— Thariq Shihipar

This is not even personal software. This is, like, sub... It's like micro-software... on top of micro-software.

— Claire Vo

HTML as the new Markdown for agent plansCompute allocator mindset and cost of long agent runsSpec/PRD importance in agentic workflowsBrainstorming with visual HTML artifactsFrom brainstorm to implementation plan (code, mockups, structure)Editable micro-apps for refining parts of a planLiving design systems as portable HTML references

High quality AI-generated summary created from speaker-labeled transcript.

Get more out of YouTube videos.

High quality summaries for YouTube videos. Accurate transcripts to search & find moments. Powered by ChatGPT & Claude AI.

Add to Chrome