目录
- HTML 计划让人重新参与 [00:00:00 - 00:10:00]
- 从 HTML 计划到微型应用 [00:10:00 - 00:20:00]
- 团队协作与动态设计系统 [00:20:00 - 00:30:00]
- 快问快答与友好提示 [00:30:00 - 00:33:08]
HTML 计划让人重新参与
易凯：欢迎收听跨国串门计划。这是一档专注于让中文听众无障碍欣赏全球优质外语播客的节目。通过先进的 AI 声纹克隆技术，我们不仅将内容翻译成中文，还保留了原语言主持人和嘉宾的独特声音，为您呈现全球顶尖的 AI、财经、健康与科技领域精品内容。我是主播易凯，一位热衷于 AI 领域的产品经理，很荣幸能为您搭建这座跨越语言障碍的桥梁。接下来让我为您简单介绍本期我们克隆的这档节目，并分享几句非常精彩的原话。本期我们克隆的是 How I AI 的一期对谈节目，主持人 Clara Vo 是一位产品负责人，也是 AI 工具的深度使用者。她在 Anthropic 的 Code with Claude 开发者大会现场，邀请参与 Claude Code 工作的 Thariq Shihipar，一起聊人和 agent 协作时，文档、计划和界面正在发生的变化。节目里有几句原话特别有代表性：“说真的，这是个错误。我觉得人还是必须深度参与，我们真的需要理解 agent 在做什么。”“如果你要花 500 美元，那我们现在其实都在变成 compute allocator，也就是算力分配者。”“HTML 读起来容易得多，所以它成了你和 Claude 之间更丰富的沟通媒介。”“这甚至都不是个人软件了，它更小，是微型软件。”这些话背后有很多具体的例子和现场演示，那我们就一起进入这期完整对话。 [00:01:31]
Thariq Shihipar：Markdown 曾经变成一种很流行的方式，用来和 agent 互动。但现在计划写得太长了，说实话我已经不读了。说真的，这是个错误。我觉得人还是必须深度参与。计划很重要，PRD 很重要，Spec 也很重要。当你说，好，Claude 可以跑八个小时，你真正的意思是 Claude 可以花掉 500 美元。现在我们所有人都在变成 compute allocator，对吧？所以你得决定哪些事情值得把算力花上去。 [00:02:05]
Clara Vo：总有人问我，Clara，你说产品管理已经死了，那接下来是什么？我会说，你现在就是 compute allocator，这就是现在的工作。
Thariq Shihipar：HTML 读起来容易得多，所以它成了你和 Claude 之间更丰富的沟通媒介。不再是说，这里有一份 Markdown 文档，而是说，什么方式最能把这些信息表达出来，让你真的能参与进去，然后做出选择。
Clara Vo：这就是计划，它完全是 HTML，这个东西我真的会读。这甚至不只是个人软件了，它就是软件，是在软件之上的软件。欢迎回到 How I AI，我是 Clara Vo，一名产品负责人，也是 AI 重度爱好者。我在这里的目标，是帮你用这些新工具做出更好的东西。最近我参加了 Code with Claude，这是 Anthropic 的第一场开发者大会。借这个机会，我和 Thariq 聊了一会儿，他参与 Claude Code 的工作，也教了我一件事。我听完之后一直觉得很震撼：HTML 是新的 Markdown。他会给我们展示，怎么用 Code with Claude 生成丰富的 artifact，让你和 agent 都愿意在上面工作。我们开始吧。 [00:03:08]
Thariq Shihipar：谢谢邀请我，我很兴奋今天能在旧金山参加 Code with Claude。这里发布了很多令人期待的东西，我们等会儿会聊到。
Clara Vo：但你刚才告诉我一件我今天完全没想到会听到的事。大家先记住，你是在这里第一次听到：HTML 是新的 Markdown。展开说说。
Thariq Shihipar：我觉得 Markdown 曾经变成一种很流行的方式，用来和 agent 互动，尤其是在 Opus 4 和 Claude 3.5 那段时间。它会有一个计划，计划会写怎么做这个功能，可能也就是 50 行代码，你可以去改。我回想那时候，你其实还会读完所有输出，还会编辑 Markdown，把它改掉。但随着 agent 跑得越来越久，比如你有 Opus 4.5 和 4.7，它们可能会跑一个小时左右，计划也变得特别长。说实话，我已经不读了。说真的，这是个错误。我觉得人还是必须深度参与，我们真的需要理解 agent 在做什么。但如果是一千行的 Markdown 文件，我现在甚至都不自己改了，我直接让 Claude 去改。所以我在 Claude Code 团队里看到一个自然出现的趋势，就是我们开始改用 HTML 文件。HTML 这个东西模型仍然非常擅长，它们现在有了更大的 context，所以你可以多花一点 token。并且 HTML 读起来容易得多，它们可以放进更多信息，也更适合滚动浏览。当你在讨论实现方式的时候，有时候你会看到 Claude 用 Markdown 做一些小的 ASCII 图，你会觉得它在很努力地画一个小 mockup；但在 HTML 里，它不需要那么费劲，它真的可以画出你能看的东西。所以它成了你和 Claude 之间更丰富的沟通媒介。 [00:04:29]
Clara Vo：在我们继续深入聊 HTML 之前，我必须先暂停一下，因为这件事跟我很有关系。你是在对那些没认真听的人说，都听好了：计划很重要，PRD 很重要，Spec 也很重要。哪怕这些模型越来越聪明，你仍然觉得这还是整个流程里非常重要的一部分。
Thariq Shihipar：我觉得每个人对未来会怎么发展都有不同看法，但我觉得这件事会一直是核心。因为你说 Claude 可以跑八个小时，真正的意思其实是 Claude 可以花掉大概 500 美元。如果你要花 500 美元，那我们现在其实都在变成 compute allocator，也就是算力分配者。所以你必须决定，哪些事情值得把算力花在上面。我觉得这件事发生在 spec 和规划阶段。你必须真正理解自己想要什么。有时候你并不知道，有时候你得通过和 Claude 的聊天，把它从自己脑子里挖出来。有时候你还有一些“自己不知道自己不知道”的东西，需要先弄清楚。所以我觉得现在整件事的核心，就是要和 Claude 真正对齐：到底要构建什么。 [00:05:42]
Clara Vo：我很喜欢你刚才那句话。大家经常问我，Clara，你说产品管理已经死了，那接下来是什么？我会说，你现在是 compute allocator，这就是现在的工作。但你其实还在做同一件事，你还是在写文档，用来决定另一个东西要不要去工作，以及这个工作应该是什么形状。好，你已经说服我了，HTML 就是未来。我也喜欢你刚才的说法，不是说 agent 读 HTML 一定更难或者更容易，它们很聪明，各种代码都能读；但你真正发现的是，HTML 让你自己更容易参与到内容里，这反过来会整体提高质量。因为你不会盯着一堆原始 Markdown，看得眼睛发直，然后心想，算了，大概还行吧。相反，你会真的被这个 spec、这个文档或者这个计划吸引进去，然后你会用一种能提升质量的方式和它互动，最后就能构建出更好的东西。 [00:06:17]
Thariq Shihipar：对，就是这样。
Clara Vo：好，所以你是在和 agent 一起构建一个东西，让 agent 可以管理你？
Thariq Shihipar：我不确定“管理”这个词是不是完全准确，但我确实非常在意和 agent 保持同步。我在 Claude Code 里做的那些功能，某种程度上也都是围绕这个来的：我怎么才能更了解你？
Clara Vo：好，很好。我们现在已经打开了 Claude Code，那我们来走一遍，看看它是怎么工作的。
Thariq Shihipar：我们开始之前，我先做了一点点准备。我喜欢像跟人聊天一样跟 Claude 说话，我总是从 brainstorming 开始。一旦你有了一个伙伴，brainstorming 就容易多了。所以我当时就是直接说：看，我要上 Clara 的播客，我想做一个 demo，你能不能在一个 HTML 文件里帮我 brainstorm 一些想法？这就是我给它的 prompt，真的没有很复杂。这里你可以看到，它给我做了八个视觉化 demo，还做了这些小 mockup，比如从 PRD 到可运行原型。它还搜索了，你刚才也看到了，它用了 web search。还有从白板草图到可运行原型，我觉得这个特别酷，这是一个很可爱的小东西。 [00:07:39]
Clara Vo：特别可爱。很好笑的是，就在今天早上，有个 ChatPRD 用户给我发消息，说他很喜欢 ChatPRD 里的 mockup。我当时想，你到底在说什么？因为我现在 code review 里确实有一个很类似的东西，但还没有发布。我就在想，我是不是加了什么，或者是不是不小心让 Claude 做了这件事。结果她说的是那种很可爱的、小 ASCII wireframe。所以这绝对是理想状态，但现在你告诉我，我可以把它做出来。它给你的基本不是一份 Markdown 文档，里面写着你应该跟 Clara 聊什么、可以做哪些事情的描述；它反而是在想，怎样传达这些信息最好，这样你就能真的参与进去，并且选一个方向。它用 HTML 做了一个视觉指南，可能是一份议程，也可能是一组 demo，这样你得到的表达就丰富得多。 [00:08:06]
Thariq Shihipar：对，完全是这样。我还有一个关于 brainstorming 的经验规则：如果输出内容超过 Claude Code 一屏能显示的长度，我就不会读。所以如果你给我八个想法，我其实不会把它们全看完。但用 HTML 的话，我肯定会把这些都滚动看一遍。这些图示会让我更有感觉，也更容易理解到底发生了什么，比如 slash command starter pack、五行代码的 feature flag dashboard，还有 PRD diet。我最后最喜欢的是 CSV 到交互式 dashboard 这个想法。
Clara Vo：我们都喜欢 dashboard。我以前在做企业软件的时候常说，我现在好像也还在企业软件里，dashboard 就等于 dollars，所以我喜欢这个。好，所以你用了 Claude Code，你说 brainstorm，但要用 HTML 来 brainstorm，给我几个可以聊的东西。它给了你八个想法，包括视觉图，还有这些很漂亮的说明，比如为什么选它、视觉效果是什么。我还喜欢它写的风险，它说这个 demo 可能会翻车，所有好的 demo 都有这种可能。然后你会选一个，再给我们展示你怎么把这个想法推进成一个完整计划。 [00:09:54]
从 HTML 计划到微型应用
Thariq Shihipar：我喜欢 HTML 的地方在于 Claude 真的很懂它。所以我这里的下一个 prompt 是这样：我在后续 prompt 里让它做一些 mockup，然后让它围绕第八个想法来采访我。这有点像写 spec、PRD，我要找出那些我自己都不知道的问题：我到底想让它做什么？它回答了一堆问题之后，我就说，好，创建一个 HTML 文件作为计划，帮我可视化实现计划是什么，里面包括视觉 mockup、代码或者任何能给我最大 context 的东西。然后它就给我做了这个 HTML 文件。你现在可以看到，这就是计划，但它完全是一个 HTML。它甚至开始把播客本身的脚本写出来了，这个我可能不一定全都需要。但我们是在做一个 skill，所以它把文件系统展开了，给了我一段 skill.md 的摘录。它还做了一个 mood board、一些示例组件，还有这里的一些逻辑、insights、templates、helper scripts，对吧？它在帮我理解这里哪些东西是我需要重点知道的。这种东西我是真的会读的。 [00:10:54]
Clara Vo：我想很快回到 Claude Code，如果你不介意的话，因为大家肯定会问，它怎么知道 spec 里到底该放什么。我想回到你的 prompt，因为它其实非常简单，这很好笑。我已经做了大概 75 期 How I AI，大家都能得到很惊人的输出，但他们的 prompt 基本都是：把这个东西做出来，最好做得不错。这样反而挺好。所以我很喜欢这个 prompt，它字面上就是：创建一个 HTML 文件，作为计划，帮我可视化。你还把 excerpts 拼错了，然后你写的是摘录、mockup、代码等等任何需要的东西。所以我也想鼓励大家，不要太纠结这个东西里面到底应该放什么。事实上，它可能每个 initiative 都会不一样。为了让你更好地投入到工作里，它可能会稍有不同。但你只要识别出自己想得到什么，然后让 Claude、让模型去做它需要做的事，它就能产出非常高质量的结果。 [00:11:48]
Thariq Shihipar：我觉得 prompt 这件事是一个很微妙的平衡。你要给足够的信息，这样它能给你想要的东西；但你又不想把 Claude 限制得太死。所以有时候我看到有人写了很多过度设计的 skill，比如“你是一个专家级规划师”之类的，这种通常就是把太多判断外包出去了，同时也把它限制住了。但在这个例子里，我确实很想确保它给我代码摘录。如果我不写，我不确定它会不会做，所以这一点很重要。但我也总是要给 Claude 留一个出口。我总是需要表达这种意思：好，你让我做这个，但我还有别的东西想给你。所以“任何能给我最大 context 的东西”，就是我在说，Claude，我在这里信任你，我只是想和你一起保持在这个循环里。 [00:12:42]
Clara Vo：我很喜欢你说“我信任你”。因为我现在新的结尾 prompt 已经不是“不要犯任何错误”了。我喜欢“不要犯任何错误，我相信你，也信任你”。我是真的在说，我知道你有能力，我相信你能做这些决定。所以我觉得把它开放地留在那里，就像是在说，不管你需要做什么，我相信你的判断。至少它让我感觉我得到了更好的结果。我还挺喜欢最近这个说法的反转：Claude，去犯错吧，去坠入爱河吧，做一些糟糕的决定吧。我们确实需要在工作里多一点偶然性。所以你已经把这个东西做出来了。我还想带大家走一遍另一件事。如果你把计划拉出来的话，因为我经常想这个问题，也经常有人问我，PRD 的未来是什么？Tech Spec 的未来是什么？这些东西是分开的还是合在一起的？我觉得好的地方在于，它们可以是你想要的任何形式，也可以根据你的受众来决定。在这个 demo 里，你是一个单独的 builder，你希望所有东西都放在一起。你想要产品想法，你大概还想要一个 12 分钟的 walkthrough，说明你要怎么 demo 它。你想要 code snippets，想要 style guide，也想把这些都放在一个东西里。因为这是一个自包含的小项目，一次性都放进去会更容易。但我能想象，在更大的组织里，可以把 PRD 放在一个 tab，把 tech spec 放在第二个 tab，因为可能会有不同的人来审阅这些信息。 [00:13:34]
Thariq Shihipar：所以你真的可以用 HTML 打造一个理想的 spec package，适配你想要的形式。而 Markdown 在这方面会更受限制，它要么是一个超大的文件，要么就是分成多个文件。从这个角度看，我觉得 HTML 这样更好。HTML 能带来更多交互性。我这里还没让它做 tab 之类的东西，但你很容易就能做到。对 Claude 来说，这些本质上都一样。关于 spec 和 PRD，我觉得你其实是在找一个边界：哪些东西是你需要和 Claude 一起弄清楚的。比如你在做很技术性的东西，我会喜欢先写 type interface，也就是先理解这些 type 是什么。因为我很多时候并不关心它具体怎么实现，我只会想，好，这些 type 能帮我理解我们到底在做什么，然后我可能会去改这些 type。这就是我想在整个问题里介入的位置。从播客的结构到 mockup 也是一样，你想在哪个位置介入？ [00:14:29]
Clara Vo：关于 type 我还想补充一点。type 确实是很重要的输入，但同样重要的是验证标准，一组测试，或者其他能判断你有没有拿到预期结果的方法。我知道你们刚发布了 Outcomes，它非常关注目标导向：你需要达成这件事，至于怎么做，你自己想办法。我觉得这部分至少大多数产品经理并不习惯写，也就是一个功能的技术成功标准，以及你怎么通过测试逼近它。我也会做这两件事。我会关心数据模型，关心管道的形状，也就是输入是什么；然后我会写清楚，你要怎么测试才能证明你做对了。有了这前后两个支点，中间的东西就相对没那么要紧。这就是我会思考的方式。 [00:15:23]
Thariq Shihipar：我觉得没错。关于测试，我们可能都能单独录一期播客。
Clara Vo：让我想想，好，第二轮我们把它排上日程。
Thariq Shihipar：我在这里的口号是，测试验证不等于测试。以前大家会写 unit test 之类的东西，但现在验证可以是一套 rubric，配合 managed agent 和 Outcomes。它也可以是让 Claude 录一段视频，展示它为你做了什么。所以这里面其实有很多可以深入聊的东西。我会保留一组 synthetic data，然后用 CLI 跑过这些 synthetic data，因为我会想，这些都是过去曾经坏掉过的情况。如果你更擅长解决这些坏掉的问题，那我们就往前推进了。所以我觉得现在可以做很多很有意思的验证和测试机制。 [00:16:08]
Clara Vo：我们会做第二部分。大家在评论区给他一点压力，请告诉我们你们想听。好，你已经把这个东西做出来了，但我这里有一个反对意见，我肯定会听到这个问题：Markdown 是可访问的，对吧？我可以直接打开，在里面打字，然后修改。我觉得这也是它这么流行的一个原因。它用很低的门槛，连接了机器可写可读和人类可写可读。只要你理解了这些井号代表标题，你就可以开始用 Markdown 了。那如果我想改这里，我该怎么碰它、怎么编辑它？ [00:17:12]
Thariq Shihipar：这是一个很好的问题。我以前用 Markdown 的时候有一个感受，因为我已经不读它们了，所以我也不再自己编辑它们。到最后我会让 Claude 去编辑。最基础的做法就是直接说，Hey Claude，我不喜欢计划里的这一部分，你能改一下吗？那假设你真的想参与进去，而且想非常深入地参与，Claude 也能帮你做到。我后面用的下一个 prompt 是：我想创建一个可编辑的 HTML artifact，帮我定义这些决策规则。这些规则就是这里定义的内容，比如怎么把数据变成可视化。我觉得其中有些规则其实挺随意的，所以我让它创建一个 HTML artifact。我说，我不喜欢现在这些规则，把它做成一个 custom UI，既能帮我保持结构，又给我灵活性，请为这个问题设计理想的界面。我当时也不太确定它会给我什么，这也是 HTML 有意思的地方之一，我就是想看看 Claude 会做出什么。结果它给了我一个属于我自己的、很漂亮的 custom interface。我可以编辑这些字段中的任何一个，也可以把它们隐藏起来；我可以复制，也可以在这里添加新字段。它还会给我一段 Markdown，让我复制回去。所以当我觉得，好，我已经有了这个结果，就可以把它复制回输入处理。 [00:18:06]
Clara Vo：我想暂停一下，因为大家可能会完全错过你刚才做了什么。所以我来重复一遍：你有这个 HTML 计划，在这个 HTML 计划里，有一段很具体的表格，写的是渲染和可视化规则。它按数据类型来分，而这些数据类型是你可以预期会出现在 CSV 里的。然后你说，我不喜欢这一段。但你没有回到 Claude Code 里，说我不喜欢，我们在 terminal 里来回改吧。你说，对于这个具体问题，从用户角度来看，应该有一种更理想的交互方式。所以你基本上是为这个非常具体的问题做了一个一次性的 UI。这甚至都不是个人软件了，它更小，是微型软件，而且是叠在微型软件之上的微型软件。你先做了一个非常个性化的计划，然后又从这个个性化计划里拿出一个模块，用一个非常定制的 UI 放大进去。看 UI 会让你更投入地处理内容，从而把质量做得更高。我也喜欢它有点游戏化，很像面向消费者的产品，真的很 consumer。你在 prompt 里说，给我一个理想的 UI，帮我参与到这件事里，然后你把它做出来，拿到数据，再把它塞回文件里。 [00:19:54]
Thariq Shihipar：没错。
团队协作与动态设计系统
Clara Vo：太好玩了。你现在真的就是这样做东西的吗？从协作角度看，你会遇到什么挑战吗？比如你怎么把这个传给别人？还是说这更像是一个单线程的产品负责人或工程负责人，用来把事情做成的一种方式，也就是你在和自己和模型互动，所以你觉得自己可以从头到尾拥有整个 full stack？还是说一到协作就会有摩擦，比如有人需要对这个给意见，或者你想要别人的意见？ [00:20:26]
Thariq Shihipar：在实现计划这个尺度上，它好太多了。因为你可以把它上传到 AWS 之类的地方，然后把链接发给大家。所以像 Cat 或 Boris 真的去读它的概率会高 100 倍，这对我展示这个东西很有帮助。还有一个有点相关的点是，我在整体协作里也经常这样用。比如我向 Cat 汇报，所以每周我都会给他发一份 HTML 形式的周状态更新，里面是我这一周做过的所有事情。我会让 Claude 读我的 Slack，然后生成这条消息。他真的会去读，而我也不用花太多时间。
Clara Vo：我的天，新的公司内部竞赛出现了。不只是看谁在做最好的产品，而是看谁在做最好的、用来帮助做出最好产品的产品；还有谁在做最好的产品，用来向经理展示自己。但我觉得你这么做不是为了好玩而硬搞出来的，而是因为用有吸引力、细节层级合适、容易消化的内容在公司内部沟通，确实有效得多。而且我们都挺擅长读网页的。 [00:21:28]
Thariq Shihipar：对，没错。我想到 abundance 的时候，就是这种感觉。我们会讨论软件里的 Jevons 效应，比如软件变便宜了，你会做什么。我会说，我生成的 token 里真正进入生产代码的比例非常小，可能只有 1% 之类的，但我会生成多得多的这种 token，比如我的 dashboard、我的自定义界面。我其实是在努力弄清楚我到底想做什么，而且我交互的所有东西都变得很漂亮。我希望这最终也会体现在我产出的东西里，因为我更参与其中了，它也更漂亮，更像是我和 Claude 一起协作出来的东西。
Clara Vo：我喜欢这一点，因为我做产品已经很久了，好几十年。以前大家特别容易纠结一件事：我们的 spec 的统一版本在哪里？PRD 的统一版本在哪里？这些信息是不是都在一个大家都能访问的中心化位置？它们是不是都用同一种格式，是不是都用同一个模板？当时会有很多任意的规则，因为创作这些内容相对来说很贵，消费这些内容当然也很贵，找到它们也非常难。我觉得当所有这些成本实际上都降到接近零的时候，虽然我们也都还在付费，我把它叫做我们的 Claude 费用，我们还是在为 Claude 付费，但你就可以把东西放在任何地方，用任何格式。因为我们知道这些模型很擅长使用工具，去发现它们需要的 context。所以我确实觉得这里有一个很有意思的时刻：你真正把关注点往上提了一级，开始关心更重要的事，比如这个计划的内容是什么，它是不是个好想法，我们觉得它能不能被很好地执行；而不是纠结说，我不能把一个交互式 Markdown 文档放进我们指定的文档仓库，所以还得把另一个资产放到别的地方。所以我很喜欢这种即时文档的想法，质量非常高。还有一些一次性软件也挺好，因为它很便宜，所以用完就可以扔掉。但我脑子里那个高管版本的我又会想，要是我们以后再也找不到它怎么办？然后我又想，Claude 可以帮我们找到，没事。那你觉得这样会带来更好的产品吗？你会怎么在这个基础上继续做？你会说，计划不错，开干吗？ [00:23:34]
Thariq Shihipar：我觉得会。我当时没有点 implement，但我基本上会把它当成一个 artifact 来用。我会清空 context，然后说，这是一个计划，把它实现出来。你也可以把它当成检查结果是否符合预期的依据。再说一次，HTML 的一个好处是，我这里还有一个小 mockup，所以我可以让验证 agent 去检查，我原本想做什么，最后输出里实际做出来的是什么。所以我觉得这真的能让 Claude 更深入地参与到流程里。我这里还有一些计划的例子，我们可以看看。这个是我正在写的一篇文章，内容大概是我使用 Claude Code 的不同方式，或者更准确地说，是用 HTML 配合 Claude Code 的不同方式。我最喜欢的一个例子是这个 living design system。它的想法是，很多时候我在 Anthropic design system 里做一个新的 app，对吧？Claude Design 这件事做得很好。你把一个 GitHub repo 连进去，它就会从里面提取 design system。我看到 Nate 那么做的时候，就觉得太聪明了。这个做法基本上是：我有一个 HTML 文件，用来表示我的 design system。你可以在这里看到颜色、typography、spacing、radius，还有 core components。这是一个相当小的 design system，但一旦我有了它，我基本上就可以开始到处传它。我去一个新项目就说 Design System.html，而不是 Design.md 之类的东西。它里面有一种压缩过的理解。你甚至可以直接让 Claude 看你某个文件夹，然后说，在这里找一个 design system，创建一个 HTML artifact，再把它传出去。 [00:25:17]
Clara Vo：我很喜欢这个，我也这么做。我给你说一个我的高级版做法：我会用 Claude Design 把我的 marketing site repo 和 app repo 拉进来，它们里面都有同一个 design system 的一些表现形式，然后我会说，做出这个 design system。其实我会让它做一个 design system 或者 style guide，但我希望它做到 component 层面，所以我们不只是有颜色这些东西，我们也有 components。因为在具体 components 里，你希望 design system 的实现方式会有一些细微调整。然后我把它放进 repo，再说引用这个 design system。我做的高级版事情，我觉得对那些必须和营销人员协作的人特别有用。我会有一个，我叫它什么来着，大概是一个 component visualization page，也就是把我们 app 的 25 个 components 放在一个页面里，展示它们实际运行的样子，而且可以交互。这样营销人员就可以进去，拿到某个 component，而且是它需要的 form factor，看起来也就是所谓的真实。然后你可以下载一个透明 PNG，把它放进 deck 或者放进视频里。我知道你也会这样做，或者说我们会把它当成 motion videos 的统一依据。所以我很喜欢这种 living design system 或者 living design repository 的想法。它对代码很好，对营销人员、设计师也很好，因为最难的事情之一就是拿到看起来像真实 app 的那些版本，而你可以用 HTML 做到这一点。 [00:26:11]
Thariq Shihipar：对，没错。我觉得这里还有一个点是 component variations，这个我觉得也很有意思。比如你创建了一个 component，然后想看看，如果我改 padding 会怎么样，如果我改 border 会怎么样，或者把 border 改成 solid 之类的会怎么样。这些其实都是很简单的玩法，可以用来试这些东西。这也很像 Claude Design，对吧？你创建这些小 components，或者这些小 knobs 和 sliders。但你可以想象，这背后抽象出来的问题是：你想做的这件事，界面应该是什么样？你要怎么把它可视化？而且为你自己做得漂亮、好用，和为 Claude 做得容易理解，这两者之间并没有取舍，它们其实是一回事。 [00:27:05]
Clara Vo：你让我想到 Claude Design 里一个我很喜欢的东西，我觉得你也可以放进你的计划里。这又是那种听起来真的很夸张、很疯狂的功能，但其实完全能做，而且很容易做。我喜欢 Claude Design 的一点是，等你的设计跑起来之后，你可以评论，可以把东西圈出来。计划里也没有理由不能这么做，对吧？我就在想，你要怎么和它互动？答案就是直接在里面做一个任意的评论功能，然后告诉大家可以对这里面的任何部分留言。当他们留言并提交之后，就让它去修正核心内容。所以我觉得，大家开始很有创意地去探索内容和代码之间能有哪些交互模式，这件事特别有意思。你完全可以想象把这个计划做成一个很轻量的 Figma dashboard 之类的东西。你就让它说，帮我做一个 canvas，放一堆东西上去，让我可以在上面评论，然后再给我一个地方，把这些评论复制出来，交回 Claude Code 里。我们最近和 Stripe 团队录过一期节目，他们做了自己的 vibe coding 平台。他们说自己最喜欢的一点，我觉得也很适用于这里，就是他们有一套特别的产品评审方式，他们有自己想跑 design review 的方式，也有自己想跑 spec review 的方式。通过用 HTML 来做，他们其实可以把工具塑造成他们希望团队运作的样子。我觉得这对很多人都很有吸引力。我太喜欢这个了。所以给大家收个尾：打开 Claude Code，让它给你一些想法，做 brainstorm，但要用 HTML 来 brainstorm；选一个想法，用 HTML 来规划它；选这个想法里你不喜欢的一部分，让它创建一个 micro app，用 HTML 来编辑。还有一些加分项，比如用 Claude Design 做一个 design system，但不只是这样，还要用 HTML 把这个 design system 编进你的 repo 里，这样它随时都可以被引用。Design.md 已经死了，Design.html 万岁。我说对了吗？ [00:28:53]
Thariq Shihipar：对，我觉得就是这样，我支持。
Clara Vo：我还挺厉害的。好，这次聊得太有意思了。在让你回到这个很棒的活动之前，我们来几个快问快答。第一个问题，我问所有人：Claude desktop app 里有三个 tab，你最喜欢哪个 tab？ [00:29:47]
Thariq Shihipar：那必须是 Code。我也很喜欢那个团队，我跟他们关系特别好。
快问快答与友好提示
Clara Vo：好，所以是 Code。我就觉得这个答案很符合你的人设。第二个问题，我们现在在这个很棒的活动上，今天你最兴奋的事情是什么？或者你今天看到、听到的东西里，最让你兴奋的是什么？ [00:30:21]
Thariq Shihipar：我觉得很明显，今天一开始我们有一个重大发布，就是我们和 SpaceX 的合作。我觉得这会让更多 compute 上线。我也很兴奋的是，我们还说过，我们在考虑 orbital data centers，这就很有意思。
Clara Vo：我太喜欢了。这听起来特别科幻，但它真的有可能发生。我知道我们之前和我的孩子们一起看这个登月任务，他们差不多是小学年纪。我就问他们，你们想去月球矿场工作吗？因为我觉得这事要来了。轨道上的东西，这会是明年的 demo，对吧？你和我会再回来，我们会做 HTML，会做 testing，然后再做 lunar data modules。太好了，最后一个问题非常重要。我很喜欢你刚才就是像跟一个人说话一样跟 Claude 说话。当 Claude 不听话，或者没有给你想要的东西时，你的 prompting 技巧是什么？你会吼它吗？以我目前的经验，Anthropic 没有人会吼。所以如果你承认，你就是第一个。 [00:31:20]
Thariq Shihipar：不，我肯定不会。我觉得这里有几件事。我有时候会给人发消息说，嘿，看起来你这里有个 bug，你能把 transcript 发我吗？然后他们会说，这不是我最好的一面。我确实不会吼 Claude。我觉得我们最近也做了一些很有意思的研究，关于情绪和 Claude。大概意思是，当你带着某种情绪强度说话时，它也会激活 Claude Code 里面不同的 feature。我不觉得有人做过这种 A/B test，去比较你对 Claude 凶一点，它是不是会比不凶时表现更好。但我的想法是，我们还是往更希望存在的那一边走。也就是说，我更希望这样一种情况存在：你对 Claude 友好一点、客气一点，就能得到更好的输出。我看到的情况是，只要你对这些模型稍微严厉一点，它们的 reasoning 就会变得很悲伤。它会说，用户对我这么失望是有道理的。我就会想，我不想读这个，我不想看到这个 thinking traces，真的挺难看的。
Clara Vo：我通常会给模型一点隐私。我会想，我就不读 thinking traces 了，那是它自己的事。我之前还请过另一个人上节目，我感觉好像是 Hillary，他说就像员工一样，你怎么把工作做完，不关我的事，我甚至不想知道。我们就把那些东西折叠起来。这次真的太有意思了，谢谢你给我们指路。大家在哪里可以找到你？我们又能怎么帮到你？ [00:32:43]
Thariq Shihipar：我在 X 上非常活跃，我的账号是 @TQ212。如果你有任何 Claude Code 相关的问题，直接 tag 我，我很乐意帮忙。
Clara Vo：太好了。我就是活生生地证明，这位真的很乐意帮忙。感谢你来参加 How I AI。
Thariq Shihipar：谢谢，谢谢邀请我。 [00:33:01]
Clara Vo：非常感谢大家收看。如果你喜欢这个节目，请在 YouTube 上点赞并订阅，或者更好的是，给我们留条评论。