研究解读 · 小互解读

GPT-5.6 Sol 登顶前端设计榜:它掌握了设计审美,学会避开 AI 常见套路

第三方评测平台 Design Arena 扒开它的一千个网页作品,发现设计空间里缺了一块,正好是紫色渐变这些 AI 通病该在的地方。
一分钟速览
  • 在 Design Arena 的网页设计(非 agentic)榜上,OpenAI 的 GPT-5.6 Sol 排到第一,比前代 GPT-5.5 高 18 位,这是 OpenAI 模型首次登顶这个榜。
  • 评测方把它生成的 1000 个网页转成图像向量做聚类,发现它的设计地图上有明显空洞,正好对应紫色渐变、便当盒布局、超大标题这些 AI 网页通病。
  • 同样是躲开通病,GLM-5.2 靠的是压根没学过这些套路,GPT-5.6 Sol 则是学过、但拒绝把它们画出来。
  • 它从可靠的模板出发,再对每个需求大幅定制,落在千篇一律和完全放飞之间。
  • 它没能躲开所有毛病:26.5% 的作品里塞了彩带(confetti),做数据图表的能力也偏弱。
1一个反常的发现

一眼就能认出的「AI 网页」,它学会了不那么做

你多半一眼就能认出 AI 做的网页:紫到蓝的渐变背景、满屏切成方块的便当盒卡片、占满首屏的巨大标题。看多了,那种「一眼假」的塑料感,几乎成了 AI 网页的胎记。

OpenAI 的新模型 GPT-5.6 Sol,最近在第三方评测平台 Design Arena 的网页设计榜上排到了第一,比前代 GPT-5.5 高了 18 位,这是 OpenAI 模型头一回登顶。评测方扒开它的作品才发现,它最大的不同,是学会了主动避开这些一眼假的套路。

Design Arena 的做法,是让不同模型接同样的网页生成任务,把成品摆给人盲选,谁被选得多谁排前面。GPT-5.6 Sol 拿下的是「网页设计(非 agentic)」这条榜,也就是一次性生成、不带多轮自动改的那种。

为什么值得看:登顶只是结果。评测方接着做了件更有意思的事,把它的一千个作品全部转成图像向量、画成一张设计地图,第一次直接看到一个模型「知道该画什么、却选择不画」留下的窟窿。
第 1 名
GPT-5.6 Sol 在网页设计(非 agentic)榜的排名,比前代高 18 位
1000 个
评测方用来画设计地图的 GPT-5.6 生成网页数量
GPT-5.6 Sol design benchmark overview
Design Arena 对 GPT-5.6 Sol 的评测概览。来源:Design Arena
2先说清被躲开的是什么

那些一眼就能看出「这是 AI 做的」的套路

上面点到的紫渐变、便当盒,只是这类套路里的几样。它们在圈里有个统称,叫 anti-pattern,也叫 design smell(设计的坏味道),意思是一看就露馅的俗套。要理解这次的发现,得先把这批坏味看全。

三个月前,Design Arena 分析 GPT-5.5 时列过一份这类坏味清单,主要几样是:

坏味道长什么样
紫蓝渐变背景一律刷成紫到蓝的渐变色,AI 出图的招牌配色
便当盒布局(bento box)把页面切成大小不一的方块卡片,像便当盒一样码满一屏
超大标题字不放主图,直接用巨大的一行标题占满首屏
错位排版(offset)元素故意左右错开,看着「很有设计感」,其实是套路
网格背景整页铺一层淡淡的方格线打底

这些东西单看每一样都不算错,问题是 AI 太爱用,用到读者一眼就能认出来。Design Arena 的评测里,带这些坏味的作品,往往是被人淘汰掉的那一方。

losing design with purple blue gradient
坏味道 #1:紫蓝渐变。这类作品在盲选里通常是落败的一方。来源:Design Arena
losing design with grid background
坏味道 #2:网格背景。来源:Design Arena
3设计空间里的洞

把一千个网页画成一张地图,地图上缺了几块

好味道和坏味道,都是主观的话。评测方想找一个能看得见的证据,于是做了一件事:把 GPT-5.6 Sol 生成的 1000 个网页,全部变成一张地图上的点。

这一步分两下走。第一下,把每个网页截图丢进一个叫 CLIP 的模型,它会给每张图吐出一串很长的数字。这串数字可以理解成给这张图打的一串「基因编码」,风格像的两张图,编码也接近。第二下,用一个叫 UMAP 的方法,把这串很长的编码压平成二维平面上的一个点,同时尽量保住原来的远近关系,风格接近的点在地图上也挨得近。

打个比方

CLIP 像是给每张网页作品发一张「风格身份证」,一长串编码;UMAP 则是把一整团立体的星云,拍扁成一张平面星图,星星原来的疏密、抱团、还有中间的窟窿,拍扁之后基本都还在。

一千个点铺开,就是这个模型的「设计空间」,也就是它爱生成、常生成的那一整片风格区域。铺开之后,评测方发现了不该出现的东西:地图上有几个明显的空洞,点云里突兀地缺了几块。

GPT-5.5 的设计地图 点云连成一片,没有缺口 紫渐变、便当盒等风格都在其中,正常生成 GPT-5.6 Sol 的设计地图 同样铺开,却挖掉了几块 紫渐变 该在这,缺了 便当盒
左右两片点云本该差不多,GPT-5.6 Sol(右)却在几处突然没了点,虚线圈就是「洞」。示意图,据评测方描述绘制

下面是评测方给出的真实投影图。第一张是 GPT-5.6 Sol,密密麻麻的点里能看出几处窟窿;第二张是 GPT-5.5,点云是填满的、没有这种缺口。

GPT-5.6 Sol UMAP projection with holes
GPT-5.6 Sol 的 UMAP 投影,点云里能看到明显的空洞。来源:Design Arena
GPT-5.5 UMAP projection filled
同样方法投影的 GPT-5.5,点云填满,没有那种缺口。来源:Design Arena
洞意味着什么

UMAP 这种投影,理论上会把原来空间里的窟窿一起保下来。所以一个模型的地图上有洞、另一个没有,说的就是:那块地方 GPT-5.6 Sol 本来能画、也在别处画得出来,但它就是不往那儿放东西。

为了确认洞里装的是什么,评测方把 GPT-5.6 Sol 和 GPT-5.5 的作品叠进同一张图:GPT-5.6 Sol 的点染成橙色,压在 GPT-5.5 的点上面。有橙点的地方,是 GPT-5.6 Sol 会去的区域;只剩底色、没有橙点的地方,就是它避开、而前代会去的区域。

overlap of GPT-5.6 Sol orange and GPT-5.5 blue dots showing purple gradient cluster gap
橙点(GPT-5.6 Sol)压在蓝点(GPT-5.5)上。两者大体重合,唯独「紫色渐变」那一簇完全不沾橙色,也就是 GPT-5.6 Sol 彻底避开的地方。来源:Design Arena

两个模型大部分地方重合,唯独紫色渐变那一簇,橙点一个都没有。便当盒、超大标题、错位排版这些坏味,也都是同样的情形,洞里装的正是那批 AI 通病。

4学过但拒绝,和压根没学

躲开同一批坏味,两个模型走的是两条路

避开 AI 通病的模型,GPT-5.6 Sol 不是唯一一个。但它躲的方式,和别人不一样,这也是这次分析最反直觉的一点。

拿排在前面的 GLM-5.2 做对照。它同样很少产出超大标题这类坏味,办法是它学了一批高分模板,模板里本来就不含这些套路。也就是说,它的设计空间里从来没有「紫色渐变」这块地,自然也就画不出来,地图上不会留洞,因为那里从头到尾就是空的。

GPT-5.6 Sol 是另一回事。它的地图上留了洞,恰恰说明它学过这些套路、有能力画出来,只是每次生成时都绕开了。它知道紫色渐变长什么样,也知道该往哪放,然后选择不放。

GPT-5.6 Sol · 学过但拒绝

设计空间覆盖了这些坏味的位置,却主动不往那里生成,于是地图上留下一个个洞。是「知道、且不做」。

GLM-5.2 · 压根没学

靠一批不含坏味的模板作画,那块风格从来不在它的能力范围里,地图上也就不存在对应的区域。是「压根没有这个选项」。

GLM-5.2 avoids anti-patterns via templates
GLM-5.2 靠模板回避坏味,它的设计空间里没有对应区域,也就不留洞。来源:Design Arena

两条路到了成品上,可能都能躲开俗套。差别在能力的形状:一个是把这块地圈起来标上「不去」,一个是这块地根本没画进地图。评测方认为,GPT-5.6 Sol 更像是学过之后主动抑制,这在模型里是少见的一种做法。

5模板和定制之间

从可靠模板出发,再给每个需求改一大截

这是评测方讲的第二个发现,关于「个性化」。做网页的模型大致有两种偏向:一种高度依赖模板,稳,但每次长得都差不多;一种几乎不用模板,每个需求都从头长,花样多,但不一定稳。GPT-5.6 Sol 落在中间。

它从一批被验证过好用的设计结构出发,但会针对每个具体需求做大幅调整,同一类模板底下能长出一批彼此相关、又各不相同的变体。评测方用了个比喻:像细菌演化成不同的近缘菌株,共用一套底子,再各自长开。

高度模板化 稳,但常常千篇一律 几乎不用模板 每个都定制,花样多 GLM-5.2 Claude Fable 5 GPT-5.6 Sol 用模板打底,再大改
模板化程度的光谱:GLM-5.2 偏模板一端,Claude Fable 5 偏定制一端,GPT-5.6 Sol 居中偏定制。据评测方描述绘制

作为两端的对照:GLM-5.2 这次排名也很靠前,它靠的正是学一批高分模板,好处是稳、坏处是变化基本只来自需求本身,同一套模板反复出现。Claude Fable 5 则几乎没有模板痕迹,设计空间更散,每个作品都按需求高度定制。

GLM-5.2 templated designs look similar
GLM-5.2 的作品,模板痕迹明显,彼此相似。来源:Design Arena
Claude Fable 5 varied non-templated designs
Claude Fable 5 几乎无模板,设计空间更分散、各不相同。来源:Design Arena

GPT-5.6 Sol 在这两端之间:用模板保住下限,再靠定制拉开差异。评测方认为,这让每个用户都能拿到一个贴合自己需求、又看着像专业手笔的页面,是它排名靠前的一大原因。一个能看出来的小尾巴是,它在给不同页面配图时,常把同一张图用在好几个不同场合。

6它没躲开的毛病

彩带撒了一地,图表还没学好

主动抑制通病这件事,GPT-5.6 Sol 也不是样样都做到。评测里点了两处明显的短板。

第一处是彩带。它特别爱在页面上撒 confetti(庆祝用的五彩碎纸动画),出现在超过 26.5% 的作品里。夸到什么程度:就算你没给它现成的彩带库,它也会自己手写一个出来用。这本身也是一种 AI 通病,只是这一个它没避开。

GPT-5.6 Sol overuses confetti
GPT-5.6 Sol 过度使用彩带,出现在超过四分之一的作品里。来源:Design Arena

第二处是数据图表。它做图表和数据可视化的表现偏弱,用 chart.js(一个常见的网页图表库)画不出像样的真实图表。

GPT-5.6 Sol weak at charts
GPT-5.6 Sol 在图表和数据可视化上表现较弱。来源:Design Arena
主动躲开的

紫渐变、便当盒、超大标题、错位排版、网格背景,地图上都留了洞。

没躲开的

彩带撒进 26.5% 的作品、还会自己手写彩带库;数据图表画不利索。

7又快又便宜

比原来的第一名快一倍多,价钱还低一半

除了排名和审美,GPT-5.6 Sol 在速度和价格上也拉开了身位。评测方说它同时立起了两条新的最优边界,一条是「好看程度对速度」,一条是「好看程度对价格」。

快 2.44 倍
生成速度对比原来排第一的 GLM 5.2
快 36%
生成速度对比 Claude Fable 5
$5 / $30
每百万 token 的输入 / 输出价
$10 / $50
同口径下 Claude Fable 5 的价,贵了一倍
什么叫最优边界(Pareto frontier)

想象一条画好的边界:站在它上面,你想让页面更好看,就得多花时间或多花钱,没法白赚。GPT-5.6 Sol 把这条边界往前推了一截,意思是同样的好看程度,它能做到更快、更省。

GPT-5.6 Sol pareto frontier preference vs speed and price
GPT-5.6 Sol 在「好看程度对速度」「好看程度对价格」两张图上都立起了新的最优边界。来源:Design Arena
8对挑模型意味着什么

又更挑剔,又更灵活

评测方把这次的观察收成两句话。

第一,它更挑剔。它像是学过了哪些视觉套路会让网页显得「一看就是 AI 做的」,然后主动把这些压下去,同时保留一批可靠的设计结构随时能用。第二,它更灵活。它把模板和定制捏在一起:拿模板保底,再对每个需求大改,让每个人拿到的都是一个贴合自己、又像专业手笔的页面。

这两点叠起来,是 Design Arena 给出的、GPT-5.6 Sol 能领跑单轮榜单的主要解释。至于它没躲开的彩带和画不好的图表,同样摆在评测里,一起看才是完整的一张脸。

GLM-5.2 像是压根没学过这些设计坏味,所以不会产出它们;GPT-5.6 Sol 则像是学过、知道这些坏味存在,但拒绝把它们画出来。 Design Arena,对 GPT-5.6 Sol 的评测分析
来源:Design Arena,《我们给 GPT-5.6 Sol 跑了网页设计基准测试》,2026 年 7 月 15 日。文中排名、图像聚类分析、速度与价格数据均来自 Design Arena 自家榜单与分析,图片来源同。GPT-5.6 Sol、GPT-5.5、GLM-5.2、Claude Fable 5 为各自厂商模型名称。