Show HN 投稿量翻了三倍，现在大多呈现相同的氛围编码外观

Source: Hacker News

在浏览 Hacker News 时，我注意到许多 Show HN 项目现在都有一种通用的、刻板的感觉，让我觉得它们纯粹是 AI 生成的。起初我说不清到底是什么原因，于是我想是否可以通过对 500 个 Show HN 页面进行 AI 设计模式评分，来自动量化这种主观感受。

Claude Code 导致 Show HN 项目数量大幅增长——增长幅度大到 HN 的版主不得不为新账户限制 Show HN 投稿。

以下是过去几年 Show HN 投稿的增长情况：

这应该为我们提供足够的页面来进行 AI 设计模式评分。

AI 设计模式

一位设计师最近跟我说，“彩色左边框几乎和破折号在文本中标识 AI 生成的设计一样可靠”，于是我开始在很多页面上注意到它们。询问其他设计师后，常见的 AI 模式大致可以归为字体、颜色、布局怪癖和 CSS 模式四类。

字体

• Inter 用于所有内容，尤其是居中的主标题
• 大语言模型倾向于使用特定的字体组合，如 Space Grotesk、Instrument Serif 和 Geist
• 在整体使用 Inter 的主标题中，用衬线斜体突出一个强调词

颜色

• “VibeCode 紫”
• 永久暗模式，正文使用中灰色文字，章节标签全部大写
• 暗色主题下正文对比度仅 barely 通过
• 一切使用渐变
• 大面积彩色光晕和彩色盒阴影

布局怪癖

• 使用通用无衬线字体的居中主标题
• 在主标题 H1 正上方放置徽章
• 卡片的顶部或左侧边缘带彩色边框
• 完全相同的功能卡，每张卡顶部都有图标
• 编号为 “1、2、3” 的步骤序列
• 统计横幅行
• 带有表情符号图标的侧边栏或导航
• 全部大写的标题和章节标签

CSS 模式

• shadcn/ui
• 玻璃拟态（Glassmorphism）

示例截图

徽章位于 Inter 主标题上方。

同样的布局，不同页面。

顶部彩色边框。

图标置顶的功能卡。

渐变背景 + 玻璃拟态卡片。

检测 Show HN 投稿中的 AI 设计

为了系统地对这些模式进行评分，我处理了最近的 500 篇 Show HN 投稿，并将它们的着陆页与上面的列表进行对比评估。

Scoring method

• 使用无头浏览器加载每个站点（Playwright）。
• 在页面内部运行一个小脚本，分析 DOM 并读取计算后的样式。
• 每个模式都是确定性的 CSS 或 DOM 检查；不进行截图，且 LLM 不会对其作出判断。

这种方法不可避免地会产生误报，但手动 QA 表明错误率大约在 5–10 % 左右。

如果有人有兴趣开源评分代码以复现（或改进）此过程，请告诉我。

结果

单一模式并不一定意味着网站是 AI 生成的，因此我们根据触发的 15 种模式的数量将网站分为三层：

• Heavy slop（5 + 模式）— 105 个站点 — 21 %
• Mild（2–4 模式）— 230 个站点 — 46 %
• Clean（0–1 模式）— 165 个站点 — 33 %

这算糟糕吗？其实并不——只是缺乏创意。验证商业想法从来不在于华丽的设计，在 AI 时代之前，一切看起来都像是 Bootstrap。自己打造设计与直接使用 LLM 输出的默认样式之间是有区别的，这就像在 LLM 之前使用 CSS/HTML 模板时的区别一样。

我猜人们最终会回归精心打造的美观设计，以在千篇一律中脱颖而出。另一方面，一旦 AI 代理成为网页的主要用户，设计究竟会有多重要仍然未知。

本文由人工撰写；评分和分析由 AI 辅助完成。