HTML 是新的 Markdown：用AI生成动态 Spec

📝 本期播客简介

本期我们克隆了：AI 工具实践播客《How I AI》**Why this Claude Code engineer uses HTML files as AI specs | Thariq Shihipar (Anthropic)**

本期节目来自 Anthropic 的 Code with Claude 开发者大会现场。主持人 Clara Vo 邀请参与 Claude Code 工作的 Thariq Shihipar，讨论一个正在悄悄改变 AI 编程工作流的趋势：HTML 正在成为人与 Agent 协作的新型文档格式。

过去，很多人用 Markdown 写 PRD、spec、实现计划，再交给 AI 执行。但随着 Agent 可以运行更久、处理更复杂的任务，计划文档越来越长，人类反而越来越不愿意读。Thariq 提出，真正的问题不是 Agent 能不能读 Markdown，而是人类是否还能深度参与其中。HTML 因为可以承载视觉化 mockup、交互式界面、代码片段、设计系统和验证标准，正在成为更适合人类和 Claude 共同理解、共同修改、共同推进工作的媒介。

这期节目不仅讨论“HTML 是新的 Markdown”，还展示了 Claude Code 如何生成 HTML brainstorm、HTML 实现计划、一次性 micro app、living design system，以及团队状态更新。它本质上是一堂关于 AI 时代产品经理、工程师和创作者如何重新设计文档、计划与协作界面的实战课。

👨‍💻 本期嘉宾

Thariq Shihipar，Anthropic 成员，参与 Claude Code 相关工作。他长期探索人和 AI Agent 的协作方式，尤其关注如何通过更好的界面、计划、文档和验证机制，让人类在 Agent 工作流中保持深度参与。

⏱️ 时间戳

00:00 开场 & 播客简介

HTML 是新的 Markdown

01:33 核心观点预告：Markdown 计划太长，人类已经不读了

03:08 Code with Claude 现场：为什么说 HTML 是新的 Markdown

03:27 从 Markdown 到 HTML：Agent 计划变长之后，人类参与度下降

04:52 PRD、spec 和计划为什么仍然重要

AI 时代的新角色：算力分配者

05:11 当 Claude 跑八小时，意味着它可能花掉五百美元

06:00 产品经理没有消失，而是在变成 compute allocator

06:54 和 Agent 保持同步：不是被 AI 管理，而是共同对齐目标

用 HTML 做 Brainstorm 和计划

07:19 Claude Code 现场演示：用 HTML 生成 demo 想法

08:03 从 ASCII wireframe 到视觉化 brainstorm

08:53 一屏读不完就不会读：为什么 HTML 更容易让人投入

10:01 把想法推进成 HTML 实现计划

11:08 Prompt 不需要复杂：让 Claude 自己决定最佳表达形式

12:04 好 prompt 的平衡：给足信息，但不要限制 Claude

12:54 “我相信你”：开放式信任如何改善模型输出

未来的 PRD、Spec 与验证标准

13:26 PRD 的未来：按项目和受众定制的 spec package

14:37 在哪里介入 Agent 工作流：type interface、边界与决策点

15:21 不只写需求，还要写验证标准和测试方法

16:13 测试验证不等于测试：rubric、视频展示和 Outcomes

一次性 Micro App：为一个问题生成一个界面

16:31 Markdown 易编辑的反对意见：HTML 怎么改？

17:22 让 Claude 为具体决策生成可编辑 HTML artifact

18:47 微型软件：从 HTML 计划里拆出一个模块，生成专属编辑 UI

19:57 这是未来的个人协作方式，还是团队协作方式？

团队协作、即时文档与软件丰裕时代

20:26 把 HTML 计划发给同事：被阅读的概率高一百倍

21:02 用 HTML 周报向经理同步工作状态

21:28 软件 Jevons 效应：便宜的 token 带来更多临时工具和漂亮界面

22:07 即时文档与一次性软件：当创作和查找成本接近零

23:43 把 HTML 计划作为实现和验证依据

Living Design System：可运行的设计文档

24:17 用 HTML 表达 design system，而不是 Design.md

25:22 高级用法：组件可视化页面、营销素材和真实 App 截图

26:50 Component variations：用 knobs 和 sliders 探索设计变化

27:35 在计划里加入评论、圈选和审阅交互

28:18 把 spec 做成轻量 Figma dashboard

实操总结与快问快答

28:35 实操流程总结：HTML brainstorm、HTML plan、micro app、design system

29:48 最喜欢 Claude Desktop 哪个 tab？答案是 Code

30:07 Code with Claude 最兴奋的发布：SpaceX 合作与 orbital data centers

31:08 当 Claude 不听话怎么办：不要吼，保持友好和清晰

32:34 如何找到 Thariq：X 账号 @TQ212

🌟 精彩内容

💡 HTML 是新的 Markdown

Thariq 认为，Markdown 曾经非常适合和 Agent 协作，因为它简单、可读、可编辑。但当 Agent 的任务越来越长、计划越来越复杂，Markdown 文档会变成一千行以上的长文件，人类反而不再阅读。HTML 的优势不只是模型能读，而是人类更愿意读、更容易理解，也更容易参与修改。

“HTML 读起来容易得多。所以它成了你和 Claude 之间更丰富的沟通媒介。”

🧠 人类仍然必须深度参与计划

节目反复强调，AI 越强，PRD、spec 和计划反而越重要。因为让 Claude 长时间运行并不是免费的，它消耗的是 token、时间和金钱。人类的新职责，是决定哪些事情值得让 AI 去做，哪些问题需要先想清楚。

“如果你要花五百美元，那我们现在其实都在变成 compute allocator，也就是算力分配者。”

🛠️ 用 HTML 生成可读的实现计划

Thariq 展示了如何让 Claude Code 先用 HTML brainstorm demo 想法，再把选中的想法扩展成一个完整的 HTML 实现计划。这个计划里可以包括 mockup、代码摘录、文件结构、mood board、逻辑说明和执行步骤。相比一份长 Markdown，这样的计划更像一个小型网页，人类更愿意真正读完并参与。

“这就是计划。它完全是 HTML。这个东西我真的会读。”

🎮 一次性 Micro App：为一个决策生成一个界面

当 Thariq 不喜欢 HTML 计划里某个具体规则表时，他没有回到终端里用文字来回修改，而是让 Claude 为这个问题生成一个专属可编辑界面。这个界面可以修改字段、隐藏内容、添加规则，并把结果导出成 Markdown 再放回计划中。Clara 将其称为“微型软件”，甚至是叠在微型软件之上的微型软件。

“这甚至都不是个人软件了。它更小，是微型软件。”

📄 即时文档和一次性软件的时代

当生成文档、生成界面、生成工具的成本大幅下降后，团队不一定再需要为所有内容强行套用同一个模板。计划可以是 HTML，周报可以是 HTML，设计系统也可以是 HTML。重点从“文档放在哪里、格式是否统一”，转向“这个计划是否清楚、是否有助于判断和执行”。

“因为它很便宜，所以用完就可以扔掉。”

🎨 Living Design System：Design.html 万岁

Thariq 和 Clara 都分享了把 design system 做成 HTML artifact 的做法。它不仅可以展示颜色、字体、间距和组件，还能让 Claude 在不同项目中引用同一套设计语言。Clara 还提到，可以为营销团队生成组件可视化页面，让他们直接下载真实 App 风格的透明 PNG，用于 deck、视频或宣传素材。

“Design.md 已经死了。Design.html 万岁。”

✅ 测试验证不等于测试

节目中还提到，AI 时代的验证不只等于传统 unit test。验证可以是一套 rubric，可以是一组 synthetic data，也可以是让 Claude 展示它完成了什么。对于产品经理来说，未来不仅要写功能需求，还要更清楚地定义成功标准、验证方式和边界条件。

“测试验证不等于测试。”

🤝 对 Claude 友好一点

在快问快答中，Clara 问 Thariq 当 Claude 不听话时会不会吼它。Thariq 表示不会。他更倾向于用友好、清晰的方式和模型沟通，因为他希望未来存在这样一种协作方式：你对模型更友好、更有建设性，它也能给出更好的结果。

“我更希望这样一种情况存在：你对 Claude 友好一点、客气一点，就能得到更好的输出。”

🌐 播客信息补充

本播客采用原有人声声线进行播客音频制作，也可能会有一些地方听起来怪怪的

使用 AI 进行翻译，因此可能会有一些地方不通顺；

如果有后续想要听中文版的其他外文播客，也欢迎联系微信：iEvenight