夜雨聆风
01 你在用 AI 生成图片，但下一波不是这个
:::Yoko (@stuffyokodraws) 是 a16z 的合伙人，六月初在 X 上发了一篇长文，94.5K 次浏览。核心观点是：视觉 AI 的下一个前沿，不是生成更好的像素，而是生成代码。
我读完的第一反应是：这其实不是预测，是正在发生的事。我们已经在用 AI 写 SVG、写 CSS 动画、写 React 组件——这些工具生成的不是图片，是可编辑的程序。只是大家还没把这件事和"视觉 AI"放到同一个框架下讨论。
Yoko 这篇文章做的事，就是把这个框架明确说出来。她的定义是：任何以代码为中间格式来生成视觉内容的 AI 系统，都属于代码原生视觉 AI。
范围比你想的要大。不只是图标生成、动画工具，还包括：从文字生成网页布局的工具（生成 HTML/CSS），从草图生成 UI 组件的工具（生成 React），从描述生成 3D 场景的工具（生成 Blender 脚本或 USD 文件），甚至是从需求描述生成数据可视化图表的工具（生成 D3.js 代码）。
这样一看，这个市场比"AI 图片生成"大得多。而且商业化路径更清晰——企业付费买的是可以集成进产品的设计代码，不是一张好看的图。
还有一个角度：像素原生 AI 的产品已经非常同质化了，Midjourney、Stable Diffusion、DALL·E 做的事情差不多，竞争门槛越来越低。代码原生还在早期，差异化空间更大，先进入的公司有更长的窗口建立壁垒。
02 像素原生 vs 代码原生
:::她把视觉 AI 分成两个范式。
像素原生（pixel-native）：输入文本或图片，输出光栅图像（JPEG、PNG）。这是现在大多数人在用的模式——Midjourney、DALL·E、Stable Diffusion 都在这里。结果是一张图，漂亮，但不可编辑，不可缩放，无法程序化操控。
代码原生（code-native）：输入文本或图片，输出代码——SVG、HTML/CSS、React、Lottie、Blender、USD。结果是一段程序，渲染出视觉效果。可编辑，可版本控制，可参数化，可在不同尺寸下无损缩放。
这个区别乍一看只是格式问题，但背后的含义很不一样。像素图是"终态输出"，代码是"可演化的基础设施"。你可以改代码里的颜色、大小、动画曲线，还可以把它接进你的设计系统、响应用户交互。
换个角度：你用 AI 生成了一张 logo 图，它是 JPEG——想改字体颜色，你得重新生成。如果 AI 生成的是 SVG 代码，你改一行 CSS 就搞定了。代码原生的可控性和可维护性，是像素原生做不到的。
03 那个循环：Code → Render → Inspect → Revise
:::Yoko 描述了代码原生视觉 AI 的工作循环，这个循环是她这篇文章里我觉得最有价值的部分。
整个循环是这样的：AI 生成代码，渲染成视觉效果，用户检查（或者另一个 AI 检查），给出修改意见，AI 修改代码，再渲染，再检查……直到满意为止。
这个循环的关键是"渲染器"的存在。有一个确定性的程序把代码变成像素，你可以精确地说"这里的圆角应该是 8px 不是 4px"，AI 能直接改代码，渲染结果立刻变。这种精确反馈在像素原生里基本做不到——你能说"这张图的左边稍微暗一点"，但很难保证下一次生成还符合你的其他要求。
还有一个重要的优势：test-time compute。模型在生成代码之后可以自己渲染、自己检查渲染结果，不满意就改，形成内部的迭代循环，在把结果给你之前就把质量提上去了。这在像素生成里很难做到，你不能让 Midjourney"自己对比一下这张图和目标的差距然后重新生成"——它的生成过程是一次性的扩散，没有内部迭代。
用一个粗暴的类比：像素生成是一锤子买卖，代码生成是持续可以改的合同。前者快、直觉，后者慢但精确，修改成本极低。
对于大多数消费级用户，一锤子买卖就够了——生成一张头像，够用就好。但对于专业用户（设计师、工程师、内容团队），需要的是能改的、能集成的、能维护的——代码原生才是真正的生产力工具。
04 技术栈：表示语言 + 渲染器
:::Yoko 把这个技术栈拆成两层：符号表示（symbolic representation）和渲染器（renderer）。
符号层是你选择用什么语言来描述视觉：SVG 适合图标和插图，HTML/CSS 适合 UI 组件，React 适合交互界面，Lottie JSON 适合动画，Blender Python 适合 3D 模型，USD（Pixar 的通用场景描述格式）适合复杂 3D 场景。每种语言都有自己的表达能力边界和对应的用户群。
渲染层是把这些代码变成像素的引擎：浏览器、Lottie 播放器、Blender 渲染器、游戏引擎……渲染器是确定性的——同样的代码，永远渲染出同样的结果。这是代码原生的核心优势：可预测、可验证、可测试。
AI 的工作是生成符号层的代码。它不需要知道渲染的细节，只需要知道这门描述语言的语法和语义。对于已经大量出现在训练数据里的语言（SVG、HTML/CSS、React），现有的代码模型已经做得相当好了。对于 USD、Blender Python 这类小众语言，还有提升空间，但只要训练数据到位，原理上没有障碍。
我自己确实用 Claude 生成 SVG 和 React 组件，成功率挺高的，复杂图形需要几轮迭代。和 Yoko 的描述完全吻合——这个循环已经在跑了，只是没有专门的工具把它做得丝滑。
有意思的是，Yoko 没提 HTML Canvas 或 WebGL/Three.js——这些也是视觉表示语言，但生成质量目前比 SVG/CSS 差很多。可能是因为这类语言的训练数据相对少，也可能是因为结构太灵活、输出空间太大，对模型来说更难。这个角落的进展值得关注。
05 3D 是下一个前沿，也是最难的
:::文章里我觉得最有意思的一个观点是关于 3D 的。Yoko 说，3D 资产生成是代码原生视觉 AI 的下一个大机会，但也是最难的。
难在哪里？3D 资产有功能性约束（functional constraints）——门要能开，铰链要能转，椅子腿要承重，齿轮要能咬合。这些约束是逻辑的、物理的，不是美学的。
像素原生 AI 生成的 3D 图，门看起来是门，但门轴可能装反了，门框缺少旋转支点，你根本没法导入到游戏引擎或 CAD 软件里用。因为它生成的是"长得像 3D"的像素，不是真正可用的 3D 数据。
代码原生在这里有先天优势：生成的是 Blender 脚本或 USD 格式，这些语言天然就能表达"这个铰链连接这两个面，旋转轴是 Z 轴，旋转范围是 0° 到 90°"这种约束。AI 生成的代码是可以被验证的——你可以程序化地检查门轴有没有旋转约束，椅子腿有没有接地。
她提到了几个在这个方向上做事的公司：VIGA（3D 资产生成）、Articraft3D（建筑和产品级 3D）、OmniLottie（Lottie 动画生成）。这些名字现在可能还不大，但她认为这是未来两三年里会爆发的方向。
我觉得这个判断有道理。游戏、电影、建筑、产品设计——这些行业每年的 3D 资产制作成本是天文数字。如果代码原生 AI 能生成可用的、有功能约束的 3D 资产，省下来的不是时间，是整条生产线的改造。
但我不完全确定"功能约束"是当前的核心瓶颈。我见过一些工程师反映，目前更大的问题是生成的 3D 代码在几何上不一致——多边形相交、法线方向错误、UV 展开混乱。这些是低层次的格式问题，和"门轴逻辑"是两个不同的维度。两个问题都要解决，但现阶段前者可能更基础。
06 市场地图：围绕渲染器聚集
:::
Yoko 在文章末尾放了一张市场地图，这张图的组织方式本身就很有信息量——不是按功能分类（做图标的、做动画的、做 3D 的），而是按渲染器分层。
因为渲染器决定了你能做什么：浏览器层是 UI 组件和网页视觉，Lottie 层是轻量动画，游戏引擎层是可交互的 3D，渲染农场层是影视级的离线渲染……每一层有自己的工作流、自己的用户群、自己的商业模式。
我不完全认同这个分类框架——它偏技术，忽略了用户场景。一个产品经理想要的是"帮我做一张产品演示动图"，他不会想"我需要的是 Lottie 层的工具"。围绕渲染器分层对开发者和投资人友好，对最终用户不一定友好。最终会赢的产品，可能会把渲染器选择做成透明的——用户只管说"我要什么效果"，工具自动判断该用哪个渲染器。
但作为投资框架，这个分层很有用：它帮你识别每一层里的机会，避免把不同渲染器层的公司做同类对比。浏览器层的公司和游戏引擎层的公司，受众完全不同，商业模式也完全不同，不应该拿来横向比较。
市场地图里有一个明显的空缺：没有太多公司在做"跨渲染器"的工具——能同时输出 SVG、Lottie、React 组件，用户不用管底层格式。这可能是机会，也可能是因为难度很大（每种渲染器的语言特性差异太大，通用抽象层很难做好）。
07 对我们意味着什么
:::我觉得 Yoko 这篇文章说的东西，和最近 Claude Code 的动态工作流、Figma AI、Vercel v0 的方向，都在指向同一个地方：AI 的价值在于生成可编辑的中间物，而不是生成终态产物。可检查、可修改、可迭代，是专业级 AI 工具的核心要素。
终态产物（一张图、一段视频）你只能接受或拒绝，没有修改空间。可编辑的中间物（SVG、React 组件、工作流脚本）你可以审查、修改、迭代，能接进你自己的工程系统。这对专业用户来说价值大很多。
设计师群体里有一个长期争议：AI 会抢走设计师的工作吗？我觉得代码原生视觉 AI 给了一个更有意思的答案：不是抢工作，是改变工作的形式——设计师从"用 Photoshop 画像素"变成"review AI 生成的 SVG 代码，改参数"。工作还在，只是工具换了。专业知识从"怎么画"迁移到"怎么审查和修改代码"。
但这个迁移不是所有设计师都能顺利完成的。有些设计师的核心竞争力就是"手感"和"审美直觉"，在代码原生工作流里，这些能力的权重可能会下降，取而代之的是理解代码结构、能用语言精确描述需求的能力。
这对设计教育来说是个不小的冲击。但也许这只是我从工程师视角看问题的局限——设计师对"代码"的态度可能比我预想的要开放很多。
总之方向是清楚的：视觉输出的下一个主战场，是代码编辑器，不是 Photoshop。
如果你在这个行业里——做设计工具的，做 AI 产品的，或者只是经常要生产视觉内容——Yoko 这篇文章值得完整读一遍。不长，但框架很清晰。
◇ ◆ ◇
相关链接
• 原推：https://x.com/stuffyokodraws/status/2061824755813306779
