Hacker News 中文摘要

RSS订阅

垃圾UI的10个特征 -- 10 Tells of a Slop UI

我的大学应用(college app)前不久更新了所谓的“微小界面改进”(minor UI improvements),却成了见过最粗制的用户界面。旧版虽笨拙,但远胜于其AI代理产出的垃圾大炮。slop UI指AI炮制的观感错位、缺乏用途或过于通用的界面,常出现在没有愿景的vibe-coded UI中,让应用显得廉价而无吸引力。

正文

最近我的大学应用更新了“小幅 UI 改进”,却是我见过最烂代码写的界面。

旧界面虽笨重,但我宁可要旧的,也不要 AI 代理产出的垃圾。

什么是垃圾界面?

垃圾界面就是 AI 弄出来的那种不对劲的界面:出现在不该出现的地方、毫无用途,或者过于通用。这在缺乏愿景的 vibe-coded UI 里常见。做得好可以很棒,但大多数不行,让应用显得廉价无味。

劣质代码网站示例:

Cloudflare 最近就搞出个这样的网站。

Cloudflare 垃圾网站

云垃圾2

还有这类网站,一看就知道,就像如今的 AI 视频:

垃圾仪表盘

总之,以下是构成这些垃圾界面的要素。

渐变。到处都是渐变。

最明显标志就是渐变。随时随地,啥都渐变,按钮上、背景里,能塞的地方都塞。

劣质生成器不知为何特别爱用紫色

紫色垃圾

彩虹呕吐

AI 喜欢用毫无意义、只是不同的颜色。一屏杂七杂八不搭的颜色,只因字段区分需要。它不遵守 70-30-10 规则,到处加颜色。

颜色垃圾

脉冲徽章

不知为何(大概是训练数据里有),它给所有东西加脉冲徽章。

脉冲垃圾

我大学应用那次“升级”里,数字 ID 有个脉冲徽章标着“active”。问题是,它从不变为不活跃;若不活跃应用直接登出,这信息纯属多余。

活跃垃圾

我的资料还有个“active student”徽章。谁能告诉我非活跃学生长啥样?

活跃垃圾2

同一数字 ID 界面,它还在校徽旁加了个“verified”小徽章。为啥?它又不是真调接口验证。即便验证了也没意义:要是伪造 ID,我会特意标“unverified”吗?

验证垃圾

指甲卡片

我在每个 vibe-coded UI 里都见这玩意儿,烦透了。

指甲垃圾

到处都是,倒不是难看,只是被每个 LLM 过度使用导致现在看着就糟。我觉得从没人正经想过“加个指甲能改善这”。

Emoji 垃圾

AI 不知为何超爱 emoji,比 Sam Altman 假装他们在前沿 pacing 还爱。

对齐错乱

如果有 SVG、ASCII 艺术或不在盒子里的元素,几乎总会对不齐。比如我大学应用课表里的列表。

对齐垃圾

字体选择

这些网站字体选择无聊,通常是 Inter;稍沾编程就用 JetBrains Mono。而且这样:

字体垃圾

每当提到技术相关,它就加“//”。

因聊天上下文产生的冗余文本

它因聊天上下文加一堆冗余文本。比如我做博客站时说不想写 HTML,要用 Neovim 写,它偏加“Built with Hugo. Written from Neovim”——没人在乎我从哪写。README 里也这样,写“Built with Modern CPP 20 features”。大学应用启动屏就有:

冗余垃圾

从这能嗅出触发它的提示。像“one campus. one app.”,肯定是某管理层说“咱们三个分院三个应用,统一一下”。

玻璃拟态

它钟爱玻璃拟态,不怎么用别的设计语言(除 brutalism,而那种全都一个样)。

玻璃垃圾

这是“brutalist 美学”:

野蛮主义

我得承认 brutalism 我能接受,挺酷,直到用滥了开始惹人烦。

通用标语与不必要的炒作

它痴迷“Elevate”“Seamless”“Next-Generation”“Supercharge”“Unleash”“Empower”。每个 H1 后跟灰 subtitle:“Experience the power of task management with our cutting-edge intuitive interface.” 爱用“Welcome to your Dashboard, [Name] ✨”或“Revolutionise your workflow”,把每个屏幕当落地页而非工具。

评论

社区对“AI slop”标签分歧明显:多数人认为所列视觉与文案特征多是既有低质设计或糟糕提示词所致,并非 AI 原罪;少数人视原帖为精英主义主观品味,或主张用户根本不在乎审美。

认为许多被指为 AI slop 的特征并非 AI 独有

  • 人类设计师早用类似布局模式(除满屏 emoji),等宽字体等也会触发 slop 感;AI 前就有懒编码 react slop;丑陋 UI 在训练数据里本就充斥,原博主作品集也被指 slop vibes 却非 AI。(较多人)
  • > 许多被归为 AI slop 的设计模式其实真实人类设计师已用良久,就像有人误以为破折号必是 AI 生成。(@ronbenton)

反对将“slop”等同于 AI,认为它只表示低质量工艺

  • slop 意指低质量差工艺,不论制作者;坏就是坏,不需找 AI 痕迹;人易犯人错、机易犯机错,但低质就是低质。(较多人)
  • > 烂就是烂,slop 只意味着低质量差工艺,不管谁或什么做的,没必要专门找 AI 痕迹。(@pdpi)

认为原帖更多是精英主义主观品味而非反 AI

  • 作者不介意 AI UI,只是不符合其另类品味,像无真苏格兰人论证;文章未质疑 AI 本身,只挑剔不合其趣味。(少数人)
  • > 这听起来更像一种“无真苏格兰人”式的精英主义论调,而非对 AI 用于 UI 的控诉。(@avaer)

认为 slop 源于提示词草率和人工审查缺失,可通过明确指令避免

  • 多数 slop 来自“建个网站”式粗糙提示;指定调色板、禁止某字体即可消除;模型给设计上下文后表现好,当前 slop 是懒惰不反映模型质量;应像对工具一样果断说“不”。(较多人)
  • > 只要在提示词里写“永不使用衬线字体”就能避免滥用了,你被鼓励对模型挑剔。(@minimaxir)

认为用户根本不在乎是否“slop”,可用且文案不烂就行

  • Bootstrap 时代起精致 UI 光环就褪了;妖魔化 slop ai 没抓住重点,绝大多数人只看能否导航、文案不糟糕。(少数人)
  • > 大众才不在乎它是 slop ai 还是手工精制 UI,只要能导航、文案不糟糕就够了。(@ookblah)

认为当前 AI 瑕疵是阶段性问题,将随模型改进消失

  • 类似“AI 不会画手”,终将解决;新模型已过时某些特征,给定上下文后模型变好。(少数人)
  • > 这些毛病有多少只是当下的“AI 不会画手”,迟早会被解决?(@cainxinth)

认为 AI 已能生成干净界面,人类为求区分反而搞怪

  • 进入 AI 创建干净信息界面阶段,人类想差异化就做“有趣”却不可读设计,如故意乱字体。(少数人)
  • > 我们正进入 AI 产出干净界面的阶段,人类为显不同反而弄出不可读的“有趣”设计。(@ModernMech)

认为精确描述 slop 特征反而帮助模型进步

  • 明确描述烂处给前沿实验室清晰强化学习目标,虽不反对发帖。(少数人)
  • > 每次有人精准定义 AI slop 烂在哪,前沿实验室就得到更明确的优化目标。(@anothermathbozo)

认为 AI 作为工具能让非设计师产出满意设计

  • 非设计师花时间精力借助 AI 可做出以前做不到的好设计,过程有趣。(少数人)
  • > AI 只是工具,作为非设计师我发现深入研究设计很有趣,也能做出满意作品。(@yakkomajuri)

有价值的补充

  • 遗漏的 slop 特征:过度使用全大写、随机小大写标题、中间点(·)滥用、图标(不仅 emoji)泛溢、聊天气泡上下文泄漏进文案(如“3 campuses, one app”)、过度描述性文本缺乏视觉层次、轮播与滚动劫持等。
  • 文案烂可经工作流缓解:让模型先将用户可见文本写入翻译或 Markdown 文件,人工编辑后再编码;视觉样式仍多需手调间距按钮。
  • 大公司亦难幸免:Cloudflare 等巨头落地页被指仍很 sloppy,说明非独个人开发者问题。