我刚刚在这个网站上放了一个房间。那是一座并不存在的房子里的书房，房子建在俯瞰大海的山坡上，你可以在里面走动、坐下，还能拿起东西。房子是想象的，但你能拿起的每样东西都是真的：我的书、我上过的课程、我做过的产品、我去过的公园，以及同事在 LinkedIn 上给我写的推荐。
做到这一步花了四次尝试，前三次都失败了。我觉得它们是怎么失败的，比这个房间本身更有用，所以这篇文章讲的就是这个。
为什么偏偏是 three.js
一切始于 X（Twitter）。我在上面不断看到惊艳的 3D 作品，是别人用 three.js 做出来、可以直接在浏览器里运行的东西，我也想自己试试。说到底，这就是全部原因。第一次尝试写下目标时，写的只是：重点是用 three.js 做点东西。我就是好奇。
第一次尝试：同一个创意的十种样子
9 月下旬，我以自己的博客存档作为主题开始：523 篇文章，按时间和主题排布在空间里。我们用真正的渲染做了六个概念：柱子组成的景观、双色油墨的 risograph 印刷、星图、纸张风暴、地形浮雕，还有一个小小的书桌场景模型。另外四个想法（一本书、一棵树、一间印刷室、水中的墨）只做到了粗略的草图。下面是十个里的九个，柱子景观从来没有保存下来。
这十个我全否了。写下原因时，结论很简单：每一次都是同一个创意，用同样那些文章做成的点，只是换了一种渲染方式。把技术换十次，也解决不了作品没有真正主题这个事实。我们还把同样的数据画成了普通的 2D 图表，作为 3D 版本必须跨过的标杆。如果你正被为 3D 而 3D 的念头吸引，我很推荐这个测试。
第二次和第三次尝试：有了真正的主题，却打错了仗
10 月初，我换了真正的主题再试一次：Ask Sydney 如何找到答案背后的来源，以及我的一个产品内部是怎么运作的。最初的版本很简单，其实是做给像我这样已经关心流水线怎么运转的人看的。
于是我们对两个作品都做了一轮正式的美术指导：用 Blender 制作的模型、有灯光的环境、泛光、景深、雾和柔和的阴影。这些作品经过测试，符合无障碍要求，也已经可以翻译。不过我还是觉得不够好，因为我拿它们去比较的，是开始之前用图像模型生成的概念图，和那些图放在一起，它们每次都输。
下面把每个作品分成三个阶段来看：最初版本、美术指导后的版本，以及我拿来对比的概念图。先看 Ask Sydney 如何找到来源：
再看 DIALØGUE 如何制作一集节目：
我们写下的教训是：实时 three.js 比不过照片级的离线渲染。一张静图可以花几分钟渲染一帧，把光照、景深和每一处纹理都调到恰到好处。浏览器每一帧只有几毫秒。所以下一次尝试的规则变成了：实时 3D 绝不拿真实感去竞争。它的赢面，在于对眼前的人做出回应；如果一段视频就能代替这件作品，那这件作品就是错的。
第四次尝试，依然有很多否决
前三次尝试用了不同的模型和工具，包括 DeepSeek 和 OpenAI 的 GPT。它们都没有达到我的质量标准。第四次尝试在 11 月初，用的是 Claude Code 里的 Claude Opus 5.5。
我真想说一次就成功了，但并没有。在做出这个房间之前，我否掉了一批方案：一组盛水的玻璃杯，用来展示媒体预算该怎么分配（太偏战术）；一件墨水作品；一片可以飞越的剪纸景观（太平淡）；四张其他世界的草图；一座可以走进去的职业生涯博物馆；还有一间摆着六张书桌的工作室，每张对应一个营销领域。我给这间工作室的评语是，它“离我要的惊艳感还很远”，还有“那六张书桌糟透了”。确实如此。
最后奏效的创意来自我，而不是模型。如果访客是我梦想中的家的客人，我带他们看我的书房，会怎么样？我按自己想象的样子描述了这个房间：背靠窗户的书桌、书架、一张长沙发、一张可以围坐喝咖啡聊天的桌子、一座壁炉，窗外是树和海浪，像 Big Sur 那样。看到第一个能运行的版本时，我说了一句“对，就是这个方向”。
接下来是细节。我否掉了鼓鼓囊囊的沙发、一张没有个性的桌子、一扇难看的门、一盏落地灯，还有看起来不像 Big Sur 的树。我提出的要求是“世界一流、低调奢华的书房”。更早的时候，我曾试着用两样东西来描述那种感觉：一个好酒店的大堂，那里的气味和花香让人觉得安心，被好好照顾；还有一碗拉面，它“看起来简单，但要做对非常难”。直到现在，这仍然是我能给出的最好的描述。
左边是房间的早期版本，右边是今天的房间。
它是怎么做出来的
Blender 用它的 Cycles 渲染器搭建房间，并把光照烘焙进去，这样浏览器就不用去计算阳光怎样洒过地板。然后 three.js 实时绘制房间，并处理所有对你有反应的部分：走动、坐下、拿起东西、停留到傍晚。
这里有一条诚实原则。房子是想象的，并且明说了这一点，但客人拿起的每样东西都是真的，都有出处。每件物品上的文字都很短，因为我给这个房间定的规则，是用 3D 来呈现，配一行简短的话，不放大段文字。
这个房间支持 13 种语言，还有一个文字版本，供屏幕阅读器使用，也供浏览器无法绘制它的人使用。
最初的十秒
上线前，我们在开发构建上测试了这个房间，它比正式网站慢。找来三位代替真实访客的测试者，每人被分配了不同的角色、设备和网速，也没有人向他们解释这个页面。他们是 AI agent，不是真人，所以我把这当作冒烟测试，而不是研究。即便如此，结果也很清楚。最快的一位看到一个黑屏，上面写着“欢迎，请慢慢来。”，持续了大约 8 秒。另外两位整整十秒都是黑屏。其中两位说他们会自己离开。“慢慢来”读起来像“等着”，而且没有任何东西说明这个页面是什么。
所以现在从第一秒起就会显示一张房间的静态图片，下面是我的名字和一行字，公园的照片则要等房间准备好之后才加载。我还没有真实访客的数据。
上线之后我继续优化，因为模拟的慢速手机仍然需要大约 8 秒才能进入可用状态。现在浏览器会随页面一起开始下载房间，而不是等代码加载完之后；海景先以一半大小出现，过一会儿再变清晰；3D 模型本身从 2.8 MB 缩小到 0.81 MB，我看不出有任何差别。在模拟的慢速手机上，房间现在大约 4.5 秒就能进入可用状态。在我自己的手机上很流畅。
我学到了什么
品味比以往任何时候都重要。 你需要有品味，还要有词汇，才能让机器做出你心中所想。从头到尾，创意和否决都是我的，AI 模型负责搭建。一件作品最后能不能变好，取决于我能不能说出哪里不对（鼓鼓囊囊、没个性、太平淡、不像 Big Sur），以及我想要什么。当我说不出来时，得到的就是一个做工非常精良的错误版本。
产品是达到目的的手段，不是目的本身。 你需要明白为什么要做它、它为谁服务，以及你想让人带走怎样的结论或印象。最初几次尝试是从技术出发的。这个房间则是从一位从未见过我的访客出发：他们拿起什么，离开时在想什么。这一点清楚之后，很多决定就自然而然有了答案。
模型重要吗？我认为重要。这是第一个让房间通过我标准的模型。不过，我回头读四次尝试的笔记时发现，主题和目的的变化与模型的变化一样大，我真的没办法把两者分开。
房间在 chandlernguyen.com/study。手机上也能用，我在自己的手机上试过。如果你也用 AI 做过 3D 作品，或者试过之后放弃了，是什么拦住了你？我很想知道，是工具的问题，还是创意的问题。