Frontend generation 已经成为 foundation model 能力提升最直观的地方之一。早期 evaluation 关心的是模型能否生成有效的 HTML、搭起一个 React 项目、让页面顺利 render,再让 control 真正驱动 state。现在的系统越来越能在第一次尝试里交出完整的 interface,typography、视觉层级、间距、图像和交互也能保持相当一致。在 agentic loop 中,harness 可以打开页面并捕捉 render 后的状态,再由 multimodal model 理解画面、提出修改。OpenAI 把 computer use 和根据 render 结果改进 interface 列为 GPT-5.6 frontend 能力提升的一部分 (OpenAI, 2026);Kimi K3 的报告则描述了模型内部的另一组改进,包括使用网页代码与 render 配对的数据训练,以及面向 web development task 的 reinforcement learning (Kimi Team, 2026)。我们最终看到的页面,可能同时来自模型学到的能力、system instruction、tools,以及多轮执行。这些进步最容易被看见的部分,是高概率视觉答案本身正在变化。图 1 把早期常见的 purple SaaS shell 和两种更新的 recurring mode 放在一起,后两种也已经开始成为新的 default。

Three miniature interfaces compare recurring generated frontend styles. The left is an earlier purple SaaS shell with a dark sidebar, hero masks, and a three-card grid. The middle is a warm cream editorial page with a serif headline, a terracotta gradient emphasis, a sign-in field, an alternate sign-in row, and a field-notes column holding an italic quotation and an annotated line chart. The right is a near-black page where a hand-drawn lighthouse on the right casts a wide beam across the composition, and the word inside that beam is the only lit element.

Figure 1. Three stylized composites of recurring frontend modes: the purple SaaS shell associated with earlier generated UI, followed by two newer defaults named in current frontend guidance, warm editorial and dark with an acid accent. The miniatures summarize visual conventions and are not outputs from a particular model.

在 2024 到 2025 年的大部分时间里,generated frontend design 有一套很容易认出的视觉特征。只要模糊地要求一个 modern landing page,模型往往会生成居中的 hero、紫色或靛蓝渐变、圆角卡片、柔和阴影、中性的 sans-serif 字体,以及三栏 feature grid。这组搭配出现得足够频繁,后来甚至形成了一个大家都能认出的类别,人们用“AI slop”“vibe-coded design”或“Claude style”来称呼它。Anthropic 把 Inter、紫色渐变、可预测的 layout 和很少使用 animation 的倾向,描述成围绕高频 web pattern 发生的 distributional convergence (Anthropic, 2025)。一个流传很广的起源故事,把注意力放在 Tailwind 创始人 Adam Wathan 为 Tailwind UI 按钮选择的 bg-indigo-500 上。他的玩笑指出了一种说得通的机制:被大量复制的代码、文档和 template,可能在模型输出中留下统计痕迹 (Wathan, 2025)。不过,web scale 的证据让这条因果故事变得更复杂。2025 年 HTTP Archive Web Almanac 发现,整个 web 对紫色和靛蓝的使用都显著增长,而使用 Tailwind 的页面在 2022 年以后并没有出现类似涨幅 (HTTP Archive, 2025)。在 generative coding 出现以前,人类制作的网站也已经越来越相似,共享的 library、responsive layout、移动端限制和成熟的信息架构都在推动这种趋同 (Goree et al., 2021)

到了 2026 年,紫色已经不足以概括模型的典型风格。Anthropic 现在的 frontend guidance 开始提醒模型避开另一批反复出现的设计:暖米色背景配高对比度 serif 字体和 terracotta accent,近乎纯黑的页面只留一个 acid color,以及用细线、密集分栏和方正几何构成的 broadsheet composition。它还特别指出装饰性编号、堆满 metric 的 hero、重复的页面结构和没有必要的 animation。短短几个月里,一些原本用来逃离旧 stereotype 的视觉方向,已经常见到需要专门写进 anti-default instruction (Anthropic, 2026)

同一 prompt 下的比较还显示,不同模型可以拥有不同的表层倾向,同时共享更深的设计惯例。在同一套基于 Tailwind 的 harness 里完成十个 one-shot frontend task 时,Kimi K3 反复选择更暖的 palette、serif display type、更多留白和更稀疏的 composition;Claude Fable 5 更常使用冷蓝或 cyan accent、sans-serif hierarchy 和更高密度的 layout。详细的 brand specification 会大幅压低这些差异,有些 prompt 甚至会把两个模型都带向相同的暖色 serif 方向。它们在 page anatomy 上的趋同更明显,pricing table、documentation shell 和 SaaS landing page 经常采用近似的结构 (Kilo, 2026)。这些反复出现的选择,可以理解成一种实际存在的 aesthetic prior:当 brief 没有规定 palette、typography、density、ornament 或 hierarchy 时,系统会从某个设计决策的分布中作答。System prompt、design skill、component library、browser feedback 和 coding harness 都可能继续移动这个分布。

相较旧式的 AI look,现在的进步是真实的。模型拥有更宽的视觉 repertoire,更能遵循 art direction,对 typography 的处理也更有意识,还可以借助 render feedback 修复可见问题。只是这些改进没有直接回答,人们说一个模型“更有品味”时究竟在评价什么。一个漂亮的 default,可能来自更强的 design judgment,也可能来自更新后的训练分布、更有效的 system guidance,或者一个已经学会哪些当代风格更容易在快速比较中胜出的 preference model。更严格的测试,是看系统能否随着产品、受众、内容、品牌、文化环境和实际限制的变化,恰当地调整自己的选择。这样一来,generated UI 就进入了一个古老得多的美学问题:“主观”这个词常常把几种不同的差异压在一起。人们可能注意到不同的形式属性,认出不同的历史参照,使用不同的类别预期,拥有不同程度的专业知识,也可能想象不同的受众和用途。他们可以同时认同某个页面明显失衡或对比度太差,却给新颖、熟悉、克制、装饰和表达性分配不同权重。要判断模型是否获得了 taste,又该用什么 data 或 feedback 改善它,我们得先更清楚地理解,人们过去怎样讨论美、good design 和经过培养的 judgment。

美在哪里?

说一个 interface 很美,听起来首先是在评价它看得见的形式。可同一种形式在一个人眼里显得克制,在另一个人眼里却显得空洞;一个年代觉得新鲜的东西,下一个年代可能已经成为 cliché;有些界面看起来很优雅,真正用起来以后判断又会改变。美学史的价值正在于,不同时期的解释需要容纳越来越多这样的变化。对象本身一直重要,观察者、观看发生的那次相遇、后天学会的观看方式,以及 artifact 的目的,也逐渐进入审美判断的范围。图 2 在五幅画面中保持同一个 artifact 不变,再把 judgment unit 从内部秩序一路扩展到观察者、反应、习得的感知,最后落到 purpose 和 context。

Five plates set side by side, numbered one through five and labelled order, judgment, response, learned perception, and purpose or context. The first shows a geometric construction alone inside its frame: an inscribed ellipse, both diagonals, the two axes, and a small circle in a reciprocal square at the lower right. The second adds an observer in profile whose lines of sight reach the same construction, now seen at an angle. The third replaces those lines with a soft bundle of warm curves that leaves the eye and gathers again at the centre of the picture. The fourth interposes four evenly stepped translucent planes between observer and picture, two of them carrying a dotted echo of its outline. The fifth hangs the same picture on the wall of a working room, among copy blocks, colour swatches, a chart and a lamp, with a chair drawn up to the desk below.

I Order II Judgment III Response IV LearnedPerception V Purpose /Context .500 .275 .225 .215 .571 .214
Figure 2. Five expanding units of aesthetic judgment. The same artifact can be considered through its internal order, an observer's judgment, the response produced in their encounter, the learned perception that structures that encounter, and its fit with a purpose and context.

美在秩序中

最直接的出发点,是在对象内部寻找美。Vitruvius 在 The Ten Books on Architecture 中用 order、arrangement、proportion、symmetry 和 decor 描述建筑。这里的 symmetry 指各部分之间,以及每一部分与整体之间都有可以相互度量的关系,所以一根柱子、一个房间或一面 facade 的尺度,都来自更大的 composition (Vitruvius, 1914)。这套理解放到 interface design 中依然很直观:hierarchy、rhythm、balance 和 visual unity 讨论的都是部分之间的关系,一个漂亮的 component 仍然可能削弱它所在的整个页面。

Birkhoff 又把同一种愿望推向了形式化测量。他在 Aesthetic Measure 中提出 $M = O/C$,把 aesthetic value 定义成 order 除以 complexity,并将它用于 polygon、ornament、vase、music 和 poetry (Birkhoff, 1933)。这个公式把一种更广泛的希望表达得格外明确:也许与美有关的性质都能在 artifact 中找到,再以某种方式组合起来。困难同样很熟悉。两个人面对相同的比例关系可能产生不同反应,同一个人重看一件难懂的作品时,也可能发现此前没有看见的价值。对象里的关系还需要有人感知,并判断它们是否重要。

美在判断中

观察者一旦进入画面,disagreement 就成了问题的一部分。Hume 在 Of the Standard of Taste 开头把美放在观看者的心中,随后追问为什么有些判断仍然显得比另一些更敏锐。练习让 critic 注意到更细的特征,比较可以防止平庸的成就显得格外出众,摆脱偏见则有助于从作品预期受众的位置理解它。他描述的 standard,其实是在说明一个可信的 critic 如何形成:taste 已经包含经过训练的注意力、用于比较的记忆,以及调整自身观看位置的能力 (Hume, 1757)

Kant 则解释了这种判断为什么不同于私人的喜好。在 Critique of Judgement 中,pleasure 构成 beauty judgment 的基础,却没有任何 concept 能预先证明一个对象必然带来这种愉悦。即便如此,把一个对象称为 beautiful,仍然是在期待别人也能分享这份反应 (Kant, 1914)。所以审美分歧会带来理由、比较和“再看一次”的邀请,即使没有一种 proof 能彻底解决争论。既然判断依赖观察者的反应,这个反应本身也就可以成为研究者试图观察的对象。

美在反应中

十九世纪时,Gustav Fechner 提出一种“aesthetics from below”,从经验上研究即时愉悦出现的条件。他的 Vorschule der Aesthetik 讨论了多种 experimental method,其中包括让人们在不同形式之间作选择,以此研究 liking 的规律 (Fechner, 1876)。D. E. Berlyne 后来继续研究 novelty、complexity 等属性与 pleasingness、interestingness 等反应之间的关系 (Berlyne, 1970)。在这类研究里,美发生在一次相遇中:stimulus 被呈现,response 被记录,两者之间的关系成为研究对象。后来的 computational aesthetics 也继承了这种 ambition,只是把它改写成 prediction problem。

把反应记录下来,并不会让它自动得到解释。实验需要先决定记录哪一种反应,而产生反应的那个人已经带着 category、memory 和 attention habit 来到现场。表面上的 measurement unit 是“一个 viewer 面对一个 artifact”,里面其实包含了一段更长的学习历史。

美在习得的观看方式中

Kendall Walton 认为,一件艺术品具有哪些 aesthetic property,部分取决于 viewer 把它放在哪一个 category 中观看。在一个类别里属于 standard 的特征,换到另一个类别中,可能显得富有表现力、带有破坏性,或者十分笨拙 (Walton, 1970)。Style 也是这样变得可见的:我们总是在一组 alternatives 和 expectations 之中感知某些选择。一个人可以看见 interface 里的每一种颜色、线条和 typeface,却没有看出为什么这些选择显得克制、过度、常规或陌生。

Michael Baxandall 用后来常被称作“period eye”的想法,为这组比较关系补上历史背景。十五世纪意大利的 viewer 会把从商业、宗教实践、舞蹈和其他社会生活中习得的视觉习惯带进绘画;artist 也可以针对这些习惯安排作品,因为创作者与受众共享同一套观看文化 (Baxandall, 1988)。Bourdieu 又把范围扩得更远,说明教育、阶层、cultural capital 和 institution 怎样影响一个人会接触哪些对象,又会学会重视哪些区别 (Bourdieu, 1984)。因此,一次 aesthetic response 可以揭示 artifact 的性质,也同时携带观察者用来观看它的 category、时代和制度背景。对于 designed artifact,还有一层关系必须加进来,因为 interface 同时是一个需要被使用的东西。

美在目的与情境中

理解一把椅子如何承重,或者一张 diagram 如何揭示比较关系,会改变我们对其形式的审美感受。Parsons 和 Carlson 把这种经验称为 functional beauty:关于 function 的知识可以进入 aesthetic perception 本身 (Parsons & Carlson, 2008)。Interface 会施加同样的压力。一个视觉上非常平衡的页面可能把注意力引向错误的地方,一种优雅的 interaction 放到不合适的受众或场景里,也会显得完全不对。

从 order 一路走到 purpose,改变的是审美判断所包含的 unit。我们可以从对象内部的关系、观看者的反应、塑造感知的 category 与 history,以及 designed artifact 所处的目的和情境来理解美。任何一组关系都无法单独决定判断,它们合在一起,才解释了 aesthetic experience 为什么既能落在可感知的形式上,又会随着知识、文化和使用方式改变。

分歧也因此无法被简单归结为私人喜好。即使没有一种程序能够保证所有人最终达成一致,viewer 仍然可以提出理由、比较 precedent,并指出别人此前忽略的性质。Expertise 和 context 会改变什么变得可见,也会改变什么值得获得更高权重。相比一句“美是主观的”,这种理解更能解释审美判断为什么可以多元。

对于 design 来说,即使把这些关系全部考虑进去,仍然会留下很多可行的形式。两个 interface 可以服务相同的受众、完成相同的任务、使用相同的视觉传统,同时发展出完全不同的 character。美学理论可以帮助我们看清哪些关系值得注意,却不会替我们选出唯一的 form,也不会决定 convention 应该在什么地方让位给 invention。Taste 正是在这里出现的。

一个模型“有品味”意味着什么?

大多数设计要求(brief)都不会把视觉形式完全规定下来。即使产品、受众、内容和功能都很清楚,仍然有许多形式可以很好地回答这份要求。Taste 就是在这些可能性中作判断的能力:看出哪些答案适合,它们分别获得和牺牲了什么,以及一项选择能否贯穿整个 artifact。最自然的起点是 convention,因为它们构成了 designer 在尝试做出 distinctive choice 以前,会先遇到的一批合理答案。

惯例是有用的默认答案

Convention 承载了长期积累下来的 design knowledge。Checkout flow 使用人们熟悉的字段和 action 顺序会更顺手,financial dashboard 也需要和其他 analytical tool 保持足够的连续性,密集的信息才能继续被理解和操作。Typography、spacing、component structure 和 interaction pattern 还会在人们细看内容以前,就告诉他们眼前是哪一类 artifact。这些 default 缩小了巨大的 design space,降低用户的理解成本,也让 designer 能把注意力留给产品中真正需要新答案的部分。

所以 familiarity 与 novelty 不是一条从差到好的简单刻度。在一项 industrial design 研究中,Hekkert、Snelders 和 van Wieringen 控制了 typicality 与 novelty 之间的负相关之后,发现两者都可能正向影响 aesthetic preference (Hekkert et al., 2003)。这项研究讨论的是 consumer product,直接把结论搬到 interface 上会超出证据范围,不过它揭示的 tension 很有用:artifact 可以清楚地属于某个 category,同时又离开这个 category 足够远,因而显得有趣。开头的 warm editorial style 就说明了 typicality 为什么有价值。对一家小型陶艺工作室来说,cream paper、serif display type、terracotta accent 和宽松留白是一套合理的 default,因为它们很快就能让人联想到材料、细致和手工感。更难的问题,是最终的页面究竟了解了这家工作室多少。

有用的默认答案什么时候变得 generic

当一个 default 对 category 的响应强于对具体情境的响应时,它就开始显得 generic。陶艺工作室的页面可以很合适,也很 polished,却依然可以和许多其他工作室的页面互换。SaaS landing page 也可以接受同样的测试:如果把公司和内容全部替换掉,居中的 hero、product mockup、testimonial row 和 pricing card 仍然原封不动,这个 design 就大量借用了 genre,却只吸收了很少来自真实问题的信息。

这种区别和 The GenUI Study: Exploring the Design of Generative UI Tools to Support UX Practitioners and Beyond 中 UX practitioner 的反馈很接近。研究让 37 名 UX 相关从业者用一周时间完成使用 generative UI tool 的项目。参与者认可快速 generation 对 brainstorming 和 intermediate draft 的价值,同时也提到很难把结果精确引导到自己的意图上,originality 与 adaptation 有限,最后一公里仍需大量工作 (Chen et al., 2025)。高 fidelity 会让一个宽泛的 solution 看起来已经完成,即使真正的 design problem 还没有解决。

单纯让结果变得 unusual 也解决不了这个问题。一套 unconventional navigation、type treatment 或 animation,完全可能像熟悉的 template 一样忽视产品本身。一个更有用的标准是 accountable specificity:一项 distinctive choice 需要通过它与 content、audience、purpose、context 或 artifact 内部逻辑之间的关系,说明自己为什么应该存在。假如这家陶艺工作室在改造后的 machine shop 中制作线条冷硬的黑色 stoneware,这些事实也许会支持更暗的 palette、更硬的 geometry、更粗粝的 photography,或者许多其他离开 warm editorial default 的方向。它们不会机械地推出某一种 style,只会为 designer 决定保留什么、改变什么提供理由。

品味决定保留什么、改变什么

Taste 是判断哪些 convention 值得采用、哪些需要调整、哪些应该放弃,以及 deviation 应该发生在哪里的能力。Personal preference 可以参与这些决定,taste 还要求这些选择与 artifact 之间存在理由,并且能够意识到选择带来的后果。Comparative memory 让 designer 有能力分辨 restraint 与 emptiness、有效的 precedent 与 cliché,以及有意义的不规则与偶然失误。经验则帮助他预先看出,一个局部上很有希望的处理会增强整个 interface,还是会在遇到真实内容、interaction 和 edge case 以后崩掉。

Expertise 的作用,在于它会改变判断能够使用哪些 distinction。在使用 abstract visual material 的实验中,art expertise 更高的参与者倾向于觉得困难的 image 更有趣、没有那么令人困惑,而 appraisal 对他们反应的影响也有所不同 (Silvia, 2013)。Interface design 面对的是不同的对象和技能,因此只能保留一层更宽泛的启发:training 可以改变一个人能够注意到什么。一个 designer 可能会在 casual viewer 觉得有问题以前,就看到薄弱的 typography relationship、缺少原创性的 composition,或者一个遇到真实内容便会失效的 grid。Good judgment 还需要考虑目标受众,因为他们的 familiarity 和实际需要,有时比专业 designer 对 novelty 的兴趣更值得获得权重。

一个有 taste 的模型仍然可以拥有容易辨认的倾向。更严格的要求,是当产品、受众、内容、category 或 stakes 改变时,它的选择也会跟着变化。熟悉的 pattern 仍然有用时,模型应该保留它们;情境给出理由时,模型应该能够离开;一个局部上漂亮的选择削弱整体时,模型也需要看得出来。评价这种能力,只挑一张最吸引人的 final screenshot 还不够。我们需要看到 artifact 本身,知道是谁在作判断,也需要观察设计选择在什么条件下应当改变。

我们怎样评价审美质量?

Interface render 出来以后,最直观的 evaluation 有两种。我们可以检查 artifact 里的 collision、contrast 和 balance,也可以问一个人哪份结果看起来更好。两种方法都能产生数字,数字描述的对象却不一样。Collision rate 记录的是 artifact 内部一组可见关系,preference score 记录的是某个 observer 在一次具体比较中的反应。每一套 evaluation 都在构造一种 observation process:它决定 artifact 的哪些部分会成为证据,由谁来判断,以及这些 observation 最后怎样变成一个 score。

从可见属性到人为设计的 proxy

Rendering 把 code 变成可以检查的 visible object。Browser 可以提供 element 的位置与尺寸,最终的 image 则显示颜色和留白实际怎样分布。AeSlides 利用这些信息检查 aspect ratio distortion、excessive whitespace、element collision 和 visual imbalance (Pan et al., 2026)。它用 element bounding box 的重叠近似 collision,再用视觉重心估计 balance。这些定义无法恢复 designer 的意图,但能为一小部分可见 failure 提供足够稳定的定义,从而跨越大量 artifact 进行计数。

有些 evaluation 会继续往前,尝试近似更整体的印象。SlidesGen-Bench 测量局部的 text-background contrast、color harmony、colorfulness 和不同 slide 之间的 visual rhythm,再用根据 human ranking 校准过的权重把它们组合起来 (Yang et al., 2026)。它的 evaluator 比研究中测试的 general-purpose VLM judge 更接近人类排序,不过 human rater 之间的一致性仍然更高。仔细挑选的 proxy 因此可以概括 visual competence 中很有意义的一部分,最后的 score 也同时带着研究者的决定:contrast、color 和 rhythm 分别应该在整体里占多少分量。

这些例子处在一条连续的光谱上。Overflow、collision、contrast 和一部分 geometric imbalance,可以用跨 artifact 相对稳定的可见条件描述。要评价 alignment、grouping 或 spacing rhythm,就需要更多关于 element 原本应该如何关联的知识。Originality 与 appropriateness 又往前一步,因为它们取决于有哪些其他 design 构成参照、谁会使用这个 artifact,以及它会出现在哪里。Metric 中进入的 interpretation 越多,score 也就越体现一套关于 good design 由什么构成的理论。

一项偏好总有它的人群与参照集

当这些更广泛的 quality 无法被一组 proxy 充分捕捉时,研究者通常会请人比较完整的 artifact。前面对 taste 的讨论已经让我们有理由预期 disagreement。Evaluation 会把这个哲学上的复杂性变成一组非常实际的选择:问谁、让他们判断什么、给他们看哪些 alternatives,又怎样合并答案。

问谁,会显著改变 evaluation 的 target。DesignPref 让 20 名 professional designer 对 generated UI 作出 12,000 次 pairwise judgment,但他们对 winner 的一致性很低,Krippendorff’s alpha 只有 0.25 (Peng et al., 2025)。解释中可以看到,他们对 density、decoration、visual tone 和 primary action prominence 的注意与权重并不相同。适配到单个 designer 的 model,比使用大得多的 aggregate pool 训练的 model 更能预测这个人的选择。Majority preference 仍然可以描述抽样得到的 group,只是它对单个 designer 和处在不同情境中的 audience 代表得没有那么好。

问题怎样问也会影响结果。VLM judge 让 comparison 便宜到足以大规模运行,而 pairwise question 往往比 absolute score 或大 batch ranking 更接近 human judgment (Chen et al., 2024)。同时摆出两个具体 alternative,judge 不必在心里维持一把看不见的尺子,去记住七分究竟应该是什么意思。与此同时,这两个 alternative 也进入了 standard。一个 design 可以在一组质量较弱或 style 很窄的 reference 中获胜,换一组 reference 以后,注意力可能被引向完全不同的 quality。

随着 generated interface 越来越 polished,这些选择会更加重要。大面积 collision 和不可读的文字,通常足以让 evaluator 没有太大分歧地作出选择。等这些 failure 逐渐消失,ranking 就会依赖 type contrast、density、image treatment、restraint、novelty 和许多其他决定,而它们的重要性会随人和情境变化。两个 evaluator 可以注意到完全相同的细节,最后仍然给出不同排序,因为他们给这些细节的权重不同。

这些证据究竟能走多远?

结论应该和证据保持在同一个尺度上。Direct check 可以说明某些 layout 或 legibility problem 是否减少;pairwise comparison 可以说明一组明确的人,在他们看到的 alternatives 中更喜欢哪些 candidate;expert review 能讨论 precedent 和 professional practice;target user 则能判断一套 visual language 是否适合真实的使用场景。Screenshot similarity 或一个没有区分来源的 preference score,对 originality、cultural fit 和 general design judgment 提供的证据要弱得多。

把多种 signal 合成一个 score,不会扩大它们实际观察过的范围。Composite score 是一套用权重写出来的审美理论,研究者必须决定 formal resolution、immediate preference、professional judgment 和 audience fit 分别应该为“better”贡献多少。先分别报告各个 dimension 与 disagreement,再把它们合并,这些选择才不会被藏起来。这样一来,“better aesthetics”可以明确地指更少的 observable defect、更受某个群体喜欢、更符合 context,或者几种 outcome 的一套公开权重。现有 evaluator 还无法为所有 beautiful interface 建立一个 universal ordering。

Evaluation report 可以保留这些 qualification,learning system 却需要能够在成千上万个 example 或 rollout 中反复使用的 signal。一旦 rendered check、comparison、critique 或 reference set 进入 training loop,它就会开始塑造模型更可能生成哪些 design。要理解 visual ability 怎样提升,我们需要继续追踪每一种 signal 奖励了什么,又有哪些部分的 aesthetic judgment 留在它看不见的地方。

模型怎样学会什么“好看”?

上一节把 evaluation 理解成一种 observation process。进入训练以后,被反复使用的 observation 会获得改变模型输出概率的力量。每一个阶段都会让某些 design choice 更容易出现,也让另一些逐渐退到边缘:某种 palette 变得更常见,一套 composition 成为可靠答案,某类 defect 则被慢慢筛掉。用可能设计的 distribution 来理解这段 learning process 会很有帮助。它最初相对宽泛,经过 curation 后收窄,再通过 preference 获得更明确的 point of view。

从宽泛的 prior 到筛选后的 distribution

UI generation 首先建立在普通的 code competence 上。模型需要掌握有效的 syntax、framework 和 library,知道 component structure、state management,以及软件中反复出现的 implementation pattern。StarCoder2 为这层基础提供了一个披露相对透明的例子,它的 pretraining data 来自数百种 programming language 的 repository、pull request、notebook 和 code documentation (Lozhkov et al., 2024)。这样的基础可以解释模型为什么能写出看起来合理的 frontend code;prompt 没有规定的视觉选择,则会由模型在其他地方见过的 pattern 填上。

Aesthetic prior 正是在这里第一次显现。要求一个“modern landing page”时,prompt 很少会准确指定 palette、type scale、corner radius、density 或 hero composition,模型却仍然要替它们作出选择,学习分布中概率较高的组合就成了方便的答案。Web code、template、documentation、design system、对视觉作品的文字描述,以及后来生成的 example,都可能参与其中。Kimi K3 是少数公开确认 frontier pretraining 已经包含 code 与 rendered webpage 等视觉 artifact 配对数据的例子。报告只能证明 code-render data 确实存在,它对 open-ended design judgment 有什么影响仍然没有答案。Frontier model developer 对 data composition 披露得太少,也缺乏有针对性的 ablation,所以我们通常无法把某种反复出现的 style 精确追溯到一类 data 或一个 training stage。

在 explicit preference optimization 开始以前,curation 已经会重新塑造这个 distribution。哪些 human example 被认为是 high quality,哪些 synthetic page 可以通过 filtering,哪些 revision 会被留下来作为 demonstration,这些选择本身就包含了对 desirable output 的判断。Supervised fine-tuning 随后提高这些 structure、visual language 和 implementation practice 被再次复现的概率。一个充满宽松 editorial layout 的 collection,会把模型推向与 dense dashboard 为主的 collection 不同的方向,即使两边都只被标成 high-quality UI。

Demonstration 特别擅长展示一个合格的 finished answer 长什么样,却很少解释这个答案为什么适合眼前的产品,也很难表达另外两种同样 polished 的方向为何被放弃。公开研究更容易确立一些边界较窄的收益:rendered component data 可以教模型根据 visual structure 恢复 code,Flame 的 ablation 也显示 image interpretation 能改善这项 reconstruction task (Ge et al., 2025)。Screenshot 已经把目标方向给了出来。Open-ended design 面对另一种 uncertainty,因为多个答案可能同时 coherent、functional 而且 attractive。当问题从复现一个 good example 走向在几种 good alternative 中选择时,comparative judgment 就会提供更多信息。

当 preference 变成 selection pressure

Preference optimization 会按照某一种 judgment source 改善模型,因此也会决定谁的 judgment 成为训练目标。Comparison 能表达单个 demonstration 隐藏起来的一层信息:面对两个都说得通的 design,其中一个更受偏好。这份 preference 可以来自 human annotator、VLM judge、rubric、automatic measurement 或 reference set,随后用于筛选 example、排列 candidate、训练 preference model,或者通过 preference loss 与 reinforcement learning 更新 generator。RLHF、RLAIF 和 GRPO 使用 signal 的方式不同,真正决定哪些视觉差异得到 credit 的,仍然是 judgment 的来源与内容。反复优化会提高这些选择再次出现的概率,最终形成的 aesthetic direction 也因此带着某种 point of view。

当 evaluator 能够稳定地观察一种属性时,改进最容易看清。正如前面 slide generation 的结果所示,反复检查可以逐渐训练掉 collision、excessive whitespace、aspect ratio distortion 和某些 imbalance。当精确规则覆盖得太窄时,更整体的 visual judgment 也会有帮助。例如 MM-ReCoder 同时使用对 chart detail 的 deterministic check 和对完整 render 的 multimodal assessment,它的 ablation 显示两种 signal 会改善 artifact 的不同部分 (Tang et al., 2026)。这类 feedback 可以改善 craft 中一些具体问题,却无法证明选择出来的 visual language 适合它的受众、文化或时代。那些 quality 仍在 evaluator 能够可靠看到的范围之外。

即使任务范围更窄,换掉 evaluator 也可能改变 learning 的方向。UI2CodeN 发现,用 CLIP similarity 作为 reward 会让 UI drafting 相对 supervised model 退步,VLM-based judgment 则带来改善,relative comparison 的效果又更好 (Yang et al., 2025)。任何 score 只要被反复使用,都会成为 selection pressure。Evaluator 看不到的 property 很少产生训练上的后果,而能够稳定抬高 score 的 shortcut 会逐渐扩散到 output distribution 中。因此,究竟什么变得更好,和谁或什么有资格认出 improvement,本来就是同一个问题的两面。

Composite reward 还可能掩盖这种 pressure 已经变得多窄。在 Training AI to Paint with Code 描述的 watercolor experiment 中,最初的 reward 有九个不同名称的 signal,其中几个 visual dimension 却高度相关;optimization 仍然让总分持续上升,output 则逐渐收敛为相似的扁平花朵 (Narreddi, 2026)。Signal 名称的数量高估了 reward 真正能够区分的独立方向。后来改用一个 hand-curated pool 作比较,产生了更有用的 signal,同时这个 pool 也定义了 output 可以凭借哪些颜色、形式和技法获胜。它实际上构成了一份 latent design brief,并建立了一个 local aesthetic target。这批 model-generated reference 由一位 curator 挑选,实验前后还有几个环节一起变化,因此结果不足以建立一套通用的 taste training recipe。它真正有解释力的地方,是让我们看见 judge 与 comparison set 怎样在看似只负责打分时,持续收窄生成分布。

Revision 为这段解释补上一个有用的区分。General training 改变模型跨越许多情境时更可能生成什么,revision supervision 教的是怎样从一个可见的 failure 走向更好的 state。比如 VisRefiner 会把 target screenshot 与 generated page 之间的 discrepancy,同能够消除差异的 code edit 联系起来 (Deng et al., 2026)。Runtime observation 又会提供当前 artifact 独有的信息,包括 content、viewport、browser behavior 和 previous edit。这些机制可以让 correction 更贴近眼前的情境,哪一个 state 算作更好,仍然由 evaluator 决定。

我们究竟在对齐谁的品味?

看清这股 pressure 以后,模型反复出现的 style 也可以被理解成 alignment history 留下的记录。Broad training 提供初始概率,curation 选择哪些区域值得继续模仿,反复 comparison 再让其中一些区域稳定地获得 reward。最终容易辨认的 output,可能同时携带 annotator 的 preference、VLM judge 学到的标准、reference set 的 composition,以及 rubric 中预设的 tradeoff。即使经过精心设计,aggregate target 也总会代表某一群人和某一套 procedure。

当表面上的 target 是 professional judgment 时,这个限定尤其重要。在 DesignPref 中,professional designer 经常选出不同的 winner;适配到单个 designer 的 predictor,比更大的 aggregate model 更准确地描述这个人的选择。前面的 evaluation 讨论里,这种 disagreement 限制了一个 score 能支持多大的结论。假如同一批 judgment 被汇总后用于训练,aggregation 也会通过把不同 point of view 压缩成一个共同的 winner 或 probability,直接定义 learning target。这项研究测的是 preference prediction,无法证明 personalized alignment 会产生更好的 interface。它能说明的是,“professional taste”并非一个简单、稳定、等着模型去学习的 label。系统可以越来越稳定地满足一种特定的 judgment process,同时仍然没有在其他 designer、audience 和 context 上得到验证。

这也是现有 training evidence 最主要的边界。Aesthetic improvement 可以指某些 craft failure 更少发生,也可以指某个 comparison population 更频繁地偏好模型的 output,或者模型离 curated reference distribution 更近。每一种都是实际进步,合在一起仍然不足以证明模型获得了判断“每一种情境该使用哪一种美”的 general faculty。Preference alignment 可以提高 average appeal,也会把 generation 集中到更容易在已有 comparison 中获胜的区域。从 broad prior 经过 curation 和 preference,最后形成由特定 judgment 塑造的 distribution,这条路径也可能参与制造文章开头观察到的 convergence。

当一个好答案变成默认答案

假如把几年前一张紫色渐变的 landing page 拿给一个几乎不看 AI-generated UI 的朋友,他完全可能觉得它很 polished,甚至很漂亮。居中的 hero、圆角卡片、仔细控制的间距和紫色 glow,本身并没有明显的形式问题。每天 review generated interface 的 designer 看到同一个页面,却可能在几秒钟内认出“这是 AI 做的”。Pixels 没有变化,两个 viewer 带着不同的观看历史而来,这个页面在他们各自的 comparison field 中也处在不同位置。Processing fluency 可以解释其中一部分:熟悉、容易处理的形式,往往会带来更正面的 aesthetic response (Reber et al., 2004)。一种 style 已经让 experienced viewer 感到厌倦以后,familiarity 仍然可以为其他人提供 trust、recognition 和 legibility。现在同样的问题正在 warm cream background、high-contrast serif type 和 editorial composition 上重演。如果这些形式继续扩散,几年以后我们还会用同样的方式看待它们吗?

重复不会简单地让 design 越来越好或越来越差。关于 mere exposure effect 的实验发现,它带来的收益会随着 boredom proneness、stimulus complexity,以及作出判断时的 comparison condition 而变化 (Bornstein et al., 1990)。Preference 在更长的时间跨度里也会移动:Carbon 发现,在五十年的 automobile design 中,曲线造型出现的频率和人们对它的喜爱都在变化,并将 adaptation 与 Zeitgeist 视为其中说得通的解释 (Carbon, 2010)。这些研究没有证明 AI interface style 也遵循同一套 lifecycle,却修正了一个过于简单的直觉,即 exposure 会自动把美变成丑。Cliché 是一个关系性的判断。紫色页面可以继续保有原来的 balance、hierarchy 和 color harmony,同时成为一大类 prompt 的预期答案。改变的是选择它这件事所表达的意义。

Foundation model 也许会压缩这个 lifecycle。Broad training 给出 aesthetic prior,curation 让分布中的特定区域更容易被模仿,preference alignment 则反复提高那些能够赢得认可的选择出现的概率。Generation 随后把这些选择铺到大量新 interface 中,其中一部分未来还可能进入 web 和后续 training distribution,形成一种可能的循环:模型学习 web,再生成下一代 web 的一部分,后来又从自己参与改变的分布中学习。图 3 用 aesthetic possibility space 中 output density 的移动,画出了这种 speculative movement。图里最关键的编码是 probability mass 在哪里集中:repertoire 即使很宽,生成结果仍然可能反复落进少数 default。目前没有研究端到端证明这条循环,filtering、human design 和 deliberate diversification 也都可能改变它。不过,这种可能性仍然值得注意,因为它意味着昨天的 good taste,可能更快地成为今天可靠的 optimization basin 和明天的 default。

Three conceptual density maps labeled 2024–25, 2026, and 2027+ show recurring generated-UI aesthetics shifting within a possibility space, with speculative trajectories connecting clusters in the final panel.
Figure 3. A conceptual illustration of output density shifting within an aesthetic possibility space. The 2024–25 and 2026 panels summarize qualitative patterns discussed in this article rather than measured distributions; 2027+ is a speculative outlook, and its arrows indicate possible trajectories rather than forecasts.

当这些经过验证、polished 的答案变得廉价而且充足,freshness 可能会更稀缺,也因此获得更高价值。这可以解释为什么一个新模型只要在容易辨认的 AI distribution 之外,稳定地产生一套 coherent visual language,就会立刻让人觉得它更有 taste。吸引力一部分来自 artifact 本身,另一部分来自它让人看见了一个还没有被其他系统反复占据的 possibility。单纯的 surface difference 对 judgment 的证明仍然很弱。模型可以在数百套 style preset 之间轮换,却没有真正响应 product、audience、content 或 purpose;面对几组理由相似的 task 时,反复作出相同选择也可以完全合理。更深的 convergence,是 context 对 aesthetic decision 的影响逐渐变弱。

直接奖励 novelty 会再次制造同一种困境。奇怪的 navigation、任意的 typography 和没有必要的 animation,都可以人为拉开与 prior 的距离;这些手法一旦反复获胜,anti-default 很快也会固化成另一套 recognizable default。Accountable specificity 提供了一个更有用的标准:distinctive choice 需要从 product、content、audience、culture、purpose 或 artifact 的 internal logic 中获得理由。一种更能说明问题的测试,是让 brief 的大部分内容保持不变,只修改一个本应影响审美判断的条件。公司从玩具品牌变成医院,受众变成第一次使用智能手机的人,promotional copy 变成 emergency information 时,模型会修改哪些决定、保留哪些 convention,又能否用新的 situation 解释这些变化?相对于 prior 的距离和方向,在这里仍然是一种有用的 lens。关键在于,眼前的 situation 是否给了模型移动的理由。

未来最有意思的 UI model 也许没有一套永远最好的 style。它的 taste 会出现在这些时刻:一个通常很成功的答案已经不适合当前 artifact,familiarity 仍然服务于用户,或者 situation 给出了向另一个方向寻找的理由。现有研究越来越清楚地展示了怎样减少 visible defect、提高 visual correspondence、优化明确的 preference target,以及借助 rendered feedback 改进 artifact。更难的 open problem,是系统能否保留足够丰富的 aesthetic possibility,从而认出 distribution 中 reward 最高的区域,有时并非最适合停留的地方。

这篇文章一直停留在 generated UI 最容易被看见的 dimension。一个 interface 可以展现成熟的 aesthetic judgment,同时包含错误的信息、失效的 behavior、令人困惑的 interaction、脆弱的 implementation,或者在 revision 中毁掉此前已经成立的部分。Part II 会把视野从 aesthetics 与 taste 扩展到“模型擅长 UI”这句话里隐藏的其他 quality,以及真正能够观察这些 quality 的 evaluator 和 feedback channel。