我之前对比过三个海外模型的设计能力，当时 Gemini 3.1 Pro 的表现最好：提示词很短，它也能补出完整的视觉方向，不需要我先把布局、材质和动画逐项规定清楚。
最近我在做一个社媒运营 Agent 的官网，又用相同的提示词测试了 Codex、Gemini 3.1 Pro 和刚推出的 Gemini 3.5 Flash。结果和上一次接近。Gemini 3.1 Pro 在短提示词下更容易做出克制、完整的设计，Codex 更适合已有参考之后的代码实现，Gemini 3.5 Flash 则容易补入过多内容。
相同提示词下，Codex 和 Gemini 3.5 Flash 的表现
在信息很少的同一条提示词下，Codex 先生成了下面这个首页。
这次 Codex 生成的页面使用了很大的字重，标题行高不足，右边的 SVG 也没有形成有效的视觉重点。它还把提示词里的设计要求直接写进了页面文案。比如要求蓝色页面时，标题会出现「好看的蓝色页面」。这些结果说明，只给方向、不提供参考稿时，Codex 很难替我完成设计探索。
不过 Codex 的代码能力是强的。如果给它一个参考 HTML，让它用代码和组件复刻出来，它可以做到。所以 Codex 不适合做设计，但适合做实现。
Gemini 3.5 Flash 使用了相同的提示词。
整体风格比 Codex 轻一些，但页面里堆入了很多元素。我只要求它完成首页，它却补了大量文案，几乎把提示词里的信息都铺到了页面上。它能完成视觉稿，但在这次任务里没有控制好信息密度。
Gemini 3.1 Pro 做的三版首页
同样的提示词，Gemini 3.1 Pro 做了三版，每一版都不一样。
第一版已经接近我想要的方向，页面克制，信息密度也比较舒服。
第二版的页面上有一层淡淡的噪点纹理，动画效果也很克制。
三个页面各有自己的风格，整体都偏冷淡、克制，也保留了一些人文感。短提示词没有把设计锁死，它仍然能连续给出不同但完整的方案。
相同提示词再跑一遍，测试稳定性
除了这三版，我还想测试它的可靠性：能不能稳定地做出类似水平的设计。我用相同的提示词又生成了三个页面。
这三个页面整体风格和前面相似，但各有自己的感觉：圆角和元素的搭配不同，有的页面上有一种类似纸质、类似牛皮的质感。跟着鼠标动的视差动画也不一样：一个绕中心轴旋转，一个不同层级有偏轴，还有一个背景元素和鼠标方向相反。
Gemini 3.1 Pro 的设计特点
从这些页面里，可以观察到几个反复出现的特点。
- 创意表现更强。即使不让它编写 HTML，只让它构思页面意象，结果也比 Codex 和 Gemini 3.5 Flash 更接近我的要求。
- 做出来的 HTML 更克制。材质、光影、噪点都有自己的一套处理，动画速度缓慢，页面清爽，配色舒服。
- 字重选择合适。同一个页面我让 Codex 复刻过，它连复刻都会把字重写得很大，整体对比度很高，没有一眼惊艳的感觉。
- 会主动补设计细节。提示词里没有提到的装饰元素，它会自己加上。比如页面背景里那种像细胞的效果，不是用 3D 库做的，而是自己画 SVG 元素，再搭配跟随鼠标轨迹的动画。
Gemini 也有自己的问题：它比较发散，写出来的文案偏诗意、偏空灵。GPT 是另一个极端，我们写什么，它就把什么直接丢到页面上，包括文案的元数据。这是它们之间差别比较大的地方。
提示词写长之后，差距会缩小
我也测试了另一个方向：把提示词写得很长，三个模型做出来的页面差别还大不大。
提示词写得足够详细之后，三个模型的页面差别就没有那么大了。但 Gemini 仍然有优势：它页面上的一些动画是我自己都想不到要做的，它对动画的理解比其他模型好。
我还给 Gemini 3.1 Pro 类似的提示词，让它把首页后面的模块也补完整，比如功能、定价和页脚。
补出来的模块和首页的设计风格统一，克制、清爽。
把 Gemini 接进设计工作流
我之前的视频介绍过用 GPT 生成 UI 设计稿再复现的流程，还写过一个让 GPT 自己生成设计稿的 Skill。但现在有一个问题：用生图工具就要写提示词，而 Codex 写的提示词没有 Gemini 写得有创意。
更合理的做法是用 Gemini 来写生图提示词，再让 GPT Image 2 生成图片。如果大家在 Codex 里用，可以装我写的 Gemini Designer 这个 Skill。
也可以在自己能调用 Gemini 的平台上集成 Gemini 3.1 Pro，比如 OpenRouter 或者其他第三方 API 提供商，然后让 Codex 去问它页面的意象怎么设计，把它的意象作为提示词去生成图片，最后让 Codex 把生成的图片复现成代码。
换一个场景继续验证
为了继续验证前面的差别，我又让三个模型制作一个类似药箱的慢病照护应用。下面是 Gemini 3.1 Pro 的结果。
这个页面的配色和信息密度仍然比较舒服。
Gemini 3.5 Flash 在提示词比较长的时候也做得不错，但它喜欢补充各种细节，页面内容明显更多，文案也更多。
Codex 做出的页面结构完整，但标题字重依然很大，行高又把文字叠在了一起，和前一个场景暴露的问题一致。
两轮测试之后，我没有把其中任何一个模型当成完整的设计与开发方案。Gemini 3.1 Pro 负责短提示词下的意向和 HTML 稿，Codex 负责参考现成设计继续实现。提示词足够详细时，三者的差距会缩小；需要模型自己补创意时，Gemini 3.1 Pro 在这次测试里更稳定。