代码萌新充电站
2026/9/13 23:54:15 网站建设 项目流程

AI 编程工具很火,但是你发现它生成出来的页面都一样。

使用几回之后便会发觉, 同一提示词于各异的工具之中所呈现的结果, 版式以及配色皆大致相同。

你让 AI 给你写一个落地页。

几分钟后就会给你一个“挺好看”的页面:

紫蓝色渐变的hero,居中大标题,三张等宽功能卡。

很干净,颜色搭配也很好。但看多之后就会觉得它太AI了。

最近发现了一个开源项目来解决这个问题。

它叫 ,是一套反AI味道的设计规则集合。

已经有 21000 多个 Star。

01 开源项目简介

这是一种具备设计规范性质的skill, 它能够被直接安装进诸如Code、Codex这类工具里面。

安装完成之后, 径直朝着AI讲“制作一个页面”。在人工智能采取行动之前, 它会被相关的规则集合所接管。

能够自动开展宏观结构的挑选, 进行主题的套用, 实现页面的生成, 并且实施57个质量方面的检查。

全部都通过了之后再给你。

02 用实际例子来演示一下

像举例来说, 我要去做一个东西, 这个东西与工具落地页相关。该工具的名字是, 它是专门针对SRE以及平台工程师而设计的。

我想要的是:技术感、专业性,还能说明它是干嘛的。

装上 。我打开 Code,输入:

为能生成一个落地页, 这指的是一个可用于分布式系统的追踪工具, 这个工具是面向SRE以及平台工程师来使用的, 并且这个落地页还要具备技术感。

它思考片刻后。

提出三个问题来澄清:对象、目的、语气。

我给出答案之后,它选择了这个宏观结构。

然后又添加了主题。

页面生成以后, 要去运行57个slop - test闸门, 所有闸门都通过了, 之后才把HTML以及CSS交给我。

页面出现了, 它显得很整齐, 每一处的排版, 都呈现出比较合理的样子, 一眼看去, 就能够知道, 其并非是经由随便拼凑而得来的。

还给 CSS 注释加了本次使用的宏结构标签,方便后面检查。

03 几个核心功能

① 57 个 slop-test 闸门

在生成一个页面以前, 要先去跑57个质量检查, 只要挂掉一个, 就得重新开始来做。

把被称作“AI味”的事物分成六个不同方面来考量 , 这六个方面分别是哲学 , 层级 , 执行 , 具体性 , 限制性 , 多样性 , 并且在此基础上 , 每个轴线上都存在着8到12个二元判断。

比如“卡片高度都一样”挂,“字体都用Inter”挂。

AI 会把模板化的部分给去掉。

② 21 个宏观结构

内置 21 种整页骨架可以选。

有的排版规则是Bento Grid, 有的排版规则是Hero, 有的排版规则是Long、、Stat-Led, 有的排版规则是Quote-Led、、Index-First……等等, 存在各种各样的排版规则。

有两个需求, 它们是不同的, 由这两个不同需求所产生的页面, 其宏观结构并非相同, 所以, 进而得出的结果, 也不会过分相似, 或者是完全一样的。

③ 四个动词

不仅可以创建新页面,还可以审核老代码、修改指纹、学习设计。

build 创建新的页面。它会打分并列出AI味反模式清单。

去除视觉结构, 留存文案以及 IA, 再度构建指纹。从截图或者 URL 里提取出设计 DNA, 输出.md 的是 study。

可是呢, 有人尝试讲过, 跟 skill 相同类型的事物, 最终都会汇聚到一种模样, 除非你把它描绘得极为细致。

这也许是它的不足之处。

④ 22个主题+自定义模式

已设置了二十二个, 关于“字体、颜色、排版”的三元组, 而且能够自行进行定义。

每一个主题都符合OKLCH色彩系统、字体搭配以及排版规范。

比如, Hum呈现出柔和且圆润的特质, 带有奶油或者铁锈的色泽, 还有衬线的样式。而与之相对的, 是锐利的技术感, 有着深蓝色的锚点, 以及mono的特质。

要是上述这些全都无法达成你需求的情形下, 便会实现自动切换, 进而生成一个临时的调色板, 以及完成一种字体配对。

⑤ 项目记忆(./log.json)

上一次生成的内容会记住,不能让两次长得一模一样。

每一次构建完毕之后, 于 ./log.json 文件范围内, 将宏观结构事项、主题相关内容、nav/ 这类信息, 全部都予以记录下来。

下一次build的时候先读取这个文件。

这样连续生成多个页面,它就不会用上一次的组合。

⑥ 用起来和其它 skill 一样

打开 Code 执行。

安装完。

不需要做其它的设置,直接说出自己想要的东西就可以了。

04 写在最后

有人声称它将AI味给治好了, 然而, 也存在其他人持有这样的看法, 即它仅仅是换了另外一种表述方式, 实际上并没有产生实质性的改变。

分场景来看。

若是仅仅只是想要一个落地页这情况, 那么呢, 会是能够帮你把模板感给去掉的。

如果要的是完全个性化设计的话,那它可能还是不够。

另外, 有人曾进行过吐槽, 与之相类似的技能, 到最终的时候, 都会趋向于收敛到一种特定的状态, 除非你将其书写得极为详细。

这也许是一个问题。

但是现在来看还是很实用的。

有需要的朋友可以试试。

需要专业的网站建设服务?

联系我们获取免费的网站建设咨询和方案报价,让我们帮助您实现业务目标

立即咨询