AI 驱动的设计工作流：HTML 工件与自主代理

如果主要是由我来设计某样东西，那么对我来说，拥有前端完全合情合理。当然，如果我是设计者，我为什么不拥有它呢？我想演奏我写的歌。欢迎收听 Dive Club。我是 Vid，这里是设计师永不停歇学习的地方。本周的嘉宾是 Kyle Xantos，他正式成为 Dive Club 首位三次做客的嘉宾。我不断邀请他来的原因是，感觉每隔一两个月，AI 就会彻底改变设计流程。所以今天 Kyle 和我打算打打乒乓球，分享一些我们一直在尝试并取得成效的新工作流。我觉得这期节目最终成了频道上最实用的节目之一。希望你能从中获得一些具体策略，并开始融入自己的实践。那么，闲话少说，让我们开始吧。

If I am primarily designing something, like it makes all the sense in the world to me to own the front end. Of course, if I'm the one designing it, why wouldn't I own that? I want to play the songs that I write. Welcome to Dive Club. My name is Vid, and this is where designers never stop learning. This week's episode is with Kyle Xantos, who's officially the first person to have three guest appearances on Dive Club. And the reason that I keep inviting him on is it feels like every month or two AI totally transforms the design process. So today Kyle and I are going to play a little bit of pingpong and share some of the new workflows that we've been experimenting and having success with. I think this ended up being one of the most practical episodes on the channel. So hopefully you have a few specific tactics that you can run with and start incorporating into your own practice. So, without further ado, let's dive in.

好的。那么，我在这里展示的第一样东西是一个 HTML 工件，我知道你最近也经常用它，但嗯，我不知道，大概 6 周前、8 周前之类的。我想我第一次看到相关内容是 Anthropic 的 Claude Code 的 Tariq 提到，他使用 HTML 工件的频率远高于直接使用纯 Markdown 处理所有事情。我当时想：“哦，这真的很有趣。”说实话，我之前从未处理过独立的 HTML 文档。所以当我开始越来越深入地研究我能用它做什么时，我的智能体开始做一些我甚至没要求它们做的事情。我当时想，不会吧，你能做到？太酷了。所以这引导我最近一直在做的事情，就是制作这些 HTML 工件，它们有点像我和智能体之间的对话工件。以我的作品集为例，这是我最近做得越来越多的一个流程，我把几个技能串联在一起。在这个案例中，我用了 Emil Kowalsski 的几个不同技能。他最近发布了很多非常酷且效果很好的技能。然后我加了一个，我想是 Yakob Creel 的。我可能念不对他的姓氏。抱歉，Yakob。我告诉智能体的是，用这三个技能对我的作品集进行审计。我列出了所有技能。你作为编排者，同时担任质量控制审查员，派出 Opus 4.8 子智能体，按照每个技能执行这些审计，并编译结果，但最后把所有结果汇总，去除重复项，然后给我一个 HTML 文档，里面包含所有建议的更改，以及让我批准、拒绝或讨论的选项，并且在底部有一种方式，可以把我在里面输入的所有内容复制，直接粘贴回我与 Claude 的会话中。

All right. So, the first thing that I have pulled up here is an HTML artifact, which I know you've been working with a lot too lately, but yeah, I don't know, maybe 6 weeks ago, 8 weeks ago or something. I think the first thing I saw about it was Tariq from Claude Code from Anthropic uh mentioning that he was using HTML artifacts way more than just straight MD for everything. And I was like, "Oh, that's really interesting." And truthfully, I just I hadn't dealt with straight standalone HTML docs before. And so I I was really as I started investigating more and more like what can I do with this? My agents started to do stuff that I didn't even ask them to do. And I was like, no way you can do that? That's sick. So where that led to is what I've been doing lately is making these HTML artifacts that are conversation artifacts with my agents kind of. So, in this case with my portfolio, and this is a flow I've been doing a lot more lately, I chained together a few skills. So, in this case, I did a couple different ones of Emil Kowalsski's skills. He's been putting out a bunch lately that are really cool um and work really well. And then I added, I think one from Yakob Creel. I'm probably not saying his last name correctly. Sorry, Yakob. What I'm telling the agent is do an audit, in this case, on my portfolio with these three skills. and I name all of them. You act and I'm starting in this case with Fable. You act as the orchestrator and the like quality control reviewer and send out Opus 4.8 sub agents to execute these audits as each skill does it like compile the results but at the end of it compile it all remove the duplicates and then present me an HTML doc that has all the proposed changes and then options for me to approve deny or discuss them and then have a way at the bottom to copy all of what I put in here and just paste it right back into my session with Claude

这太酷了。我也做类似的事情，只是没那么酷。这真的太棒了。

This is sick. I do something similar only just way less cool. This is really really awesome.

还有一点很酷，但这个例子没有体现，因为它更偏向静态视觉设计。但当我处理动效时，我会做同样的事情，但我会让它给我当前版本及其动画，然后是提议版本的动画。所以，尤其是当你在构建更多关于动画的描述性词汇时，直观地查看这些提议变得非常有帮助，然后你会说：“哦，不，不是那样。那太糟糕了。我讨厌那样。”或者只是说：“是的，但加上这个其他东西。”或者，我真的很喜欢你在第二点里做的，应用到第六点，那可能在我正在工作的应用或网站完全不同的区域，但采用我们在这个文档第二点中使用的技术。所以，仅仅是将智能体的所有输出可视化，就已经非常了不起了。

What's so cool too that this example doesn't have it because this is more on static like visual design stuff, but when I do it with motion, I'll do the same thing, but I'll have it give me the current version and the animation of it and then the proposed version in the animation. And so that especially as you're like building more of the descriptive vocabulary around animation and stuff, it becomes so helpful to look at the propositions visually and and and then be and like, "Oh, no, not that. That's terrible. I hate that." Or just like, "Yes, but add this other thing." or or I really like what you did in number two on like number six that's in a totally different area of the app or the site or whatever that I'm working on but grab the technique that we used in in the second point of this doc. So just visualizing everything from your agents has been huge.

好的，快速问一下。我看到一部分是代码块，还有截图，大概这些都是截图吧？那么动画呢，它实际上是在构建成功并渲染出来吗？

Okay, quick question. So I see like part of it is code block there's screenshots presumably these are all just screenshots right and so the animation then is it is actually like building the success and rendering that there.

嗯。

Mhm.

所以它是根据它认为你想要实现的目标或最佳审查方式来动态渲染任何格式的视觉内容吗？

So is dynamically rendering a visual of any type of format just based off of what it thinks you want to accomplish or the best way to review it.

是的。基本上，最好的方式，就像我一直告诉它的那样，给我最接近真实事物的表示。没关系。特别是，你知道，我们之前讨论过，我们一直在用 Swift 和 macOS 原生技术做工作，那不会完全一样，但我的指令始终是给我最接近真实事物的表示，这样当我说“是的，这是个好主意。实现它”时，我不是在凭猜测，而是能看出这是我们想要的方向。如果之后需要一点微调，那就像拨号盘一样简单，比如，把这些参数放进去，这样我就能精确地调整到我想要的样子。

Yeah. Basically the best way to like what I'm always telling it is give me the closest possible representation of the real thing. It's okay. Like especially, you know, we were talking about this, we've been doing some work in Swift and Mac OS native and stuff and that is like not going to be identical, but my directive is always give me the closest possible representation of the thing so that when I say, "Yeah, that's a good idea. Implement that." I'm doing it from a not best guess, but like I can tell that this is the direction we want to do. And if there's a little bit of fine-tuning after that, then it's just an easy like dial kit thing to like, oh, throw those parameters in there so I can tweak it just exactly how I want.

那么我猜底部应该有一个大的复制按钮，它会把所有内容都……哦天哪，看看这个。

And so then I'm presume there's just a big copy button at the bottom and it's just taking in all Oh my gosh, look at this.

看看有多少。

Look how many there are.

天哪。

Oh my gosh.

我的意思是，这太神奇了，因为……是的，你看。好的，我们开始吧。这个列表实际上相当合理，因为它包含了构建这个文件以来的所有上下文。所以这也是它的优点，我实际上回传的东西没有像查看整个列表那么庞大。

I mean, it's amazing because it Yeah, like look. Okay, here we go. This list is actually pretty reasonable like coming out of it because it has all of the context since it built this and has this file. So that's what's great about it too is that I actually pace back something not nearly as huge as looking through that whole list

只是答案列表，把内容打出来。好的。

Just the answer list with whatever typed up. Okay.

是的。但就像，老兄，看看我在一次自主运行中处理了多少事情。我从一开始就设置好这个提示，然后什么都没做，一个小时后回来，就有了这整个东西可以批准、拒绝或讨论。

Yeah. But it's like man like look at how many things I was able to address in one autonomous run. I set this prompt up from the beginning and then did nothing and just came back an hour later and had this whole thing to approve, deny or discuss.

快速插播一条消息，然后我们继续。Framer 刚刚发布了自我开始使用以来最大规模的产品更新，叫做 Framer AI Agents，而且自发布以来他们做了大量改进。我个人最兴奋的一点是，它现在使用的 token 少了很多，尤其是在大型多步骤构建中。这让你在同样的预算内有更多空间来创建和完善你的作品，我已经从中受益匪浅，同时也在为即将推出的 Dive 网站探索很多大胆的想法。用 Framer 构建专业网站比以往任何时候都更有趣、更高效。我完全迷上了他们的最新版本，如果你访问 dive.com/framer，可以获得 Framer Pro 的 30% 折扣，和我一起开始构建吧。另外，Figma 在他们的技术栈中加入了动效，但说实话，我很难放弃像 Jitter 这样的工具。它非常简单，因为它只做好一件事，但相比 Figma 也非常强大。比如，你可以从单个素材生成数百个品牌变体，或者生成一整批 CSV 视频，甚至设计你自己的自定义文本效果。

Real quick message and then we can jump back into it. So, Framer just had its largest product release since I started using it. It's called Framer AI Agents, and they've been making a ton of improvements since launch. And the one that I'm personally the most excited about is it uses way less tokens now, especially on larger multi-step builds. So, this gives you more room to create and refine your work within the same budget, which I'm already getting a ton of benefits from while I explore a lot of out there ideas for the upcoming Dive website. Building pro websites with Framer is more fun and more efficient than it has ever been. I'm completely obsessed with their latest version, and if you head to dive.com/framer, you can get 30% off Framer Pro to join me and start building today. So, Figma added motion to their stack, but I'll be honest, I'm having a hard time leaving a tool like Jitter. It's just so so simple because it does one thing really well, but it's also super powerful compared to Figma, too. Like, you can spin up hundreds of onbrand variants from a single asset or generate a whole CSV's worth of videos or maybe even design your own custom text effects.

它功能丰富，却又是我整个技术栈中最直观的产品之一，毫无疑问。如果你还没用过 Jitter，我强烈推荐。去 dive.club/jitter 就能开始。现在，进入正题。我很期待用它来做动画。

There's so much to it and yet it's one of the most intuitive products in my entire stack. Hands down. So, if you haven't used Jitter yet, I cannot recommend it enough. Just head to dive.club/jitter to get started. Now, on to the episode. I'm excited to use this for animations.

天，我也经常用某个技能，有时它会改动一些东西，我会想，我觉得我明白它改了什么，但我不确定。然后它就会用文字打出来。我觉得，用文字描述动画改动并不是很好的理解方式，就像 Claude 给你的要点列表。我想要的是前后对比，对吧？就是前后对比。

Man, I also use a meal skill pretty frequently and sometimes it'll change something and I'll be like, I think I understood what it changed, but I'm not sure. And then it's like it'll just type it out in text. I'm like, it's not a great way to understand what changed about an animation is just like the bullet point that Claude would give you. A before and after, that's what I want, right? Like the before and after is what I want.

前后对比太重要了。

The before and after is huge.

尤其是动画相关的东西，因为我还在学习这方面的词汇。如果你是个更有经验的设计工程师，处理过很多动效，也许看文字就够了。你会想，我完全明白，如果你真的很资深，你会说，我完全知道你在说什么，不用想象，我懂。是的，那正是我想要的。但如果你还在适应这些东西，还在过渡到那个世界，我从 Claude 的描述中只能得到最模糊的感觉，尤其是现在。所以，看到前后对比真的意义重大。

That especially especially with animation stuff while I'm still again like I'm still learning the vocabulary for all of that. And so if you're like a much more experienced design engineer and do a lot more with motion, maybe seeing it in text is enough. And you're like, I know exactly, you know, if you're really accomplished, like I know exactly what you're talking about. I don't have to imagine it. I get it. And yes, that's what I want. But if you're still getting used to all this stuff and still kind of transitioning into that world, I get the vaguest sense from Claude's description, especially these days. So yeah, seeing the before and after is like massive.

你知道现在什么让我想动手构建吗？我脑海里有个画面，你可以有动画的前后对比，但下面有一个单独的滑块，显示完整的缓动曲线。也许它跨越一千毫秒，然后你能看到它们如何比较。你构建过那个吗？

You know what makes me want to build now? Like I have this picture in my head where you could have the before and after of the animation, but then you have a single scrubber underneath it which has the full easing curve. So maybe it's over like a thousand milliseconds, but then you see how they compare. Did you build that?

Claude 有时甚至在我没要求的情况下就帮我做了。是的，它出现在我参与过的、已经包含 dial kit 的应用里。所以我觉得它在制作时参考了它，然后它会说，哦，我干脆给你加几个滑块，方便你微调。当我说我还在微调阶段，试图找到确切位置时，它有时会凭直觉判断。哦，也许加几个滑块会不错，方便你做细微调整。所以这类东西，现在听自己这么说，我觉得我需要把那个斜杠命令 slashkill 的动画版本，尤其是带滑块和拨盘的部分，正式固化成技能，因为它真的很棒。

Claude has literally done that for me sometimes even without me asking. Yeah, it's it's been on like apps that I've worked on that already had dial kit in it. So I think while it's making it kind of references it or something, it's like oh I'll actually just throw in some sliders in there for you to like when I say like I'm I'm still in kind of the fine tuning stage trying to find exactly where it is. At times it is intuited. Oh, it might be nice if you had some sliders in there to like really do the small tweaks. So this is the kind of stuff that's like I mean now as I hear myself saying this I'm like I need to turn like I have this as like a slash command slashkill but the animation versions especially with the sliders and the the dial part of it I need to I need to ratify that into a skill because it is it is really nice.

你之前谈到你第一次发现 HTML 的时刻，我也记得看到那条推文。它当时没在我脑子里留下印象，我一开始没理解，说实话。然后你说，“嘿，兄弟，我觉得这真的要开始了。”那是几个月前。你在这件事上很早就行动了。我得承认，你相当早。而且它让人上瘾。我确实觉得现在设计师的一大机会是思考如何在你的工作流程中策略性地使用 HTML，因为你可以做任何事。

You were talking about the moment where you first discovered HTML and I remember seeing that tweet too. It didn't register in my brain like it didn't just I didn't get it at first. I'll be honest. And then you're like, "Hey man, I think this is actually going to starting." And this was months ago. Like you were early on this. I will give it to you. You were quite early. And it's addicting. And I actually feel like one of the big opportunities for designers right now is to think about how you can use HTML strategically in your workflow cuz you can do anything.

我来分享一些我最近在做的事情。从比较基础的例子开始，逐步深入到我觉得更有新意的东西。虽然我们应该反过来，因为你的用例太酷了，我无法超越。但我觉得我用 HTML 做的最基本的事情，也是每个人的垫脚石，就是 tellquad。我在做这个组件，这是我想要实现的目标。比如，让我用四种方式做原型，对吧？

I'll share a few of the things that I've been working on recently. Slightly more kind of more rudimentary examples progressing down into things that I I think are slightly more novel. Although we should have went in the opposite order because your use case is sick and I'm not going to be able to top that. But I think like the most basic thing that I started doing with HTML that is I feel like everybody's stepping stone is tellquad. I'm working on this component. Here's what I'm trying to accomplish. Like let me prototype it four ways. Right?

对。

Right.

比如我在做一个 Mac 应用上的代码差异视图，你就给我展示与层级相关的不同东西，很简单。然后你可以回到 Claude 那里说，我真的很喜欢第二个布局。顺便说一句，我全程都在口述。所以我会把光标放在一个容器里，然后一边点击操作一边开始说话。

So I was working on this code diff view for instance on a a Mac app and it's like you know just just show me different things related to the hierarchy. Pretty easy. And then you can just go back to cloud and be like I really like layout number two. And by the way I'm dictating all of this. So I'll just focus my cursor inside a conductor and I'll just start talking while I click around and play with it.

然后我可能会说，我真的很喜欢布局 2，但是等等等等，改这个改那个，然后再给我四个。我会一直这样做，直到它变得很好。

And I might say I really like layout 2 but yada yada yada yada. Change this change that. And then show me four more. And I'll do that until I get to the point where it's good.

所以你的反馈是自由形成的，而我的则像是分段式的，几乎像测试一样。

So you're like free forming your feedback as opposed to like mine that's like very like segmented like a a test almost.

我试过你的方法。我有一个例子看起来更像你的。但当涉及更多探索性内容时，我很大程度上只是把它当作一个视觉对象，然后我可以对着它说话。有不同的方式来做。比如这个，是我在做的另一件事。我有一个提交图表，我想让它感觉像一个指尖陀螺。我无法用语言描述它可能是什么。坦白说，我不想花太多时间在上面。这真的只是一个小巧的附加功能。所以我说，给我一堆不同的效果以及它们可能的样子。你很快会意识到，好吧，我讨厌这个波纹效果，它毫无意义。但我会说，好吧，分散效果很有趣。然后你放大那个，说，好吧，让我们用六种不同的方式展示它。我发布了一个非常有趣的指尖陀螺，除非你意外悬停在上面，否则你不会知道它在 UI 里，然后你会说，“哦，太酷了。”我基于三轮 HTML 原型在大约 5 分钟内发布了它，它直接上线了。所以这是另一个例子，当你需要感受某样东西时，这是一种很好的方式，可以从一百万个不同方向去感受。我以前在静态设计工具里做这个。它适合概念性想法，但当你需要感受它时，它就不行了。但对于 HTML，你可以调整它，当你达到目标时，你就说，“好，构建那个。”它很好。

I've done yours. I have an example that looks more like yours. But when it's more exploratory stuff, I'm very much so just treating this as a visual that I can then talk over. There are different ways to do that. So like this one is another thing that I was doing. I had this commit chart and I wanted it to feel like a fidget spinner. I have no language for what it could be. Frankly, I didn't want to spend that much time on it. Like, this was literally just a little quick add-on thing. So, I was like, just give me a bunch of different effects and what they might look like. And you pretty quickly realize like, okay, like I hate this ripple one. It makes it makes no sense. But I was like, okay, disperse is interesting. And then you zoom in on that and be like, okay, let's just show that six different ways. And I shipped a really fun little fidget spinner that you wouldn't even know it's in the UI unless you accidentally hover over it and then it's like, "Oh, sick." I shipped that in about 5 minutes based off of three rounds of HTML prototypes and it was just in prod. So this is another example where it's like when you have to feel something, it's a really good way to just feel something a million different directions. I was previously doing that in like static design tools. It's good for conceptual ideas, but when you have to feel it, it just doesn't cut it. But for HTML, you can you can dial it in and then when you get it there, you're just like, "Okay, build that." And it's good.

我的意思是，对智能体来说，制作它们也相当便宜。比如，

I mean, and it's pretty cheap for the agents to make them, too. Like,

太快了。

so fast.

我们在处理更大范围的事情时仍然使用纸张之类的东西，但没错，当涉及动效且我需要感受它时，在 HTML 中做原型，速度和相对较低的 token 成本是巨大的优势。

We're still using paper and stuff like that when we're on bigger surface area kind of things, but yeah, when there's motion and and I need to feel it prototyping it in HTML, it's just the speed and and like low token cost relatively is huge.

这里我开始尝试不同的格式。所以我想，“好吧，如果它实际上不是关于创建东西呢？帮我理解一个 API。”比如我在基于 GitHub API 构建。

Here's where I start to play around with different formats. So I was like, "Okay, what if it's not actually about creating something? Help me understand an API." Like I was building on top of the GitHub API.

我从未基于 GitHub API 构建过。我对可能实现的功能只有非常基本的了解，比如显而易见的东西，分支信息，但我想，里面可能有很多我不知道的东西。所以我说，给我创建一些可以滚动浏览的东西，让我看看所有我可以获取的不同内容。它会为我分类。比如检查和可合并性。

I've never built on top of the GitHub API. I have a very rudimentary idea of what is possible, the obvious stuff, branch information, but I was like, there's probably a lot in there that I don't know. So I was like, just create me something I can scroll through and just look at all of the different things that I could I could pull from. And it would break them into categories for me. So it's like checks and mergeability.

它向我展示了所有我可能从中创建的不同独立组件，以及某物的大小和形状。

And it showed me all of the different individual components that I might be able to create from it, or the size and the shape of something.

你想怎么做？

How would you want to?

哦，酷。你可以按语言来拆分。我甚至没想到这一点，你知道的。

Oh, cool. You could break it down by language. I didn't even think about that, you know.

同样的事情。我就开始口述，把关于 GitHub API 视觉化呈现中所有我觉得有趣的东西都讲了一遍，然后它帮了我。我的意思是，想想这在过去就是他们必须和开发者进行的一次对话。就像说：“嘿，老兄，我们能安排个会议聊聊 GitHub API 以及它应该如何给我们启示吗？”

And same kind of thing. I just start dictating and I just talked through everything that was interesting to me about the GitHub API rendered visually, and then it helped me. I mean, think about like this would just be a conversation they have to have with a developer like in years past. Be like, "Hey man, can we schedule a meeting and talk about the GitHub API and how that should inform us?"

而你在他们对你倾倒信息时拼命记笔记。

And you're trying to furiously write notes while they just brain dump on you.

完全同意。完全同意。现在就像我知道我为自己创建了一个视觉游乐场，效果惊人。

Totally. Totally. And now it's like I know I just created like this visual playground for myself and it worked amazing.

是的。从教育角度来做真的很酷。几个月前我做了类似的东西。基本上有人给我发了一篇文章。我猜那是一篇有 12 章之类的文章。我讨厌那个网站本身的排版方式。所以我做了一个重新包装的技能，基本上就像你做的那样，比如我讨厌这样。我喜欢的是大量的空白，几乎像幻灯片级别。我可以只通过这些小块来消化所有内容，就像你这里的方式一样。从那以后我只用过几次，但这种风格——我想以不同于廉价 HTML 文档呈现给我的方式来消费信息——是最好的。

Yeah. Doing it from the education side is really cool. I made something kind of like this several months back. Someone sent me an article basically. I guess it was an article that had, you know, 12 chapters or something. And I hated the way that the site itself was formatted to read. And so I just made like a repackaging skill that basically does like what you did, of like I hate how this is. What I like is a lot of space and just a like almost slide level. I can digest everything in just these bites, like exactly that you the way you have here. I've only used it a few times since, but the style of just like I want to consume information differently than it's presented to me via just cheap HTML documents is the best.

我再给你看一个我觉得很酷的，灵感来自 Rafael Shod，他是 Cron 的创始人，后来被 Notion 收购，我大约两年前采访过他。他说他有一个 Figma 文件，把每一个 toast 对话框、错误通知、系统会说的每一件事都放在里面，他有一个单独的文件，在那里他会一起查看所有这些，然后写文案，确保它们都很好。我深受启发，因为那总是事后才想到的事。那总是我让它溜走的事情。在 Figma 里做那需要很多手动工作，但天哪，你可以在 Claude 里一次搞定，而且完美。你只要给我每一个系统对话框，然后……

I'll show you one other that I thought was pretty cool, which is inspired by Rafael Shod, who was the founder of Cron and that was acquired by Notion, and I interviewed him like two years ago, and he said something about how he had a Figma file where he put every single toast dialogue, error notification, every single thing that the system would say, and he had a single file where he would look at all of them together and like write the copy and make sure that they were all good. And I was so inspired by that because it was always an afterthought. It was always a thing that I let slip through the cracks. A lot of manual work to do that in Figma, but my god, you can oneshot that in Claude and it's perfect. You just give me every system dialogue and so

我现在能看到它，但我可以打字。

I can now see it, but I can type.

这正是我要问你的。我对这个不太确定。你当时说，我还是直接口述，我就想，希望你加了内联编辑。

That's what I was going to ask you. I was unsure of this one. You were like, I still just talk through it and I was like, I hope you added inline editing.

太棒了。就像你们都能想到这对内容团队来说会有多酷。

It's so great. Like you could all think about how cool this would be for like a content team, too.

就像这可能甚至不是我的工作。你可以建立一个 UX 写作生态系统，把它发给团队，他们就直接做，然后你得到一个提示回来。

Like this might not even be my job. You could build a UX writing ecosystem, send that off to the team, and they just do it, and then you get a prompt back.

我不知道独立的 HTML 文档能做这么多。作为一个从设计师转行的构建者，那对我来说完全是个盲点。

I had no idea how much standalone HTML documents could do. That was just a complete blind spot for me as a designer turned builder.

我也是。我们说的是几个月前，实际上时间过得真快。你当时很早。到现在可能已经 6 个月了。我也有完全相同的经历，我当时想：“你是什么意思我可以用 HTML？”“哦，酷。我可以快速做模型。”但后来你意识到，不，你几乎可以做任何事情，构建任何类型的工具。

Same. We're talking like a few months ago, and actually time's going pretty fast. You were early. Maybe it's 6 months ago by now. I've had the exact same journey where I was like, "What do you mean I can use HTML?" "Oh, cool. I can just make quick mockups." But then you realize, no, you can literally do anything and build any type of tool.

这影响巨大。我相信还会有更多这样的例子，希望看这个的人能想出他们自己独特的用例。

It's been huge. I'm sure there's going to be that many more like examples of this that hopefully people that watch this come up with their own unique use cases for this.

是的，你应该在 Twitter 上发给我们，因为

Yeah, you should send it to us on Twitter because

是的，

yeah,

有时候很难想到它们。

it's hard to think of them sometimes.

是的。我的意思是，在几乎所有情况下，就像我认为在我们的两个例子中，我们总是偶然发现这些流程、工具和工作流等等。不是凭空想象，就像坐在椅子上想象我们能做什么。它总是在解决我们自己流程中的部分或我们试图完成的事情，这对我们和大多数人来说是最好的方式。所以，是的，我相信还有其他不同背景的人会为这个找到非常有趣的用例，我很乐意看到。

Yeah. I mean, in almost all of it, like I think in both of our examples, we always stumble upon these processes and tooling and workflows and all that stuff. Not from whole cloth just like sitting back in a chair and just like imagining what we might be able to do. Like it's always solving parts of our own process or things we're trying to accomplish which is the best way for us and for most people. So yeah, I'm sure there's other people with different contexts that will find really interesting use cases for this that I'd love to see.

嗯，你在设计社区里在 HTML 方面相当早。我想知道你是否在考虑其他事情，比如你现在早期在摆弄什么，而我几个月后会玩的东西。

Well, you were quite early in the design community on the HTML front. I'm wondering if there are other things that you're thinking about, like what are you early on and tinkering with now that I'll be playing with a couple of months from now.

这是一个由西雅图派克市场的 Internet Development Studio 团队制作的测试版应用。所以，一个叫 Jimmy Lee 的人拥有它，并和一些合伙人一起运营，我最近大约一个月都在那里工作，这很棒。就像它是一个联合办公空间，但每个人，你知道，那里有来自 Blue Sky 的人。有来自 Vercel 和 Anthropic 的人，还有很多其他东西，还有真正来自 Indevev 的人。有一群独立开发者和这些公司的人。每个人都在做自己的事情，但每个人都在做网页和应用开发。所以，这真的很棒。但正因为如此，我接触到了这个叫 Terminal Graph 的工具，Kaden Williams 是主要开发者。但它本质上是一个大图，你可以在上面放任何与开发相关的东西。所以终端、笔记、浏览器、窗口、文件编辑器、图像查看器、视频播放器。它有各种各样的东西，基本上暴露了很多开发原生界面，但不仅仅是像在终端后面，也有大量的终端等等，但这让你能看到一切。我想要启动的是一个可以重复的过程，每当我寻找某个东西的全新设计方向的变化时。也许是一个全新的应用。在这种情况下，我正在重新设计我为朋友们做的 NFL Pick'em 应用，我们去年用过，但我想要一个全新的 UI，而且我也要把它做成原生的。所以，在某些方面我从零开始。所以我没有具体的视觉想法。所以我用这个作为测试案例，但基本上每当我想要变化时，我发现我已经厌倦了想出五个变化，也许用这个技能来做，也许那些开始变得有点可预测，我已经看过足够多次这些模式，它没有给我任何鼓舞人心或足够精致的东西，比如有太多明显的，你甚至不应该给我看那个。这个上面有太多错误，或者有太多我需要纠正的东西，甚至无法就我喜欢什么和不喜欢什么进行良好的对话。这个过程有点试图帮助优化自主循环的输出。所以基本上这就是我的常规终端，上面有 Claude，Terminal Graph 里有一个 MCP 和 CLI 供它使用。

This is an app that's in beta made by the folks at the Internet Development Studio in Pike Place, Seattle. So, a guy named Jimmy Lee owns it and runs it with some partners, and I've been working out of there almost last month or so, which has been great. Like it's a co-working space, but everybody, you know, there's folks from Blue Sky there. There's folks from Vercel and Anthropic and a bunch of other stuff along with the people actually from Indevev. There's a bunch of solo builders and people at these companies. Everyone's working on their own things, but everyone's working in the web and app development space. So, it's been really great. But I because of that was turned on to this tool called Terminal Graph that Kaden Williams is the main dev on. But it's essentially like a big graph that you can put anything on here dev related. So terminals, notes, browser, windows, file editor, image viewer, video player. It has all kinds of stuff that are basically like exposing a lot of dev native surfaces, but instead of it just being like behind a terminal, also tons of terminals and everything, but this allows you to see everything. What I wanted to get going was a process that I could repeat where whenever I'm looking for variations from like a whole new design direction on something. Maybe it's a brand new app. In this case, I'm redesigning the NFL Pick'em app that I made for my friends that we used last year, but I want like a completely fresh UI and I'm making it native, too. So, I'm starting from scratch in some ways. And so I have a really I don't have anything specific in mind visually. So I'm using this as the test case, but basically whenever I want variations, what I've been finding is that I'm just kind of gotten tired of come up with five variations and maybe use this skill to do it and maybe those start to become kind of predictable and I've kind of seen the patterns enough times and it's not giving me anything inspiring or refined enough like there's too much obvious like you shouldn't have even shown that to me. There's too many errors on this or too many things I'd have to correct to even have a good conversation about what I like and what I don't like. This process is kind of trying to help refine the outputs from an autonomous loop. So basically what this is, this is my regular terminal that has Claude up and there's an MCP and CLI within Terminal Graph that it uses.

这就像是我们制作这些修订、这些变体的简报的可视化布局，以及它沿途会调用的不同技能。它并没有连接到这些节点——你会看到这边的连接器——但这是为了让我能直观地看到。基本上，当我从这里触发构建时，它会将通用提示词发送到整个流水线。所以我会得到五个风格完全不同的变体。然后它会使用我们已识别的特定技能进行审核。接着把审核结果放到这里的文档中，然后进入下一轮。所以智能体会看到审核意见，根据独立子智能体做的上次审核进行调整、修正、优化等等，在第二版上进行修改，然后同样的事情再次发生，直到第三版。

This is like a visual layout of the brief that we have for making these revisions, for making these variations, and the different skills that it's going to invoke along the way. It's not connecting to these nodes—you'll see the connectors over here—but it's for me to be able to see visually. Basically, when I trigger the build from here, it sends the general prompt through this whole pipeline. So I'm getting five variations with totally different styles. Then it goes through audits using particular skills that we've identified. Then it puts the review into a doc here, and then it goes to the next run. So the agent sees the review, makes adjustments, corrections, refinements, whatever, based on the last review done by an independent subagent, edits things on the second version, and then the same thing happens again and gets through to the third version.

所以你现在看到的仍然是一个非常进行中的流水线，因为我现在要做的就是基本上找到这个过程中哪些地方感觉没有达到我想要的效果。比如这里和这里之间，你看到有一些变化——不是很多，但我觉得这两者之间需要更好的细化。但我知道我可以在这里面去影响这些变化。比如这里，你看到这个提示文本——这里写的任何内容，我都可以添加任何类型的指令或双重检查提示等等，然后它会被注入到这部分来生成第三版，或者告诉它用这个技能进行审核，实际上再做一次传递，调用另一个视觉技能，这个技能往往会产生更多样化的结果，或者从特定角度进行更多细化。

So what you're seeing right now is still a very work-in-progress pipeline, because now what I have to do is basically find where in this process it feels like it's not making enough difference that I want. Like between here and here, there are some changes that you see—it's not a ton, but I think I'd like better refinement between those. But I know where I can go in here to affect those changes. Like here, you see this hint text—anything written in here, I can add any kind of instruction or double-check prompt or whatever, and that will then get injected into this part to create the third version, or tell it to actually review with this skill, actually do another pass invoking this other visual skill that tends to produce more varied results or refines it more from this specific lens or whatever it is.

最终出来的会是一个蓝图，我可以用于任何我正在做的、需要构思的项目。但重点是，我启动了一个流程来获得变体等等。当它说完成时，我最终看到的东西里，有很多通常我要等到第一轮才会出现的东西。然后我会说改这个、改那个。我不想一直告诉它去修改，就像你告诉实习生那样。让我们达到扎实的水平，然后我基于我喜欢和不喜欢的东西来工作，而不是仅仅说这是一个明显的糟糕视觉设计决策。

What will come out of this is a blueprint that I can use for any project that I'm working on that I want ideation. But the whole point is I set a process in motion to get variations and stuff. By the time it says I'm done, what I'm looking at at the end has a lot more of the things that normally I'm waiting for round one to happen. Then I say fix this, fix this. I didn't want to keep telling it to fix stuff like you would tell an intern. Let's hit the bar of solid, and then I'm working from what I like and don't like, not just like this is an obvious poor visual design decision.

我在做后院设计师那个事情的时候也有这种感觉，就像每当我创建一张图片时都会发生评估循环，你可以看到 Codex 这样做，它会创建图片，然后有一个独立的评审者过来说，不，这里不行，或者它会生成三个然后选一个并说明原因。看着真的很有意思。我有点被引导到类似的地方，我就想，天哪，我也想要这个用于我的 UI 输出，因为我一直在做同样的事情。这很有帮助，确实有帮助，但我做了很多细粒度的，比如，拜托，真的，为什么我们又这样做了，这感觉就像有了一个合适的——我的意思是，你拥有的几乎就是一个小型的视觉评估循环。

I was feeling this actually doing the backyard designers thing, like there was the evaluation loop that happened whenever I would create an image, and you could see Codex do it, where it would create images and then have a separate reviewer come in and be like, no, it doesn't hit here, or then it would take like three and then pick one and why. And it was really interesting to watch. I kind of was led to similar places where I'm like, man, I want this for my UI output too, because I'm doing the same thing all the time. It's helpful. It's net helpful, but I'm doing a lot of granular, like, come on really, why did we do that again, where it does feel like with a proper—I mean, what you have almost is like a little visual eval loop.

完全正确。是的。

Exactly. Yep.

是的，这挺酷的，挺酷的。看到这一切还是有点让人望而生畏。所以我很高兴你展示了基于节点的东西，因为我对节点非常不熟悉。我还没完全弄清楚它如何适应、在哪里适应以及什么时候会用到它。所以跟我谈谈你认为你什么时候可能会用到这样的东西，然后实际搭建它需要什么？比如你实际上把时间花在哪里来创建这样的东西？

Yeah. That's kind of cool. That's kind of cool. It's still a little bit daunting to see all of this. So I'm glad you're showing the node-based stuff, because I'm very green on node-based. I just haven't quite figured out how it fits and where it fits and when I would use it. So talk to me a little bit about when you think you might reach for something like this, and then also what did it actually take to set up? Like where are you actually spending the time to create something like this?

构思的方式和我们平时一样。好消息是我没有做这些。我没有手动创建任何这些东西。我所做的只是对着这个终端说话，还有 MCP 和 CLI。所以它通过 CLI 通信，然后通过 MCP 进行操作。它可以创建所有这些东西。然后一旦它创建了所有东西，我就说，好吧，就把它排列成一个视觉上堆叠的方式，你知道，1 2 3 4 5 水平流水线，这样我就能看到流程。

Ideating the same way that we always do. So the good news is I didn't do any of this. I did not manually create any of this stuff. All I did was talk into this terminal, and the MCP and the CLI. So it communicates to the CLI and then does the manipulations through the MCP. It can create all of this stuff. And then once it created everything, then I was just like, okay, just arrange it in a way that visually is stacked, you know, 1 2 3 4 5 in a horizontal pipeline so that I can just see the flow.

所以从搭建的角度来看，我并没有非常规定性和细致地指定哪些节点连接到哪里，哪些工具和窗口放在哪些位置。我仍然做了我们一直在做的事情，那就是语音倾倒。我想要什么，为什么想要？这基本上就是我向你描述的，就像我厌倦了告诉 Claude 对变体做愚蠢的小编辑，让我真正处于一个可以评估想法的位置，而不必在感觉能真正评估之前告诉你修复这 10 件事，或者只能想象等等。

So from a setup standpoint, I was not super prescriptive and granular about what nodes to connect to where, which tools and windows to put in which spots. I still did the same thing that we've always been doing, which is just like voice dump. What do I want and why do I want it? Which is basically what I was describing to you, which is like I'm tired of telling Claude to do dumb little edits on variations for me to actually be in a place of, okay, now I can assess the idea and not have to either tell you to fix these 10 things before it even feels like I can really assess it, or just having to imagine that or whatever.

所以我告诉它我想要的结果。我给了它来自 terminal graph 的文档站点。我已经接入了 MCP 和 CLI，然后它做了所有其他事情。所以好消息是，你对节点的恐惧感，比如啊节点什么的，就像，哦不，这有点像让你的智能体以不同的方式可视化 API，使其对你来说易于理解。

So I told it the outcome that I wanted. I gave it the doc site from terminal graph. I had the MCP and the CLI plugged in already, and it did everything else. So the good news is, your intimidation factor of like, ah nodes and all that, is like, oh no, this is kind of like you having your agents visualize what the API is in a different way that makes it understandable to you.

虽然所有这些小东西——我不太完全理解每个流水线如何相互连接，每个节点、每个连接器等等——但我可以很容易地直观理解过程中的位置。这就是为什么我有所有这些浏览器节点显示 V1、V2、V3 的 HTML，因为这样就不用黑箱操作，比如我告诉你经历所有这些迭代，现在我看到了 V3，但我不知道中间发生了什么。而像这样直观地看到它，尤其是在我开发这个流水线的时候，让我发现，比如，一和二之间的审核太弱了。我需要让它做一个三层审核过程，然后再进入步骤二和三，因为它就是没有捕捉到足够多的东西。

While all these little things—I don't quite understand exactly how every pipeline is interconnected and every node, every connector and stuff—but I can pretty easily visually understand where in the process. And that's why I have all these browser nodes showing the HTML of V1, V2, V3, because then instead of having the black box of like, I told you to go through all these iterations, now I see V3, but I don't know what happened along the way. And seeing it visually like this, especially while I'm developing this pipeline, lets me find like, man, review between one and two, the review is too weak. I need to have it do like a three-layer review process before it goes into steps two and three, because it's just not catching enough stuff.

是的，这很有趣。我确实把大多数基于节点的用例放在更偏向视觉品牌营销之类的事情上，连接工具，但我没有考虑过这个用例。这是我每天都会做的事情，感觉如果你把系统调好一次，你就可以一直使用它。我会使用这样的东西。所以也许你在这方面是早期的。也许这对我来说又是另一个 HTML 时刻，我当时觉得不太明白，现在有点懂了。你可以直接告诉你的智能体你想要完成什么，然后说通过 terminal graph 工具来做，这里是文档站点。

Yeah, it's interesting. I had definitely put most of the node-based use cases in more of the visual brand marketing kind of thing, connecting tools, but I hadn't considered this use case. And it's something that I do every single day, where it does kind of feel like if you get the system dialed in once, you can just use it all the time. And I would use something like this. So maybe you are early on this. Maybe this is another one of those HTML moments for me where I'm like, doesn't quite make sense. I kind of get it now. The fact that you can just tell your agent what you want to accomplish and then say like do it through the terminal graph tools and here's the doc site.

没有入门障碍，比如你需要学习如何连接节点。

There is no barrier for entry of like, you need to learn how to connect nodes.

你不需要，你只要告诉智能体，文档、CLI 和 MCP 足够强大，可以为你做这件事，然后无论你想迭代什么，你只需回到你的主终端。

You don't, you just tell the agent, and the documentation and the CLI and MCP are powerful enough to do this for you, and then whatever you want to iterate on, you just go back to your main terminal.

说到用语音随意表达、把事情做出来，我能分享一个最近几周我经常用的工作流吗？

On the topic of kind of just rambling and dumping with our voice and making things happen. Can I share a workflow that I've been doing a lot more over the last few weeks?

当然，请讲。

Yes, please.

好的。你用过 Supercut 做视频吗？我记得他们几个月前发布的是他们的 MCP，但我不太明白它怎么融入我的工作流。我最近开始用了，还挺棒的。简单来说，Supercut 就是个更好的 Loom，对吧？

Okay. So, do you use Supercut for video? What I remember them launching months ago was their MCP, but I didn't quite understand how it would fit into my workflow. I've started using it recently and it's kind of awesome. So, the TLDR basically is that Supercut is just a better Loom, right?

对。

Right.

但他们有个 MCP，能把你的转录和每一帧对应起来，让 Claude 能解析。所以我现在很多反馈，以前可能用 Agentation 之类的工具，现在就直接录视频，让 Claude 生成东西，然后我对着视频随意说，有时一说就是六七分钟，像早期做新东西的时候，我会一口气给 15 条反馈。

But they have an MCP that does a really good job of mirroring your transcript to the individual frames and then making it so that Claude can parse that. And so, I'm giving a lot more of my feedback that previously maybe I would have done in something like Agentation. I'm just doing it via video where I'll have Claude generate something and then I'll just ramble in a video sometimes for like six, seven minutes. I'll just dump it with like 15 pieces of feedback, especially early stage when I'm doing like a new build on something.

那准确度怎么样？

Okay, but what's the accuracy there?

比你想的高得多。

Way higher than you would think.

真的？

Really?

高得多，大概 80% 到 90%。

Way higher. We're talking 80-90%.

太不可思议了。

That's incredible.

你得试试。我很久都没当回事，因为我觉得这不可能好用。其实它相当不错，而且适合不同类型的事情。我给你看两个用例。我今天就刚这么干了。我在用 Conductor，我很喜欢它那个内联图片功能，就是你可以打字然后加更多图片。我超爱这个，其他工具里都没有。我在 Inflight 里做的东西想支持这种功能。以前我可能就加个附件按钮，像 GPT 那样加图片，但我想要这种。所以我录了一分钟的 Supercut，就是我用裁剪工具展示这个组件，然后我实际用它，解释各种状态、整体 UI 和功能，然后我把它粘贴到这里，出了个小 bug，但 Claude 就开始构建了，它说视频里说要把编辑器做成那样，然后居然就成功了。这就是我几小时前刚做的，哥们，它基本一次就搞定了。我只需要调整一下对齐，那个 chip 大概偏了 4 像素，但它甚至把 Supercut 的风格也吸收了，更新成匹配我们的三级按钮，这正是我本来会做的。我简直了，你看这个，它就存在了。我从一个 Supercut 视频一次就做出来了。

You got to try it. Like I wrote it off for so long because I was like there's no way that this is good. It's actually pretty good and it's good for different types of things. So, I'll show like two use cases. I literally just did this today. I was in Conductor and I really like how Conductor has this inline image thing. So, you can type and then add more images like this. I love that. And I miss it in all my other tools. And I'm building something in Inflight where I want to allow that type of functionality. And previously, I would have probably just had like an attach file button and add images like you do in GPT, but I want this. And so what I did was I just recorded a Supercut that was a minute long of me literally doing the crop tool and I just showed this component and then I just used it and explained all of the different states and the general UI and like functionality and then I just pasted it in here and we had a little tiny bug but then Claude just starts building like it says the video's ass was build our editor to be like quoted too and it kind of worked. Like this is I literally just built this a few hours ago and dude it basically one-shotted this. I had to tweak the alignment where the chip was like down about four pixels, but it even took the Supercut style and updated it to match our tertiary buttons, which is exactly what I would have done anyway. And I freaking built like look at this, man. It just exists. I one-shotted that from a Supercut video.

我本来会以为它不够准确，不能很好地提取反馈。你需要安装什么包吗？或者它是不是用了 ffmpeg 之类的？

I think I would have just assumed that it wouldn't be accurate enough, that it wouldn't like pull the feedback from it well enough. Did you need to install any packages or anything like is it using ffmpeg or anything like that?

全都是通过他们的 MCP，就这么简单。所以我会为这种特定的事情用它。但你知道吗，我最近开始回归以前的工作方式了。我最近在 canvas 里做了更多设计。不知道为啥，我做了很多从零开始的思考，其实有几周我用了更少的 AI，就是按老办法做事。

It's all just through their MCP. It's literally it. So I'll do it for specific stuff like this. But then you know what I've started doing is actually channeling back to like how I would work a while ago. I actually have been doing a lot more designs in canvas recently. I don't know. I was doing a lot of green field thinking and I kind of used a lot less AI for like a few weeks actually and I just kind of did things the old-fashioned way.

感觉怎么样？

How did that feel?

感觉很好。虽然慢一些，但我还是用了我们一直在用的那些构思方法。我做了各种 HTML 原型，但实际的设计大多是我自己做的。

It felt good. It felt slower but I still used all of our ideation tactics that we were using. I was spinning up all kinds of HTML prototypes but the actual designs I mostly did myself.

所以我就到了这一步，我想：“好，我有这个页面的核心状态了。我都布局好了。虽然比我在 Figma 里做的粗糙一点，但大致思路是一样的。”所以现在我要构建这样的东西，我的提示词就是：“嘿 Claude，看看选中的帧。”我这里有个选中的帧，还有一些注释提供上下文。然后我录了一个 Supercut，就是像给工程师交接那样，对着设计稿说话。我完全把它当成交接。我只是额外给了它四分钟关于我想实现什么的上下文。然后我给它 paper 的 URL，这样它就能拿到所有代码。我给它 Supercut，这样它就能得到我所有的上下文。然后我就说“构建这个”，就完了。

So I got to the point where I was like, "Okay, I have the core states for this page. I have it all like laid out. It's a little rougher than I would have done in Figma, but it's like the same general idea." So now my prompt to build something like this would be, "Hey Claude, look at the selected frame." So I have the selected frame here. I have some annotations for context. And then I made a Supercut of me just talking over the designs like I would for an engineer for like handoff. I'm treating it exactly the same as handoff. I'm just giving it an additional four minutes of context of what I want to accomplish. And then I'm giving it the paper URL so it can get all of the like the code. I'm giving it the Supercut so it gets all of my context. And then I just say build this and that's it.

是啊，它搞定了。

Yeah, that's and it crushed.

太酷了。尤其是因为你给了智能体足够的接触面。通过 paper 的 MCP 之类的，你选中帧然后谈论它，这就把那个标识符给了智能体。我觉得这也是我们用的很多工具和工作流的一个主题。我们一直在尝试描述，把东西“交到智能体手里”，或者说让它变成它们能接触的东西，这样接触标识符就是确切的东西，你能看到所有代码，知道我在说什么，而我的谈论和这个组合，似乎是我们构建的很多东西里的一个主题。

That's super cool. Especially because it's just like you're giving enough surfaces for the agents to like touch. So through the paper MCP and stuff because you know you select the frame and then you talk about it, it's giving that identifier to the agent. And so that's I feel like that's kind of a theme too of a bunch of the things the tooling and the flows that we're using. We're continuously trying to describe and like put something into the agents hands quote unquote or or make it something they can touch so that the touch identifier of exactly this thing and you can see all the code and what it is that I'm talking about and my talking about it that combo is seems like a theme in a lot of the stuff we've been building.

有一个问题我忍不住一直问自己：如果公司反过来申请和你对话，而不是你去找他们，会怎样？这个问题就是全新的 Dive Talent Network 的基础。而且它正在奏效。现在，我正在帮助我认识的最令人兴奋的初创公司，雇佣那些收听这个节目的设计师和构建者。所以，如果你好奇外面有什么机会，也许你想加入我的名单，或者你正在寻找你的下一个设计人才，就去 dive.club/talent 加入吧。

There's one question that I can't stop asking myself. What if companies applied to talk to you rather than the other way around? And that question is the foundation for the all-new Dive Talent Network? And it's working. Like right now, I'm helping many of the most exciting startups that I know to hire the designers and builders who listen to this show. So, if you're curious what might be out there, and maybe you want to get on my list, or maybe you're even looking for your next design hire, head to dive.club/talent to join today.

你怎么决定什么时候投入做一个个人工具或辅助工具之类的？

How do you decide when you're going to invest in a personal tool or a helper utility or something?

我觉得对我来说一条线是：这是个快速的 HTML 东西还是别的？因为我其实花了不少时间，比如我做了这个本地工具。它看起来有点像 dial kit 的 Agentation 风格，覆盖在你的 UI 上，整个想法是创建一个 UI 来可视化 Claude 会为你构建的不同变体。

I think one line for me is the is this a quick HTML thing or anything else? Because I actually spent quite a bit like I built this local tool. So it kind of looked like a kind of like a dial kit Agentation style like overlaid on top of your UI and the whole idea was to create a UI to visualize the different variants that Claude would build for you.

这正是你构建的那种工具，你可以说“批准这个”、“丢弃这个”或“调整这个”，然后把它打包成一个提示词。太棒了，感觉很好，确实是个高质量的工具。但后来你意识到，我根本不需要这个。我直接用 HTML 做反而快得多。实际上，这应该只是一个技能。

It was exactly what you built where you could kind of say like approve this one, discard this one or tweak this one and then bundle it all up into a prompt. It was awesome. It felt good. It was really a high quality tool. But then you realize like I don't even need this. It's like I can it's so much faster to just do it in HTML quickly. And actually, this should just be a skill.

有意思，我很久都没想过这个了。比如你展示的第一个 HTML 东西，

It's funny. I didn't even I hadn't thought about that in a long time. Like the very first HTML thing that you showed,

我把它做成了一个本地小部件，用来和 Claude 对话。

I built that as a local widget that would talk to Claude.

一个非常优雅的本地小部件。

A really elegant local widget.

肯定很漂亮。

I'm sure it was beautiful.

毫无价值。

Worthless.

哦，它太漂亮了，简直不能再没用了。

Oh, it was so beautiful. It could not be more worthless.

是啊，我想我们俩都有很多这样的“坟墓”。但我喜欢你展示的一些东西，因为它让我想起，随着时间推移，我们经常讨论这个问题：大工具会不会直接吸收这些功能，把它们做成原生的？如果是这样，我就不该花时间在上面。但我也注意到，我变得越来越技术化了。我的意思是，我们一直都很相似。我觉得我比你早一点跳进这个池子，但只早一点点。

Yeah. Yeah. There's we both have graveyards, I think, of a bunch of things like that. But what I like about some of the stuff that you're showing me is that it's reminding me of, because as time goes on, you know, we talk about this with regularity, like again, are the big tools just going to absorb this and build this in and make it native anyway? If so, I shouldn't spend time on it. But also, what I've noticed, I've been getting a lot more technical. Like I mean, that's always kind of been like you and I have been pretty parallel. I think I jumped headfirst into this pool a little bit ahead of you, but only a bit.

说“平行”太抬举我了。

Parallel is doing me a lot of credit there.

接近平行，但是……

Close to parallel, but but

我一直落后你一个月，就像我把自己绑在了一艘快艇上。

I've been one month behind you and it's been a little speedboat that I've just hitched my rope onto.

是的。我喜欢和你聊你正在做的事情，是因为我觉得你一直在提醒我，不要假设它在我想要它做的事情上可能有多好或多不好。比如视频这件事。我不会想到去录屏，就像如果我们一起做产品，比如当年做 Dive Club OS 的时候，我们可能会录一段自己演示的视频。所以这就是我做的，我不确定这部分，你告诉我你觉得这个流程和输出怎么样等等。当然那不太视觉化，但在视觉层面上更容易想象。把同样的东西分享给一个智能体，就像我发给设计师或工程师的那样，我想到的频率远没有应该的那么高。有时候确实，它还没到那一步。但这也让我开始列一个清单，记录我假设模型很快能做到但可能还做不到的事情，每当新模型出来时，我就检查一下。我刚开始做这个，还没怎么用，除了在 Opus 5 上试了一点。比如“嘿，检查一下它现在能不能做这个”，因为你能感觉到离实现不远了。有时候甚至不是某个工具或功能被特别提到，只是“哦，它现在能很好地处理视频了”。现在，你想听一个可能会让你震惊的视频用例吗？

Yes. What I like about when I talk to you about what you're doing is that I think you keep reminding me I need to not assume how good it might be or might not be at this thing that I want it to do. Like the video thing. I wouldn't have thought to screen like like I would send if we were working on a product together and like when we were working on the dive club OS thing back in the day. We might take a video of ourselves walking through. So here's what I did. I'm not sure about this part. Let me know if you like the way that this is flowing and the output like this blah blah blah. And granted that was less visual, but it's easier to imagine on a visual plane. Sharing that same thing with an agent of exactly the same thing I would send to a fellow designer or my engineer doesn't occur to me nearly as often as I think it should, which sometimes it's like, yeah, it's not there yet. But that's also been like a thing that I've started taking a list of things I assume that the models are going to be able to do soon but maybe can't quite that when a new model comes out. I've just started this now. I haven't like I haven't used it much except for a little bit on Opus 5, but like a hey double check if it can do this now cuz I you can feel when it's like we're not far from this being the case and then sometimes it's not even a tool or a feature that anybody calls out. It's just oh it can process video quite well. Now, you want to hear a video use case that'll probably blow you away a little bit is

我一直在和 Decimals 团队紧密合作，构建支撑人才网络的平台。我本想分享屏幕，但里面全是敏感信息，所以不能。你得听我描述了。我通常做的是，要么审核一批申请者，要么做分享列表。比如今晚晚些时候，我可能有八九家公司，它会浮现出我应该分享给他们的人，我会浏览一下，创建一个小列表，然后点击分享按钮。平台变化很大。早期，有个叫 Ed 的家伙会问我：“嘿，你能录一段你使用产品的超剪视频吗？”有时候我会录，他会看，但看视频很费时间，对吧？所以我们后来就少做了。但后来 Fable 出来了，它突然变得非常擅长用 Supercut MCP 解析长视频。所以现在，当我开始这个审核流程时，比如一次会话可能要 40 分钟，我会用 Supercut 录下整个过程。有时候我根本不说话，大多数时候都不说话。但偶尔我会说：“啊，你知道，我希望我能做这个”或“这个不太像我预期的那样工作”。它会提取所有这些，自动变成工单给他们，然后还会根据观察我使用产品的情况，做一个通用的 UX 审计，提出改进建议和增强工作流程的方法。他们发布的速度越来越快，一切都始于我把上次会话的超剪视频交给它，然后它就自动开始了，这太疯狂了。未来很多这种事情都会自动发生。

So I've been working very closely with the team at Decimals to build the platform that powers the talent network. I would share my screen, but it's all a bunch of sensitive information, so I can't. So, you'll just have to bear with me here. But what I end up doing is I'll do these either reviewing a bunch of people applying or I'll do like a share list. So, you know, later tonight I probably have, I don't know, like eight or nine companies that it'll surface people that I should share with them and I'll kind of go through and create like a little list and hit this share button. And the platform is evolving a ton. And so what in the early days this guy Ed would do is he would ask me, hey, can you just make a supercut of you using the product? And sometimes I would do it and he would go through it, but also like it takes forever to watch, right? So we started doing it less. But then Fable came out and all of a sudden it got really really good at parsing long videos using that Supercut MCP. And so now what I do is when I start this review process, which maybe it'll take me like 40 minutes for a session, I'll record the entire thing on Supercut. And sometimes I'm not even talking at all. Most of the time I'm not talking at all. But every once in a while I'll be like, "Ah, you know, I wish I could do this or this isn't quite working the way I thought it would be." It'll pull out all of those, automatically turn it into tickets for them, and then also just do a general UX audit based off of watching me use the product to suggest improvements and ways to enhance my workflow. And the speed that they've been able to ship is increasing so rapidly and everything's kicked off by me just handing the super cut of my last session and then it just starts, which is crazy, man. Like so much of this stuff is going to be happening automatically in the future.

我记得 Cleo 两年前来参加一个播客。我问了他一个傻问题，比如“你觉得一年后别人会更关注什么？”然后他就开始长篇大论地讲自我改进的产品。

I remember Cleo coming on like two years ago to a podcast. And I asked him some silly question about, you know, what are you thinking about that you think other people are going to have more top of mind, you know, a year from now or whatever. And he just went on this rant about self-improving products.

我记得我听到一半差点走神，心想：“你到底在说什么，兄弟？”但现在回想起来，他说得太准了。他完全说对了，因为我们在 Decimals 做的事情就是某种自我改进。我们只是需要这个中间步骤，比如“嘿，录一下自己”，但这很快就不需要了。

And I remember almost checking out halfway in the answer. I'm like, "What the hell are you talking about, dude?" And he was so spot on now in retrospect. Like he he freaking nailed it because what we're doing with decimals is kind of self-improving. We just need this one middleman of hey just record yourself but that's not gonna be a thing here soon.

是啊。我现在做的这个合同，就在今天和昨天，我在构建同样的东西：设计副总裁对整个组件库的 25 分钟头脑风暴。我们需要把它拆分成 Jira 工单，用公司统一的格式。它第一次运行就做得非常好。我现在在做一些调整，但这一层在这种情况下不太对，但对于其他事情，这一层是让智能体用技能观察我使用应用的方式，进行审计。我喜欢这个，非常扎实。

Yeah. Uh contract that I'm on now I'm literally just today and yesterday building out the same here's a 25 minute brain dump of changes to be made to a whole component library from the VP of design. Now we need to chop that up into tickets for Jira in the proper format that the company uses for everything. and it did a remarkable job on the first run. I'm like doing some tweaks now, but the layer that in this case isn't quite right, but but for other things, the layer of and also run an audit pass from an agent like using a skill just observing the way that I'm using the app. I love that. That's super solid.

我们正在重新思考进行中的入职流程，因为我们又一次在创建这个产品的全新版本。现在大概是 V5 了。

We're rethinking the in-flight onboarding because we're kind of yet again creating just a totally new version of this product. It's probably V5 at this point.

不过我对这个很兴奋。

I'm excited about this one though.

但我刚和 Fable 进行了一次头脑风暴，它在头脑风暴方面简直不可思议。Fable 太疯狂了，真的非常好。我一直在讲我认为的约束条件，然后它基本上打断了我，说：“不，不，你其实不必那样做，你应该这样做。”

But I was just having a brainstorming session with Fable, which is unbelievable for brainstorming. Like Fable's crazy. It really really is good. I was talking through what I thought were constraints and then it basically like kind of cut me off. It's like no no what do you you don't actually have to do it that way. Like you should do it this way instead.

整个 onboarding 应该围绕一个由机器人创建的 PR 来展开，你就在那里展示你的教育内容等等。我当时想，我做梦都想不到这一点，因为我根本不知道这还能这样。我觉得这说不通。我实际上告诉它，不，我们不需要那样做。我们可以用这种方式。我熟悉的那种方式说实话也不怎么样。然后它过了两轮又提出来了，它说，嘿，我知道你否定了这个想法，但说真的，我们来聊聊这怎么运作吧，因为我觉得这确实是个更好的办法。我甚至还没完全理解，就让 Fable 打印了一份可视化说明，解释这个功能在 onboarding 里怎么运作，就像流程图一样，简单的东西，技术考量、端点之类的。我让它打印在纸上。然后几个小时后我去开团队会议，我说，嘿，我一直在想这个 onboarding 流程，有个想法。然后我就把镜头拉近到 Fable 做的东西上。所有人都震惊了。他们说，这想法太不可思议了。你怎么想到的？干得好，你做得太棒了。而我心里想，我不知道，我不知道该怎么理解这件事，这有点超现实。

The entire onboarding should revolve around a bot-created PR, and that's where you surface your education and all this stuff. And I'm like, never in a million years would I have considered that because I didn't even know it was possible. It didn't make sense to me. I actually told it, no, we don't need to do that. We can do it this way. The way that I was familiar with honestly wasn't even that great. And then it brought it back up like two turns later, and it's like, hey, I know you dismissed this, but seriously, let's talk about how this would work because actually I think it is a better way to do this. And without even fully understanding it, I had Fable then print a visual explainer of how this feature would work in onboarding, just like a flowchart, simple stuff, technical considerations, endpoints, that kind of a thing. And I had it print it in paper. And then I went to the team meeting, which was like a few hours later, and I was like, hey, I've been thinking about this onboarding flow. Here's an idea. And I just, you know, shifted to zoomed in on the thing that Fable made. And everyone freaked out. They're like, this is an unbelievable idea. How did you... like, good job, you did great work. And in my head I'm like, I don't know, I don't know how to make sense of that, you know, that's kind of out there.

是啊，而且 Fable 实际上确保了你没有绕过它的好主意，然后你的团队就说，这太棒了。

Yeah, and Fable actually kind of made sure that you didn't bypass its good idea, and then your team was like, this is amazing.

百分之百。

100%.

这很有意思。它最后发现了什么，是你以为存在但实际上并不存在的限制？

That's interesting. What did it end up identifying that was like something you thought was a constraint that wasn't there?

我以为你必须通过 CLI 来安装 Inflight，而且流程就是这样。我想到的每一件事都是，嘿，要让 Inflight 成为你部署预览的反馈层，你只能通过 CLI 来操作。这很难，因为有些人想通过智能体而不是 CLI，而且你必须通过插件。这很难做到。但 Fable 说，你不必那样做。只要自动创建一个 PR 来安装 Inflight，让它进入任何需要的仓库，然后你就可以把那个 PR 本身当作 onboarding，因为它基本上就是一个向工程师描述产品的广告牌。

I thought that you had to install Inflight through the CLI, and that that was the flow. Every single thing I was thinking about was, hey, to get Inflight as the feedback layer for your deployment previews, you got to just go through the CLI. And it's just hard because some people want to go through the agent and not the CLI, and you have to go through the plugin. It's hard to do that. Well, Fable was like, you don't have to do that. Just automatically create a PR that installs Inflight, have it go to whatever repos are necessary, and then you can use that PR as onboarding itself because it's basically a billboard that describes the products to an engineer.

哦，那太好了。

Oh, that's so good.

我们聊了很多内容。在我放你走之前，我想我们能不能快速打三个乒乓球式的问题，都是关于这个工作流的，你知道，我们设计师的领域到底发生了什么。所以第一个问题是，上次我们聊天时你经常做的一件事，现在基本上从你的实践中消失了，那是什么？

We've covered a lot of ground. Before I let you go, I'm wondering if we can just do a ping-pong of three quick questions that are kind of in this workflow, you know, what the heck is happening to us designers space. So the first one is, what's something that you were doing a lot all the time the last time that we chatted that has basically disappeared from your practice today?

我的意思是，其中一件事是构建很多自定义工具。HTML 快捷方式解决了其中很大一部分。就像你说的，展示选项并批准，然后我讨论，那整个领域在你的情况下本来会是一个工具，曾经是一个工具，现在我们不用做了。我觉得是这样，然后非常非常具体。我觉得我现在不那么程序化了。我仍然大量使用复合工程工作流，但我也开始更频繁地使用 slashgoal，取决于具体是什么事。有时候它会运行太久，比如目标变得太大，然后就像，你知道，两个小时后，哇，好吧，我不想我们走那么远。但是，是的，对于其他很多事情，我减少了细粒度的流程操作，尽管我展示了在终端图里做变体的那种非常细粒度的版本。你呢，兄弟？

I mean, one of the things was building a lot of custom tooling. The HTML shortcut takes care of so much of that. Like you said, the show me the options and approve, and I discuss, like that whole area would have been a tool in your case, was a tool for a minute, that now we don't have to do. I think that, and then very, very specific. I think I'm less procedural now. I still use the compound engineering workflow a lot, but I'm starting to use slashgoal more often too, depending on what the thing is. There's been times where it's too long-running, like the goal becomes too big, and it gets kind of like, you know, 2 hours later it's like, whoa, okay, I didn't want us to go that far on it. But yeah, less granular flow manipulation for plenty of other things, despite me showing a very granular version of it with making variations in terminal graph. What about you, dude?

我真的不再用计划模式了。

I just don't use plan mode really anymore.

哦，是啊，这倒是个好例子。

Oh yeah, actually that's a good one.

我觉得对我来说，真正的分界线可能是 Sonnet 和 Opus 5。我从 Sonnet 5.6 开始就没用过计划模式了。

I think probably the hard line in the sand for me has been like Sonnet and Opus 5. I haven't used plan mode since Sonnet 5.6.

你喜欢 Opus 5 吗？

Do you like Opus 5?

我觉得还行。我的意思是，我还在慢慢感受。我觉得它有……我能感觉到它比 4.8 好多了。兄弟，我觉得 Sonnet 在解决技术问题方面可能比它们两个都好。比如有多少次，我让 Fable 或 Opus 陷入循环，就是修不好这个破东西，然后我把整个对话拿过来，或者说写一份上下文文档，然后发给 Sonnet，它一次就搞定了。这大概上个月发生了 15 次。

I think so. I mean, I'm still kind of feeling it out. I think it has a... I can tell that it's much better than 4.8. Dude, I think Sonnet is better than maybe both of them at like technical solve-this-problem. Like the amount of times that I've had either Fable or Opus stuck in a loop where I just can't get this stupid thing fixed, and then I take that whole chat or I say like write up a context doc, and then I send that over to Sonnet, and it oneshots it. That's probably happened 15 times in the last month.

是啊，我也转向那个了。Anthropic 的模型基本上就像我的创意部门。那是头脑风暴的地方。那是设计，你知道，创意的东西，然后代码执行之类的，我主要用 Sonnet 来做。

Yeah, I've transitioned to that too. Like the Anthropic models largely are like my creative department. It's the brainstorming place. It's the design, you know, creative stuff, and then code execution and stuff I'm really primarily doing with Sonnet.

说实话，这就是我很难离开 Conductor 的原因，就像 Codex 应用太好了。我知道，太棒了。是啊，每次我在那里，我都觉得，这真是太棒了。

It's honestly why I have a hard time leaving Conductor, kind of like the Codex app is so good. I know, it's amazing. Yeah, every time I'm in there, I'm like, this is just fantastic.

是的。同意。

Yep. Agreed.

好的，这里还有一个问题。我觉得我们很久以前聊过的一件有趣的事是你做的那个梦幻足球应用之类的东西，看到你怎么思考你的从零到一，先弄点东西到纸上那种工作，很有意思。你觉得这部分实践是怎么演变的？比如你现在从零到有会用什么策略？

All right, another question here. So, I think one of the more interesting things that we talked about way back when was you made the fantasy football app kind of thing, and it was interesting to see how you thought about your greenfield zero-to-one, let's just get something onto the paper kind of work. How have you seen that part of your practice evolve? Like what are some of the strategies for going from zero to something that you're reaching for today?

是啊，这是个好问题。我是一个肯定会在空白页面前挣扎的设计师。我想在脑子里先有个大概的形状，而且我不想花太多时间在上面，因为我也觉得，我想让它先能用，开发出来，然后在功能调好之后再做更多视觉语言的微调，这不算什么革命性的过程。但我觉得以前，我们更接近在 Figma 里做 70-80% 的高保真，然后试着把那些 Figma 截图丢进智能体，你知道，丢进 v0 从那里开始构建。而我现在做更多廉价的构思和整体形状，不在画布上花太多时间。我可能会做一点调整，比如我会用 HTML 构思一下。然后我会说，好吧，把它扔进 Paper，这样我就可以微调、移动、偶然，向 MDS 致敬，移动和微调东西到合适的位置，比如，好，这更接近感觉对的样子。然后让它完全构建出来。所以我觉得构思过程现在不一样了，更多的是用 HTML 探索来获得整体形状，然后再构建。而且我们之前一起做的那第一集，天哪，其实没多久，那是去年 11 月。

Yeah, it's a great question. I'm a designer that definitely struggles with the blank page. I want to get more of a shape in my head before, and I don't want to spend a ton of time on it because I'm also like, I want it to be fine, develop it, and then do more of the visual language fine-tuning tweaking after I get a lot of the functionality dialed in, which is not a revolutionary process. But I think before, we were doing a lot closer to 70-80% high fidelity in Figma or something, and then trying to drop those screenshots from Figma into the agent to, you know, into v0 to build from there. And I'm doing more cheap ideation and the general shape without spending a bunch of time in the canvas. I might do a little bit of tweaking, like I'll ideate a bit with HTML. Then I'll be like, okay, throw that into Paper so that I can nudge and shift and accidental, shout out to MDS, shift and nudge things into the place like, okay, this is more like what feels right. And then have that fully built out. So I think the ideation process is different now, and more HTML exploration to get a general shape before I build. And there was definitely like that first episode that we did together, which is god, not even that long ago, that was like November last year.

是啊，还不到一年。

Yeah, not even a year.

就像构思发生在 v0 里，而且是基于一个完整的 React 网页应用，现在想想真是可笑。那太没效率了。

Like the ideation happened like in v0 on top of like a full React web app, which is like now just like laughable. It's like that's so inefficient.

就像我会从那里开始，然后说：“现在我想调整这个，试试这个，再试试那个。”整个过程就是：“好，做那个。好，让我看看。好，调整这个。好，做那个。让我看看。”这比以前更像“提示，等待，提示，等待，提示，等待”，而且现在用 HTML 的东西低成本地铺开，然后再进入“现在让我们做真正的应用”，因为我们其实已经对应用的样子有了一个草图，这样好太多了。

It's like I would start there and then be like, "Now I want to tweak this and try this and try this." And all of it was like, "Okay, do that. Okay, let me see. Okay, tweak this. Okay, do that. Let me see." And it was just so much more like prompt, wait, prompt, wait, prompt, wait, and going wide now cheaply with HTML stuff and then getting into now let's make the real app because we actually kind of have a sketch of what the app will look like is so much better.

我觉得这也是我的答案。你说的一切我都加一。另外我要补充的是，以前我构建东西的时候，我有点回避那种又长又大的提示词，对吧？我现在不再写那种又长又大的提示词了。

I think that's my answer, too. And everything that you said I'll plus one. The other thing that I'll add on top of it too is when I was building things previously I was kind of staying away from the big long prompt, right? I don't write big long prompts anymore.

但我现在做的是大规模的构建，而以前我不会这样做。比如我会在 HTML 和 Paper 里待的时间比三四个月前长得多。三四个月前，我会说：“让我们先弄出个东西，你知道，把黏土放到 DOM 上，然后我们就在上面捏啊塑啊。”但实际上，不，那样慢得多。就像，操作真实的东西比稍微调整一下要慢得多。不是视觉上的，我不太在乎视觉。只要给我 UX 和流程，我想在 HTML 和 Paper 里快速实现事情，然后我可能会用 Paper，就像我之前展示 supercut 那样，然后我会想，实际上我怎么能达到那种地步，我只需要说“构建这个”，它就能自动完成。

But I am doing massive builds and I wasn't doing that previously. Like I will hang out in HTML and Paperland way longer than I was even three or four months ago. Like three or four months ago, I'd be like, "Let's just get something, you know, let's get the clay onto the DOM and we'll just kind of mold it and shape it." It's like, actually, no, that's much slower. Like, it's just much slower to manipulate the real thing than it is to kind of dial it in a little bit. Not visually. I don't really care about visually. Just give me the UX and the flows and I want to make things happen really quickly in HTML and paper and then I'll probably take paper and like I was showing with the supercut and I'll just be like effectively how can I get to the point where all I have to say is build this and it'll just do it.

而几个月前我完全不是这样做的。这其实是那些超级智能体式的工程师们常说的镜像，他们说：“我把 70% 的时间花在规划上，在触发任何事情之前，在我的智能体开始构建之前，我花最多的时间在规划上，那才是投资所在。”我们基本上是在描述设计版的那个，这有点像视觉规划，但有趣的是，我们已经从“把黏土拿来，让东西为我存在”转变为“在陶轮上塑形和做不同的事情”，那是我们以前的方式。而现在我们更像是，“让我先看一堆渲染图，看看一旦我把黏土放到陶轮上，陶艺作品大概会是什么样子。”

And I wasn't doing that a few months ago at all. It's really the mirror of you hear it from the engineers all the time that are super agentic like they're like I spend 70% of my time on planning and before anything is triggered and before any of my agents are building something I spend the most amount of time planning and that's where the investment is and we're basically describing the design version of that which is like visual planning in a way but it's interesting how we've been we've kind of shifted that from like make the clay make the thing exist for me to like mold and do different things on the potter's wheel was how we were doing it. And now we're like, let me just see a bunch of renderings of probably what the ceramic art will look like once I put the clay on the potter's wheel.

钟摆又摆回到了我们以前的位置。

The pendulum swung back to where we were before.

最后一个问题，我会让它保持开放性，但我想更广泛地指向你的角色，你如何看待你职业生涯的未来，你在这个行业中的位置，作为这个设计师、构建者，我是谁之类的问题？所以，自从我们上次谈话以来，你脑子里有哪些事情在翻腾，当你展望未来时，比如未来几年对我来说会是什么样子？

Last question, and I'll kind of keep it open-ended, but I'd like to point generally more at your role, how you're thinking about the future of your career, your place in this industry as this designer, builder, who am I kind of thing? So, since the last time we talked, just what are some of the things that are rattling around in your brain and when you look forward in terms of like what's the next couple years look like for me?

是的，这也是个很好的问题。我的意思是，我之前跟你提过一件事，就是有一段时间，在 AI 领域早入场本身就是一种优势，但这种情况已经越来越不成立了。就像很多人已经赶上了，而且这并不需要太多。现在的工具好太多了。比如从“我并没有真正把 AI 用于设计”到“哦，我现在一直在用它”的坡度，现在你需要学的东西比我刚开始做这个的时候少多了。所以，这让我更多地思考，是啊，我的形状是什么，我的钉子适合什么样的孔？而且现在，我在 Output 做全职合同工作，那是一家音乐软件公司，正在做他们的一个新产品，非常非常有趣。我对此非常兴奋，但不能谈论。我还和 Nick Patterson 以及 Primary Studio 的伙伴们在做另一件事，我也不能谈，但它真的很酷。但我通过这些发现的是，我最近真的很享受过程中的工程实现部分。我不想完全只待在一个领域。我不想只待在代码里，从不做设计，不做 UX 决策，不做那些微小的调整等等，但我也不想和真实的东西分离。如果我主要是设计某样东西，那么对我来说，拥有前端是完全合理的。当然，如果是我在设计它，我为什么不拥有它呢？那太疯狂了。我想演奏我写的歌，你知道吗？比如，我没有兴趣做一个为 Lady Gaga 写歌的词曲作者，然后只是把一首我唱的 demo 递给她，最后它变得面目全非。我想演奏我写的那首歌。所以，是的，我觉得我最近真的越来越适应“设计工程师”这个称呼了。我还没有在任何地方公开这样称呼自己，我一直说：“不，我是设计师和构建者。”但我最近做的一些工作，在某些情况下坐在这些部门之间，我感觉更舒服了，因为我和工程团队开会，也和设计团队开会，我做的事情两者兼有。天哪，我喜欢跨越这条线。我以前想到的设计工程师版本，我想的是 Jay Tommpkins、Emil 和 Yakob 这些人，他们身上有某种非常高的视觉工艺元素，我总觉得那才是设计工程师，而且我仍然认为在很多地方确实如此，但它的定义几乎变成了“设计加工程师”，而不是“设计工程师”，如果你明白我的意思。这真的很语义化，但双脚牢牢地站在两个地方感觉很好。我喜欢在复杂的领域做这件事，那里有技术上的东西在引擎盖下。有很多要处理的，有很多时候要站在一万英尺高空俯瞰，也要贴近每一粒沙子，我真的很享受，而且发现自己在那些环境中成长最多。

Yeah, it's a great question, too. I mean, one thing that I've mentioned to you before is like there was a period of time that being early to the AI game was an attribute to itself that is becoming less and less true already. Like so many people have caught up and it doesn't take all that. The tooling's so much better now. Like the ramp of I haven't really used AI much for design and making that to like oh now I use it all the time. There's so much less that you have to learn now than like when I started doing this. So, that has made me think more like, yeah, what is my shape and what holes do my peg fit in? And like right now, I'm working on a full-time contract with Output, which is a music software company, and working on a new product that they have that is really, really interesting. I'm really excited about and cannot talk about. And I'm also working with Nick Patterson and the folks at Primary Studio on another thing I can't talk about, but it's really cool. But what I've discovered through those is I'm really enjoying the engineer implementation part of the process lately. I don't fully want to live in one or the other. I don't only want to be in code and never design and make, you know, UX decisions and do all those tiny adjustments and stuff, but I don't want to be separated from like the real thing. If I am primarily designing something, like it makes all the sense in the world to me to own the front end. Of course, if I'm the one designing it, why wouldn't I own that? That it's insane. I want to play the songs that I write, you know? Like, I wouldn't I have no interest in being a songwriter that writes for Lady Gaga and just like hands her a demo of me doing the song and then it becomes something virtually unrecognizable by the end of it. I want to play that song that I wrote. And so, yeah, I think I'm actually becoming very, very recently a little bit more comfortable with the term design engineer. I still have not called myself this publicly anywhere and have said like, "No, I'm a designer and a builder." But some of the work I've been doing lately and sitting between those departments and stuff in certain cases, I'm feeling more comfortable cuz I have meetings with the engineering team and I have meetings with the design team and I'm doing things that are both. And man, I like straddling that line. The version of design engineer that I thought of before. I was thinking of Jay Tommpkins and Emil and Yakob and all these guys that like there was some element of really high visual craft that I think I always associated with design engineer and that I still think is true in a lot of places but the definition of it's almost like design plus engineer as opposed to design engineer if that makes sense. It's like it's really really semantic, but having feet firmly planted in both places feels good. And I like doing it in areas of complexity where technical stuff under the hood. There's a lot to deal with and there's a lot of being 10,000 ft above the thing and being right up close to the single grain of sand that I'm really enjoying and finding myself growing the most in those environments.

嗯，我发现自己通过和你交谈和学习而成长。所以，感谢你的到来。这已经成为一种常态了。呃，你知道，事情变化太快了，我真的很喜欢这种形式。我真的很喜欢向你学习。所以，感谢你今天抽出时间来。

Well, I find myself growing by talking and learning from you. So, I appreciate you coming on. This is just becoming a staple. Uh, you know, things are changing so quick that I really like this format. I really like learning from you. So, I appreciate you coming on and making the time today.