温馨的蜜蜂养殖游戏，Unity 6 + UI Toolkit。每个你看到的屏幕都由 Claude Code 写成 — UXML，USS，控制器，甚至纹理生成器。

实际上使它工作的是：设计生活在 HTML mockup 中，并且该 mockup 是真实的来源。不是截图 — 截图是谎言。

循环看起来像这样：

  1. 在 HTML mockup 中设计/调整屏幕
  2. 脚本驱动无头 Chrome 在 1920×1080 上运行，并将计算值写入 — 每个 clamp()、vw 和 % 都已经解决
  3. Claude 将这些精确的数字移植到 UXML/USS
  4. Unity 截图，diff 对比 mockup，重复直到像素对齐

规则第一条：数字被测量，而不是推断。 我们在早期就损失了几周，因为每个人都将 mockup 的宽度乘以 1.68，从 "mockup 宽度 1140，Unity 宽度 1920，所以放大它"。错误 — mockup 到达绝对天花板，clamp(38px, 6.6vw, 82px) 在 1920 上只是 82。按钮最终变成了 500×74 而不是 300×42，没人能解释为什么。

沿途的有趣细节：

  • UI Toolkit 没有 box-shadow、没有渐变、没有 u/keyframes、没有 gap、没有 ::before。每一个都被 bake 成 9 个切片的 PNG 或重写为 C#
  • border-radius: 999px 在一个宽元素上会给你一个 椭圆，而不是一个圆角 — Unity 根据轴向裁剪
  • tooltip 的下唇是一个 0 4px 0 阴影，所以它会 位于 测量的框外。我的是位于框内，吃掉了 4px 的面板。通过像素切片来捕捉它，而不是我的眼睛
  • Claude 驱动 Unity Editor 的 CLI — 进入播放模式，打开屏幕，拍摄截图，diff 对比，修复 USS，重复

验证是整个游戏。"看起来大致正确" 是如何烧掉一个下午的方法。

如果有兴趣，我很乐意分享测量/ diff 脚本。