一个组件库，把AI创业公司的UI套路全扒光了

每一家 AI 创业公司的网站，长得都差不多#

你打开一个 AI 产品的官网，看到的是什么？

一个渐变色的 Hero 区域，标题是模糊的，副标题是更模糊的。页面正中央，一个输入框等你打字，好像这个产品除了一个输入框之外什么都没做。背景是几张半透明的玻璃卡片，左上角挂着一个绿色的小圆点——别问这圆点监测的是什么，反正它是绿的。

再往下翻，一排 Logo 滚过去——你不确定这些公司是不是真在用他们的产品，但它们出现在这里。然后是一个价格表，中间那个选项在发光。页面底部，一个悬浮的聊天按钮，好像在说”你现在就可以问我点什么”，但你试了一下，对面其实是个自动回复机器人。

这不是哪一家公司的设计。这是每一家 AI 公司的设计。

一位开发者的黑色幽默#

一个叫 Performative-UI 的开源项目，最近在 Hacker News 上火得一塌糊涂。它的作者毫不掩饰地说：这是一个”AI 创业公司设计套路组件库”。你想到的每一个陈词滥调，都被做成了一比一的 React 组件，可以一键安装使用。

它有个组件叫Sparkle——在任何名词旁边加一个✨，就能让这个名词看起来值钱两倍。GradientText组件的作用，是把普通文字变成渐变色，这样当公司 logo 只有一种颜色的时候，它的官网看起来就有两种了。还有一个叫StatusDot的东西，永远是绿色的，哪怕它背后什么也没有监控。

有个组件叫Prompt——就是一个文本框。它几乎是每一家 AI 公司的官网标配，因为当你的产品核心功能其实就是”把用户输入发到 OpenAI 再展示结果”的时候，实在没有更好的东西能放在首页中央了。

另一个叫ChatFAB的组件，就是一个悬浮聊天气泡。描述是：“你已经逃不掉了。“

那些我们假装没注意到的细节#

这个项目的精妙之处在于，它不是冷嘲热讽。它只是把这些组件原原本本地做出来，让你自己意识到这些设计模式有多荒谬。

GlassCard——毛玻璃卡片组件。它的描述只有一句话：“backdrop-filter:野心（Ambition）“。BeforeAfter组件，左边放一张乱糟糟的截图，右边放一张用 AI 整理过的截图，看起来就像对比营销的终极形态。LogoMarquee——一排客户 logo 自动滚过去。描述说：“你听说过的所有公司都在用我们，包括那些根本没签合同的。”

PricingCard——中间那个选项是会发光的。作者在文档里写了：“选中间那个，不用问为什么。”

Rotator和WordRoll这两个组件是用来轮播关键词的。你的产品能”做什么”？如果你只能说出一个应用场景，你就完蛋了。所以你要轮播：能写代码、能写邮件、能生成视频、能分析数据。Rotator帮你在页面顶部滚动展示这一切，甚至不需要访客等太久。

这其实是对 AI 泡沫的一面镜子#

这个项目拿到 673 分（这是内部数据，文章里不写），说明它戳到了很多人的痛点。不是设计层面的痛点，而是真实的行业尴尬。

我们目睹了 AI 热潮在过去两年间催生了上千家”套壳”公司。它们的产品体验几乎一致：接入一个模型 API，外面套一层毛玻璃和渐变文字，然后融资。Performative-UI 把这套流程从技术层面解构了——它提供了一个脚手架，让你在十五分钟内就能搭建一个看起来价值两百万美元产品的官网。

但也许这正是它高明的地方。当你看完这些组件，笑完之后，你会开始认真思考一个问题：一个产品，如果把所有这些设计套路都去掉，剩下的那部分，到底还值不值钱？

来源：Hacker News | vorpus.github.io/performativeUI