HTML is the new Markdown: How Anthropic engineers are building with Claude Code | Thariq Shihipar

Summary

How I AI – "HTML is the new Markdown: How Anthropic engineers are building with Claude Code"

Host: Claire Vo
Guest: Thariq Shihipar (aka "RQ212"), Engineer at Anthropic
Date: May 18, 2026

---

Episode Overview

In this episode, Claire Vo sits down with Thariq Shihipar at Anthropic's inaugural "Code with Claude" developer conference to discuss a radical shift in how engineers and product teams interact with AI: moving from Markdown to HTML as the primary communication and planning medium. Thariq demonstrates practical workflows for using Claude Code to generate rich, interactive HTML artifacts for specs, mockups, design systems, and even editable micro-apps. The discussions reveal how this shift improves clarity, engagement, collaboration, and ultimately, the quality of products built with AI.

---

Key Discussion Points & Insights

1. The Shift from Markdown to HTML

• Why now?
  As Claude and similar agents produce longer, more complex plans, Markdown documents have become unwieldy and less readable, leading to disengagement. HTML, by contrast, offers a richer, more engaging way to present information—for both humans and AI agents.
  • "Markdown became a really popular way of interacting with agents...as the agents have gotten longer...the plans are so long I honestly have stopped reading them and this was honestly a mistake." (RQ212, 00:00, 03:00)
  • "HTML is a lot easier to read, and so it's just a richer communication medium between you and Claude." (RQ212, 00:31, 03:59)
• HTML for human-in-the-loop work:
  HTML artifacts can better display complex contexts, mockups, and interactive elements, keeping the human meaningfully involved.
  • "The diagrams just make it so much more evocative for me to sort of understand what's happening.” (RQ212, 08:40)

2. The Ongoing Role of Specs, PRDs, and Human Judgment

• Planning is not dead:
  Despite smarter agents, clear specs and plans remain vital—because compute is costly and choices must be made about resource allocation.
  • "When you say, okay, Claude can run for eight hours, what you're really saying is Claude can spend 500 bucks... you have to decide what is worthwhile spending the compute on." (RQ212, 04:48)
  • "You're a compute allocator, babe. That's the job." (Claire Vo, 05:35)
• HTML improves engagement:
  Better presentation helps users actually read and engage with plans/specs, leading to higher quality outcomes.
  • "Instead you're actually getting pulled into the spec or the document or the plan and then interacting with it in a way that upgrades the quality..." (Claire Vo, 05:35)

3. Live Workflow: Brainstorming, Planning, and Refining with Claude Code + HTML

• Step-by-step demo:

  • Brainstorming: Prompt Claude to generate ideas and mockups directly in HTML.
    • Example prompt: "I want to do a demo... can you brainstorm some ideas in an HTML file?"
    • Receive visual guides, mockups, and a rich agenda instantly. (06:52)
  • Specifying & refining:
    Use HTML mockups to select an idea, then have Claude create an implementation plan—complete with diagrams, code snippets, and contextual guides.
    • Example prompt: "Create an HTML file as a plan that helps me visualize what the implementation plan is. Include excerpts, mockups, code, whatever is needed to give me like maximum context." (09:50)
  • Editable micro-apps:
    For sections where input or specifics need refinement (e.g., visualization rules), ask Claude to scaffold out an editable interface (micro-app) within the HTML output.
    • "Create an editable HTML artifact to help me define the decision rules... make this a custom UI that helps me with structure, but gives me flexibility." (18:53)

• Iterative, human-centric prompting:

  • Prompts don't need to be complex. Allow Claude discretion for richer, context-aware output.
    • "With prompting, it's like this fine balance... you want to give enough information that you get what you want, but you don't want to over constrain Claude." (RQ212, 12:18)
  • Expressing trust and positive intent in your prompts leads to better outcomes.
    • "I believe in you and trust you... I trust your judgment at least. It makes me feel like I get better outcomes." (Claire Vo, 13:07)

4. HTML for Collaboration and Living Documentation

• Sharing and reviewing:
  HTML artifacts are more easily shared and reviewed across teams, using simple web hosting or internal tools.
  • "It's way better... you can upload it to AWS or something and just share the link around... likelihood of someone reading this is a hundred times better." (RQ212, 22:08)
• Living design systems:
  Encode design systems and component libraries directly as HTML files—referencable by both humans and Claude in future projects.
  • "I have an HTML file that represents my design system... typography, spacing, radius, core components... you can literally just point Claude at a folder... and it will create a HTML artifact and pass it around." (RQ212, 27:47)
  • Supports advanced workflows (component visualization pages, interactable design references) benefiting engineering, design, and marketing. (27:47–29:26)

5. Upsides and Limits: Accessibility, Editing, and Collaboration

• Addressing Markdown’s strengths:
  Markdown is traditionally easy to edit, but most real-world editing now takes place via conversation with Claude or editable HTML micro-apps.
  • "Had stopped reading [Markdown], I had stopped editing... I would end up asking Claude to edit them." (RQ212, 18:53)
  • Build custom UIs for sections needing human input, gamifying engagement and improving quality.
• HTML’s flexibility:
  Single artifacts can contain everything—from product idea to spec, code, style guide, and more—adaptable for individuals or larger teams with compartmentalized tabs/sections. (14:58)
• Search and retrieval:
  Loss of “source of truth” is less of a concern since Claude (and similar models) can rapidly locate or summarize necessary context on demand.
  • "You can toss it... if we can't ever find this again? Oh, Claude can find it for us. It's fine." (Claire Vo, 25:36)
• Custom interaction models:
  Interactivity (e.g., comment overlays, Figma/FigJam-like feedback) can be built directly into plans and assets. (30:16)

6. Philosophy and Impact: Abundance, Experimentation, and the Future

• Abundance mindset:
  The cost and friction of producing and consuming rich artifacts is now so low, it pays to optimize for clarity, quality, and engagement over rigid formats or tracking.
  • "The amount of tokens I produce that go into production code are like extremely small... but like, I'm generating so many more tokens like this. Like my dashboards, my custom interfaces..." (RQ212, 23:35)
  • "In this fun moment... you up level the things you should care about, which is like, what is the content of the plan?" (Claire Vo, 24:15)
• Future directions:
  • HTML as the new lingua franca for AI/human collaboration.
  • Just-in-time, throwaway, or micro software for every planning/communication need.
  • Innovations like living plans, interactive specs, and design systems encoded as HTML.
  • Collaboration across roles (engineering, design, marketing) is richer and easier.

---

Memorable Quotes & Moments

• On the new job of PMs:
  "I'm going to say you're a compute allocator, babe. Like, that's the job." (Claire Vo, 05:35)
• Prompting philosophy:
  "I trust you here. I want to just like be in the loop with you." (RQ212, 12:18)
• On micro software:
  "This is not even personal software. This is like micro software on top of micro software. Which is like, I've made this very personalized plan and then I'm taking a module in the personalized plan and zooming into it using a very custom UI." (Claire Vo, 20:45)
• On abundance:
  "Everything I'm interacting with is so beautiful... my hope is that it also translates into what I produce in the end." (RQ212, 23:35)
• On HTML vs. design MD:
  "Design MD is dead. Long live Design HTML." (Claire Vo, 31:54)
• Prompt etiquette:
  "I'd prefer if you're nice and friendly to Claude, that you get better output." (RQ212, 34:37)

---

Timestamps for Notable Segments

• (03:00) — Markdown’s limits and the rise of HTML for plans/specs
• (04:48) — Why human review (and compute attention) still matters
• (06:52) — Live demo: brainstorming and mockup generation with Claude/HTML
• (09:50) — Creating implementation plans and visual artifacts in HTML
• (12:18) — Prompting best practices: guiding without over-constraining
• (14:58) — Flexible, interactive specs and multi-tab HTML artifacts
• (18:53) — Editable HTML micro-apps for refining specific plan elements
• (22:08) — Sharing, collaboration, and team review using HTML assets
• (27:47) — Living design systems and referencable HTML documentation
• (30:16) — Future: interactive comments, custom interfaces in plans
• (31:53) — Stepwise workflow recap: brainstorm, plan, refine, encode in HTML
• (33:09) — SpaceX partnership/orbital compute (conference highlights)
• (34:37) — Prompt discourse: be kind, curious—don’t yell at the AI

---

Practical Steps & Copyable Workflows

Takeaway workflow for listeners:

1. Open Claude code.
2. Prompt for brainstorming/agenda in HTML (e.g., “Brainstorm demo ideas as an HTML file with visuals”).
3. Pick one idea; prompt for HTML plan (“Create an HTML file as a plan with context, excerpts, mockups, and code”).
4. Identify and refine sub-sections—ask Claude to build custom interfaces or UI for areas needing nuanced input/decision-making.
5. Leverage living HTML docs for design systems, specs, and collaboration.
6. Don’t stress about prompt perfection—clarity and intent matters more than syntax.

---

Closing Thoughts

Thariq and Claire demonstrate a future where HTML is the connective tissue between humans and advanced AI collaborators, enabling more engaging, customizable, and productive workflows. The episode is an inspiring, practical guide for anyone looking to modernize how they plan, spec, and review AI-driven work.

---

Connect with the Guest

• Thariq Shihipar (RQ212): Find him on X (formerly Twitter) at @RQ212, and reach out with Claude Code questions.

---

For more episodes, and to dig deeper into the workflows discussed, visit howiaipod.com.

Transcript

[RQ212]

Markdown became a really popular way of interacting with agents. But the plans are so long, I honestly have stopped reading them and this was honestly a mistake. I think that you still need to be really in the loop.

[Claire Veaux]

Plans matter, PRDs matter. Spec matters.

[RQ212]

When you say, okay, cloud can run for eight hours, what you're really saying is Claude can spend 500 bucks. All of us are becoming these compute allocators, right? And so you have to decide what is worthwhile spending the compute on.

[Claire Veaux]

People ask me all the time, claire, you said, product management is dead. What's next? And I'm going to say, you're a compute allocator, babe. That's the job.

[RQ212]

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

[Claire Veaux]

Instead of saying, here's a markdown document, it was like, what's the best way to convey this information so you can actually engage with it and pick something.

[RQ212]

This is the plan. It's purely in HTML. This is something that I will actually read.

[Claire Veaux]

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

[How I AI Host]

Welcome back to How I AI.

[Claire Veaux]

I'm Claire Veaux, product leader and AI

[How I AI Host]

obsessive, here on a mission to help you build better with these new tools. Recently, I was able to attend Code With Claude Anthropic's first developer conference.

[Claire Veaux]

And as part of that, I got

[How I AI Host]

to spend a little time with Tharak,

[Claire Veaux]

who works on CLAUDE code and taught me something that has blown my mind ever since I heard it.

[How I AI Host]

HTML is the new Markdown.

[Claire Veaux]

He's going to show us how to use Claude code to generate rich artifacts that both you and the agents can enjoy working on. Let's get to it.

[How I AI Host]

This episode is brought to you by Soligo. Every company today wants AI to improve how work gets done. The fastest way is building it directly into everyday business processes, automating employee onboarding, keeping customer data accurate, managing orders and inventory, or resolving finance and operations issues. When AI lives inside the flow of work, it can update records, trigger approvals, route work, and kick off the next step across systems. That's how teams operationalize AI and deliver measurable results. Soligo makes this possible. And now with Soligo Aura, it's never been easier. Soligo Aura gives you access to the entire platform through natural language, connecting your systems and turning intent into action. All of it under your control. Companies like Databricks, PayPal and Olipop rely on Soligo to run critical business operations at scale scale. Ready to operationalize AI. Visit soligo.com howiai that's C-L-I G-O.com howai

[Claire Veaux]

AI welcome to How I AI.

[RQ212]

Thanks for having me.

[Claire Veaux]

I am so excited to be here at Code with Claude in San Francisco. There's a lot of exciting things that were announced and we'll get to that in a little bit. But you told me something I was not expecting to hear today, which is you heard it here first. HTML is the new markdown. Tell us more.

[RQ212]

I mean, I think markdown became a really popular way of interacting with agents, especially like, you know, Opus 4 and Cloud 3.5 where you know, they have a plan and the plan is like how to do this feature and Maybe it's like 50 lines of code and you can edit it. Right. Like I think back then you were still like reading all of the outputs and editing the markdown and making it right. But you know, as the agents have gotten longer and longer running, when you have Opus 4.5 and 4.7, they're running for like an hour or something and the plans are so long I honestly have stopped reading them and this was honestly a mistake. Like I think that you still need to be really in the loop. You really need to understand what the agents are doing. But like a thousand line markdown file, you know, I don't even edit them anymore, I just have Claude to edit them instead. And so I think one of the things that I've been seeing emergently in the cloud code team is that like they, that we're using HTML files instead. And so HTML is like the models are still very good at it, they have a lot more context now so you can spend the more extra tokens and they like, it's a lot easier to read. Like they can have a lot more information, they're a lot scrollable, more scrollable. And when you're talking about implementation, like you know, sometimes you see Claude make these like little ASCII markdown things where you're like, oh, here's a little, you know, little mock up and it's trying really hard in HTML. It doesn't need to try nearly as hard. Right. Like there it can actually draw like things that you can look at. And so it's just a richer communication medium between you and Claude.

[Claire Veaux]

And before we go further into HTML specifically, I do have to pause because I do have a vested interest in this. Sure. Which is you are saying for the people who are not listening, listen up.

[RQ212]

Yes.

[Claire Veaux]

Plans matter, PRDs matter, spec matters. Even as these models get more intelligent, you still Feel like that's a really important part of the process.

[RQ212]

Oh, 100%. Yeah. I, I think that, you know, everyone has different views on how it'll go, but I, I think that this will just forever be the thing. Because when I. You say, okay, Claude can run for eight hours, what you're really saying is Claude can spend like 500 bucks. You know what I mean? And, and so if you're spending 500 bucks or like, I think all of us are becoming these compute allocators now. Right. And so you have to decide, like, what is worthwhile spending the compute on. Yep. And I think that happens in the spec and planning phase. Right. You have to really understand, like, what do you want? And sometimes you don't know. Sometimes you have to like, pull it out of yourself by chatting with Claude. Sometimes you have like, unknown. Unknowns you need to figure out. But yeah, I think this is like the whole thing now is just like really getting in sync with Claude about what's building.

[Claire Veaux]

I love what you said because people ask me all the time, claire, you said product management is dead. What's next? I'm going to say you're a compute allocator, babe. Like, that's the job. Now you're still doing the same thing, though. You're writing documents to decide whether or not something else should do do work in the shape of that work. Okay, so you've convinced me. HTML is the future. And I like how you said this. It's not that it is necessarily harder or easier for the agents to read. They're very smart, they can read all sorts of code. But in fact, what you're finding is that HTML makes it easier for you to engage with the content, which then up levels the quality overall because you're not, your eyes aren't crossing looking at a bunch of raw markdown, being like, whatever, it's probably good. Instead you're actually getting pulled into the spec or the document or the plan and then interacting it with a way that upgrades the quality and then you can ultimately build something better.

[RQ212]

Yeah, that's right.

[Claire Veaux]

Okay, so you're building something with the agent so the agent can manage you.

[RQ212]

You know, I'm not sure management is the right word exactly, but, you know, I just, I care a lot about being in sync with the agent. This is sort of like the features that I built in cloud code have been like that, you know, like, how can I get to know you better? So, yeah.

[Claire Veaux]

Okay, great. Well, we have Claude code up, so let's walk through how that, how that works.

[RQ212]

Yeah, so I did, like, a little bit before we started. And so I like to talk with Claude just as a human, you know, and, like, I always start with brainstorming. It's so much easier to brainstorm once you, like, you know, once you have a partner. So I was literally like, look, I'm on a Clairvaux podcast. I want to do a demo and can you brainstorm some ideas in an HTML file? And this is literally the prompt I gave it. It's not complicated. And so here you can see the eight visual demos that it made for me. And it has these little mockups as well, right? So like, PRD to working prototype. Right. Like, it searched you up, right? You saw that with a web search. Right. Whiteboard sketch to working ui, which I thought was really cool. This is such a cute, like, little thing.

[Claire Veaux]

Extremely cute. And I. It's. What's really funny is just this morning a chat PRD user messaged me and they're like, I love the mockups in chat. Purity. And I'm like, what in the world? What are you. What are you talking about? Yeah, because I have something very similar to this in Code review right now and haven't shipped it. And I'm like, did I, like, did I act? Did Claude accidentally do this? And it was that, like, cute little ascii, you know, wireframe. So this is definitely the dream. Yes, but not. But. But now you're telling me I'm going to build it. So. So it's giving you basically, instead of saying, here's a markdown document of kind of like, what you should talk to Claire about and some descriptions of things you could do instead. It was like, what's the best way to convey this information so you can actually engage with it and pick something? And it used HTML to make this visual guide of a potential agenda or a set of demos, and you just get a much richer expression.

[RQ212]

Yeah, exactly. I think another for brainstorming, one of my rules of thumb is that I'm not going to read a longer output than the screen on Claude code. So if you gave me eight ideas, I'm just not going to see all of them. But with HTML, I scrolled through all of these and, yeah, the diagrams just make it so much more evocative for me to sort of understand what's happening. Right. The slash command starter pack, Vibe code of feature flag, Dashboard. Yeah. PRD diet. And the one I ended up liking the most was the CSV to Interactive dashboards.

[Claire Veaux]

We love a dashboard.

[RQ212]

Yeah.

[Claire Veaux]

I used to say, when I was in enterprise. I guess I still am in enterprise. Software dashboards equals dollars. So I like this one.

[RQ212]

Yes.

[Claire Veaux]

Okay, so you use cloud code. You said brainstorm, but brainstorm in HTML, give me a couple things that I can talk about. You. It gave you eight ideas, including visuals and this lovely. Like why her? What the visual is? And then the. I like the risk. It's like it could go sideways as all good DeVos cam.

[RQ212]

Yeah.

[Claire Veaux]

And so you're going to pick one and then you're going to show us how you pull this through to a full plan on. On. On this idea.

[RQ212]

That's right, yeah. So I think the. What I like about HTML is like really Claude really understands this. And so my next prompt here was really like, okay, I asked it to make some mockups in the follow up prompt. And then I was like, I asked it to interview me about number eight. Right. And so this is something that, like, you know, similar to specs and PRDs. Right. Like finding out my unknown unknowns. What do I want it to do? I answered a bunch of questions and now I'm like, okay, create an HTML file as a plan that helps me visualize what the implementation plan is. Include excerpts, mockups, code, whatever is needed to give me like maximum context. Right. And so then it made me this HTML file here. Yeah, you can see now this is the plan, but it's purely in HTML. It started scripting out the podcast itself, which maybe I didn't need all of that, but we're making a skill. And so fleshed out the file system. It gave me an excerpt of the skill MD it put together like a mood board as well, some example components, some of the logic here. Yeah, Insights and templates, helper scripts. Right. And like helping me get a sense of like, what's the important things for me to know here. Yeah, this is something that like I will actually read, you know. Yeah.

[Claire Veaux]

And I want to go back to Claude code really quickly, if you don't mind, which is, you know, people are gonna ask how did it know exactly what to put into the spec? And I just, I wanna go back to. Your prompt was very simple and it's so funny. I've done, I don't know, 75 of these how I AI episodes and they get incredible outputs. And everybody's prompts like, make the thing. Hopefully it's good, kind of nice. And so I love that this prompt is literally just create an HTML file with a plan. Help me visualize. You misspelled excerpts.

[RQ212]

I did, yeah.

[Claire Veaux]

Yeah. And you're like, excerpts Mockups, code, et cetera. What is. Is needed.

[RQ212]

Yeah.

[Claire Veaux]

And so I do want to encourage people, you know, don't stress so much about what should go in the thing. And in fact, it might change initiative to initiative. It might be slightly different to engage you with the work, but like identifying what you want to get and then letting Claude, let. Letting. Letting the model do what it needs to do will do a very high quality job.

[RQ212]

Yeah, I. I think with prompting, it's like this fine balance of, like, I think you want to give enough information that you get what you want, but you don't want to over constrain Claude. And so sometimes when I see people with a lot of overbuilt skills, kind of like you're an expert planner or something, that is usually outsourcing too much and constraining it. But in this case, for example, I really did wanted to make sure it gave me code excerpts, and I wasn't sure if I did, whether it would do that. So this was really important. But then I always need to give Claude an out. You know, I always needed to be like, okay, like, you asked me for this, but, you know, like, there's something else I want to give you. And so whatever is needed to give me maximum context is like my way of saying, like, hey, Claude, like, I trust you here. I want to just like be in the loop with you.

[Claire Veaux]

Yeah, I love what you say, which is I trust you. Because my new ending prompt is not make no mistakes. Love, make no mistakes. But that's not it. I literally, like, I believe in you and trust you. Exclamation, exclamation, exclamation. I'm like, truly, I know you are capable and I believe in you to make these decisions. And so I think leaving that open ended, sort of like, whatever you gotta do. I trust your judgment at least. It makes me feel like I get better outcomes.

[RQ212]

Yeah, Yeah. I mean, I love the, like, recent twist on this where it's like, make mistakes, Claude, you know, like, fall in love, you know, like, make some bad decisions.

[Claire Veaux]

We need. We need more happenstance in our life. Okay, so you built this thing, another thing that I want to walk people through. If you pull up the plan. Because I think about this a lot, and I get people ask that, ask me this a lot, which is like, what's the future of the prd? What's the future of the tech spec? Are these things separate? Are they together? And I think what's nice is they whatever you want. Right. And whatever you want for the audience. So you are a single builder in the instance of this demo. Yep. You want it all in one piece. You want the product idea, you want the, I guess you want a 12 minute walkthrough of how you're going to demo it. You want code snippets, you want style guide, you want that all in one thing. Because this is a self contained little project that's easier to have it all at once. But what I can imagine in larger organizations is like be like put the PRD in one tab and put the tech spec in the second tab because maybe separate people would be reviewing that information. And so you can really kind of like craft a ideal spec package to whatever you want. With HTML in a way that markdown is a little bit more constrained. It has to either be like one mega file or like separate files. And I think this is just nicer from that perspective.

[RQ212]

Yeah, I think that's right. You have a lot more interactivity. I haven't asked it to make tabs here or something, but it can easily do that. It's like all the same to Claude, right?

[Claire Veaux]

Yep.

[RQ212]

I think one of the things on like the specs and PRDs is like, I think you're trying to find like the boundary of like what you need to know with Claude. And for example, if you're doing something very technical, I like to do the type interfaces. So this is like, you know, just like understanding what the types are so that I don't often care about the actual implementation of it. Just like, okay, like the types help me understand what we're building and then I might edit those. Right. And that's like the boundary I want to interface at and yeah, like across the problem. Right. Like from. Yeah. The arc of the podcast to mockups. Where do you want to interface?

[Claire Veaux]

Yeah, one, one other thing on this. Types is sort of an important input is I think types are really great and then really a validation criteria and set of tests or other ways to see if you can get what you intended to get. I know you all like just announced outcomes which is really focused on this, like kind of goal oriented. You need to achieve this thing, do whatever you need to do. And I think that is a piece that most product managers at least are not used to writing, like the technical success criteria of a feature and then how to test your way into it. I do those two things as well as like I care about the data model and the shape, the pipes, like what's going in. And then this is how you would test that you did it correctly. And with those two Bookends, you can like, everything in the middle is kind of. Kind of gravy. So that's what I think about.

[RQ212]

I think that's right. We could have a whole podcast on testing.

[Claire Veaux]

I think there's like, okay, round two. We're going to get it scheduled. Scheduled.

[RQ212]

Yes, yes, yes. Yeah, my. My tagline there is like, test verification is not testing.

[Claire Veaux]

Yeah.

[RQ212]

And so I think there's a lot of like, there used to be like, unit tests and things like that, but now. Yeah, verification can be like a rubric. Like with managed agents and outcomes. It can be like, have cloud recorded video of what it did for you, you know, so there's a lot of depth there.

[Claire Veaux]

Yeah, I keep a set of like, synthetic data, and I like running a CLI through this synthetic data because I'm like, these are all the things that have broken in the past. And if you get better at like, resolving these broken things, then we have moved forward. So I think there's just a lot of interesting verification and testing mechanisms you can do now. We are going to part two. Pressure him to do it in the. In the comments, please, please tell us.

[How I AI Host]

This episode is brought to you by Persona. You're learning to build with AI, but there's an important question you need to ask. Who is actually using your product? Is it a legitimate user, a bot, or a fraudster? Brex, Figma, Etsy, and Twilio trust Persona to answer that question. With Persona's identity verification platform, you can create branded experiences, automate fraud prevention, and

[Claire Veaux]

know who is human online.

[How I AI Host]

That makes it easy to give good users an experience that makes them feel welcome and to stop being bad actors from causing damage. And for those of you building in the AI agent space, Persona helps you verify the identities of people, businesses and developers behind agents. It's how companies like Lithic and Skyfire are pushing the frontier of agentic commerce. Learn more at with Persona.

[Claire Veaux]

Com. Okay, so you have. Have built this. But here's. Here's the objection. Yeah, I'm gonna get. Which is Markdown is accessible, right. I can like go into markdown, type in it.

[RQ212]

Yes.

[Claire Veaux]

And make edits. And so I think that is one reason is it has been so popular. It's bridge this gap between machine writable and readable. Human writable and readable at a very low level of sophistication. Right. As soon as you understand, okay, these like hash signs, mean headers, you're good to go on. On Markdown. Yes. How like, I want to fix this. How do I. How do I touch this. How do I edit this?

[RQ212]

Yeah, yeah. So I think that this is, like, a great point, right? And I think one thing I felt with Markdown was that one, because I had stopped reading them, I had stopped editing them as well, you know? And so I would end up asking Claude to edit them. And so, like, that is like, the most basic form is just to be like, hey, Claude, I didn't like this part of the plan. Can you edit it? But let's say you want to get really in the loop, right? And, like, really get in depth with it. Claude can also do that for you. So the next prompt I had and I forgot if it was here, it was here. Okay. I want to create an editable HTML artifact to help me define the decision rules. So these are the rules that it's defined here on. Like, okay, how do you take data and turn it into a visualization? And I think some of these are kind of arbitrary. And so I asked it, like, create an HTML artifact. I don't like the ones we have right now. Make this a custom UI that helps me with structure, but gives me flexibility. Design the ideal interface for this problem. I really wasn't quite sure what it would give me. And this is one of the fun parts of HTML, too. It's just like, I just want to see what Claude cooks up here. And, yeah, this is what it gave me. Right. So it's like my own beautiful custom interface. I can sort of edit any of these fields. I can hide them, I can copy. I can, you know, add new fields here, and it gives me a markdown to copy back. And so once I'm like, okay, I have this, I can copy it back into the output.

[Claire Veaux]

Okay, I want to pause because people are going to totally miss what you just did. So I'm going to repeat it, which is you have this HTML plan, and there's a section in the HTML plan that is a pretty, like, specific table of rendering and visualization rules. Yes. Per data type that you could predict would be in a CSV. Yep. And you're like, I don't like it.

[RQ212]

Nope.

[Claire Veaux]

And instead of going back into Claude code and being like, I don't like it, let's go back and forth and edit it in, like, the terminal. You said there's probably a way for me to interact with this particular problem that's ideal from a user perspective. So basically, build a throwaway UI for this very. It's like, this is not even personal software. This is like, sub. It's like micro software on top of micro software. Which is like, I've made this very personalized plan and then I'm taking a module in the personalized plan and zooming into it using a very custom UI that's going to engage me with the, the content to get to a higher quality. I also like that it's like kind of gamified. It's like very consumery. Yeah, yeah, very consumery. And you said in the prompt, give me the ideal UI for this to like, help me engage with this. You built this, then you get the data. Right. And then you're just going to bop it back into the. Into the file.

[RQ212]

Yeah, exactly.

[Claire Veaux]

So fun. Is this how you're building now? Actually it is, yeah. And do you have any challenges with, like, how are you passing this around from a collaboration perspective? Or is it just like, this is the way a single threaded product or engineering leader can get something done? It's. You're engaging with yourself and with the model and so you feel like you can own things. Full stack or do you hit friction points with collaboration? Like when somebody needs to give input on this?

[RQ212]

Yeah.

[Claire Veaux]

Or you want input?

[RQ212]

Sure, yeah, yeah. I mean, I think on the scale of an implementation plan, it's way better. Right. And I think that this is because you just like, can upload it to like, you know, whatever, AWS or something and then you just share the link around and so definitely the likelihood of, like, I don't know, Kat or Boris, like, reading this is like a hundred times better. Right. And so I think that really helps me, like present this. I also just, you know, somewhat related. I use it a lot in like collaborating overall. So, for example, you know, I report to Kat and so like every week I send her a weekly status update in HTML of everything I've done. I get caught to read my slack and just like create this message and like, she actually gets to read it and I don't have to spend that much time on it, you know, oh

[Claire Veaux]

my gosh, new competent, new internal competition is showing up. It's not just who is building the best product, it's who's building the best product that goes into building the best product and like, who is building the best product to represent themselves to the manager. But I mean, I think why you do that is not artificially for fun, it is that it is just a much more effective way to communicate across a company is with content that is engaging and at the right level of detail and consumable. And we're all pretty good at reading websites.

[RQ212]

Yeah, exactly. I think this is like, when I think of like, abundance, you know, and like, you know, we talk about like Javon's Law for software. Like, oh, like, software gets cheaper. What do you do? I'd say, like, the amount of tokens I produce that go into production code are like extremely small. It's like 1% or something, you know, but like, I'm generating so many more tokens like this. Like my dashboards, my custom interfaces, like, really trying to get a sense of like, what do I want to do. And yeah, it's like I have. Everything I'm interacting with is so beautiful. And I think my hope is that it also like, translates into what I produce in the end. Right. It's like more in the loop, it's more beautiful. It's more like, you know, like what, me and Claude working together.

[Claire Veaux]

Yeah. And I like this because I've been in the product game for quite some years, some time, many decades. And people used to get so wrapped around the axle on like, what's our source of truth for specs and what's our source of truth for PRDs? And, you know, is all this information in some centralized place that we can all access it? And is it all on the same format? Is it all on the same template? And there were these arbitrary rules because creating these content was relatively expensive. Consuming it was certainly expensive. Finding it was really hard. And I think when all of that cost goes to like functionally zero, although we're all paying our, I call them our clod chits. We're paying our clod chits. But you can kind of put stuff wherever, in whatever format, because we know these models are very good at using tools to discover the context that they need. And so I do think there's this fun moment where you really up, you like, up level the things that you should care about, which is like, what is the content of the plan? Is it a good idea? Do we feel like it's going to be executed well, as opposed to like, I can't put a interactive markdown document in our, you know, blessed document repository. And so I have to have like another asset somewhere else. And so I just, I like this idea of just in time documentation. Very, very high quality, some throwaway software, which is nice. Like, it's cheap.

[RQ212]

Yeah.

[Claire Veaux]

So you can toss it.

[RQ212]

Yeah.

[Claire Veaux]

And then I like, you know, the executive in me is like, what if we can't ever find this again? I'm like, oh, Claude, Claude can find it for us. It's fine.

[RQ212]

Definitely.

[Claire Veaux]

And then do you feel like this results in better products? Like Would you. How would you build off of this? Would you say, plan's good, let's go?

[RQ212]

Yeah, I think so. I didn't hit implement on this, but yeah, I would basically use this as an artifact and so I would clear context and I would say like, here's a plan, you know, implement it. You could also have like, you can also use this as a source of checking the truth, right. And so again, a benefit of HTML is like, I've got a little mock up here as well. So, right, I can have the verification or I can have the verification agent check like, hey, what did I intend to do and what actually came out in the output. Right. So yeah, I think this is like really helps Claude be more in the loop. I've got some other examples of plans here that we can.

[Claire Veaux]

Let's see it.

[RQ212]

Yeah, this is like a post I'm working on. So like it's just like different ways I'm using cloud code or, sorry, using HTML with cloud code. And one of my favorites is this living design system. And so it's this idea that like, you know, oftentimes when I am making, let's say a new app in the anthropic design system, right? Like cloud design does this very well. You link a GitHub repo and you like, it will extract the design system from it, right? And yeah, I saw Nate did that. I'm like so smart. What this does is like basically I have an HTML file that represents my design system. You can see the colors here, typography, spacing, radius, core components, right. It's a fairly small one, but once I have this, I can basically start passing this around. So I go to a new project, I'm like design system HTML, right? Instead of like design MD or something. And it's got this like compressed understanding. And you can literally just point Claude at a folder in your thing and be like, hey, find the design system here, create a HTML artifact and pass it around.

[Claire Veaux]

So I love this. I do this as well. I will give you my like advanced mode version of this, which is I use Claude design. I pull in my. Both my marketing site repo and my app repo, which have like some expressions of the same design system in. I say make the design system, then I actually make it ask, ask it to make a design system or a style guide. But I want it at the component level. And so we have like colors and all this stuff, but we also have components because there's some tweaks in how you want the design system implemented in particular components. And then I drop that into the repo. And then, yes, I say exactly this reference. The design system, the advanced thing that I do that I think is really useful for people who have to interface with market. No. Is I have like, what I call a God. What do I call it? Like, it's like a component visualization page, which is like the 25 components of our app in action and interactable in a page. So a marketer can go in and like, get the, get the component in the form factor. It needs to look, quote, unquote real.

[RQ212]

Yes.

[Claire Veaux]

And then you can download a transparent PNG and like, drop it in a deck or drop it in a video and I know you. Or we use that as a source of truth for like, remotion videos. And so I love this idea of, like, this living design system and this living design repository. It's great for code, but it's also great for marketers, for designers. Because one of the hardest things is, is getting versions of your app that look real.

[RQ212]

Yeah.

[Claire Veaux]

And you can use HTML to do that.

[RQ212]

Yeah, exactly. I think there's also something here around, like, component variations, which I thought was exactly fun, where it's like, yeah, like, you create a component you want to see. Like, oh, like, what if I change the padding? Or what if I change the border? You know, solid things like that. Like, these are like a pretty simple, like, you know, way of just playing with this. This is also Claude design. Like, Right. Like where you create these little components or these little knobs and sliders. But yeah, you, you can imagine one. This is like the abstract of like, oh, like, what's the interface for this thing that you're trying to do and how can you visualize it? And yeah, there's not a trade off between, like, being nice, pretty for you and understand being nice for Claude. You know, like, they're, they're really the same. Right. So.

[Claire Veaux]

And you're making me think of one thing that I love in Claude design that I think you could bring into your plans. Again, it's one of these features that, like, sounds truly cuckoo bananas to build, but is totally possible and easy to do, which is I love in Claude design, once you have your design going, you can, like, comment, you can circle things and there's no reason you can't do that in a plan. Yeah, right. I was like, oh, how would you interact with this? It's like, oh, just build an arbitrary, like, comment thing into it and say people are gonna leave comments on any aspect of this and when they do, and then they submit like fix it fixes the core thing. And so I think people getting really creative with what interaction models you can do between content and code is really fun.

[RQ212]

Yes. Yeah. I mean you could easily imagine that you did this plan as like a, like almost a lightweight Figma dashboard or something where you just ask it to like, hey, make a canvas, make a bunch of things, let me comment on it and then give me a place to copy out my comments into something that I can paste back into cloud code.

[Claire Veaux]

Yeah. And we did an episode recently with the Stripe team and they built their own vibe coding platform and they said what they loved about it, which I think really applies here, is they have just a particular way they want to review products and they have a particular way they want to run design review and a particular way they want to run spec review. And by building it in HTML, they can actually shape the tool to how they want the team to run, which I think is really compelling to people.

[RQ212]

Yes.

[Claire Veaux]

I love this. So just to wrap for people, pull up cloud code, ask it to make you give you some ideas. Brainstorming ideas. But brainstorm them in HTML.

[RQ212]

That's right.

[Claire Veaux]

Pick an idea, plan it in HTML, pick a part of that idea you don't like, have it create a micro app to edit in HTML. And then some like bonus things is use cloud design, make a design system. But not only that, use HTML to encode that design system in your repo so it can be referenced at any time. Design MD is dead. Long live Design HTML. Did I get it right?

[RQ212]

Yeah, I think that's right. I think that's right.

[Claire Veaux]

Pretty good. Okay, well, this was so fun. Before we get you out of here, back to this amazing event, couple lightning round questions. One I have to, I ask everybody. There's three tabs in Claude desktop app.

[RQ212]

Yeah.

[Claire Veaux]

One is your favorite tab.

[RQ212]

It's got to be code, you know. Yeah. I love the team as well. I'm really close friends with them.

[Claire Veaux]

Yeah. Okay. So code, I thought it would be on brand. Okay, second thing, we were at this amazing event. What is the thing that you're most excited about or that you saw or heard today?

[RQ212]

I think obviously we had a big announcement at the start of the day. Our partnership with SpaceX bringing more compute online. I think. Yeah, I'm excited for. You know, we also said we are thinking about orbital data centers and that's just love it. Yeah. You know, incredibly sci fi and. But could, you know, it could actually happen. So.

[Claire Veaux]

Yeah, I know we were watching this moon mission with my kids. Who are like, kind of elementary school. And I'm like, would you want to work in the moon mine? Would you want to work in the moon mines? Because I think it's coming. Yeah. Orbital. Orbital. That'll be next year's demo, right?

[RQ212]

Exactly.

[Claire Veaux]

You and I will come back and we'll do this. We'll do HTML, we'll do testing, and then Lunar Data modules.

[RQ212]

That's right.

[Claire Veaux]

Perfect. Okay, and then my last question. Very important. I love that you just talked to Claude like a person. When Claude is not listening, not giving you what you want.

[RQ212]

Yeah.

[Claire Veaux]

What's your prompting technique? Do you yell? No one in anthropic yells. That has been my experience so far, so you'd be the first to admit it.

[RQ212]

Yeah, no, I definitely don't. I think that, like, there are a couple of things there. I do sometimes message people and I'm like, hey, like, seems like you have a bug. Can you send me your transcript? And they're like, it's not the best side of me. Yeah. You know, I think that, like, yeah, I don't. I don't yell at Claude. I think that, like, we've also done some interesting research recently about, like, emotions in Claude and just sort of like this idea that, like, once you. When you say things with a certain emotional charge, it also, like, activates different features inside of Claude code. I don't think anyone's done this, like, AB test of, like, which, like, you know, if you're mean to Claude, is it better than without it or not? But I'm just like, let's err on the side of, like, you know, not. Or like, what's the thing? I'd prefer to exist, you know, and I'd prefer if you're, like, nice and, you know, friendly to Claude, that you get better output.

[Claire Veaux]

So all I've seen is if you sort of border on stern to any of these models, their reasoning gets really sad. It's like, oh, the. The user is right to be so disappointed in me. I'm like, oh, I don't want. I don't want to read that. I don't want to see that.

[RQ212]

Yeah, thinking traces are tough. I usually give the model some privacy. I'm like, I'm not going to read

[Claire Veaux]

the train of your business. Yeah, I had somebody else on. I feel like it was Hillary who was like, just like an employee. How you get your work done is none of my business. I don't even want to know. We just collapsed those things. Well, this has been so fun. Thank you for showing us the way, where can we find you and how can we be helpful?

[RQ212]

Extremely Online at x yeah, I'm RQ212 and yeah, just tag me if you have, you know, anything with cloud code. I'm happy to help.

[Claire Veaux]

Perfect. I am living proof this man is happy to help. Well, thank you for joining How I AI.

[RQ212]

Thank you. Thanks for having me.

[How I AI Host]

Thanks so much for watching. If you enjoyed this show, please like and subscribe here on YouTube or or even better, leave us a comment with your thoughts. You can also find this podcast on Apple Podcasts, Spotify or your favorite podcast app. Please consider leaving us a rating and review which will help others find the show. You can see all our episodes and learn more about the [e-mail] See you next time.