Taste-Skill 上手实测：3个调节旋钮加一纸禁令，让AI生成的界面彻底告别“AI脸“

Taste-Skill 上手实测3个调节旋钮加一纸禁令让AI生成的界面彻底告别AI脸【免费下载链接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill你在 Cursor 里敲下帮我做一个 SaaS 着陆页30 秒后回车得到的几乎一定是同一种脸紫色渐变背景、居中三张等宽卡片、玻璃拟态按钮、右上角一行V0.6小字。这不是某个同事的作品这是今天 90% 的 AI 生成页面的标准长相社区给它起了个很准的名字——AI slopAI 垃圾。Taste-Skill 就是专门来治这个病的。一句话定位这是一个反 AI 味的 AI 前端技能框架Agent Skills给 ChatGPT、Cursor、Claude Code 装上审美滤镜让生成的着陆页、作品集、改版网站不再像同一个模板印出来的。项目当前默认技能已升级到v2experimental是一次推翻重写的重大迭代旧的 v1 版本则作为独立技能完整保留。 30秒速览它到底值不值得装核心能力解决的问题适用人群三大调节旋钮1-10AI 输出千篇一律想精确控制设计风格的开发者需求推理与设计系统映射AI 无视需求自嗨、乱造山寨设计系统有明确甲方的落地项目反 AI 味禁令清单破折号、版本标签、假截图等细节污染追求专业质感、要交付用户的团队改版审计协议改版顺手改坏 URL 和导航接手现有项目的重构场景图像生成技能先出图、后写码的流程缺失ChatGPT Images 加编码 Agent 的组合用户️ 核心能力拆解从拧旋钮到读房间第一步拧旋钮3 个 1-10 的调节器这是最容易理解、也最出效果的一层。DESIGN_VARIANCE布局变异度、MOTION_INTENSITY动效强度、VISUAL_DENSITY视觉密度三个参数从 1 到 10 控制输出风格1 是完美对称10 是艺术性混乱。想要干净的居中版拉到低值想要不对称的现代设计拉高变异度。项目内置了预设矩阵主流 SaaS 着陆页直接套7/6/4公共部门服务网站用3/2/5强调可信度。划重点这三个旋钮不是摆设后续所有布局、动效、密度规则都由它们把关。第二步读懂房间需求推理系统v2 新增的第 0 节要求 AI在写任何代码之前先声明一行设计解读。它会先分析页面类型、用户语气词、参考链接、受众群体和已有品牌资产再输出一句类似这是一个面向技术采购者的 B2B SaaS 着陆页走 Linear 式极简语言的结论。如果需求真拿不准只允许问一个澄清问题。这一步直击病根多数 AI 页面难看是因为它跳过了需求直接套上自己的默认审美。第三步对味的设计系统映射过去让 AI做个微软风格的应用它多半会自己捏一个四不像。v2 把需求对应到真实设计系统微软企业应用推荐 Fluent UIGoogle 风格用 Material 3GitHub 系开发工具用 Primer公共部门网站直接指到 GOV.UK 或 USWDS。遇到玻璃拟态、粗野主义这类美学风格而非组件库也要求如实标注是 web 标准实现而不是假装有官方包。第四步一纸禁令清掉AI 味如果前面是怎么设计才对这一层就是哪些绝对不能出现。v2 里最狠的一条全页禁止使用破折号—标题、正文、按钮、alt 文本统统不行这是测试中违反率最高的 AI 特征。此外还有一连串硬禁令禁止V0.6、BETA版本标签禁止Scroll滚动提示禁止装饰性图片说明禁止浮动右上角副标题禁止用 div 拼装假产品截图。同时锁定全局只用一个强调色、每页只用一套圆角系统每个 CTA 按钮都要过 WCAG AA 对比度检查。第五步动效、暗色与改版的硬规则动效统一用 Motion原 Framer Motion 更名后的包并给出 GSAP 粘性堆叠、水平平移的标准代码骨架明确禁止window.addEventListener(scroll)这类低效写法高强度动效强制支持减少动效模式。暗色模式从可选变成默认必须明暗双模式都要有完整令牌系统并保证对比度一致。改版项目则先做 UI 审计再按绿场 / 保留 / 彻底改造三档走协议URL 结构、导航标签这些核心元素绝不允许被悄悄改掉。第六步图像生成技能先看图再写码仓库还带了三个只出图不出码的技能imagegen-frontend-web网页参考图、imagegen-frontend-mobile移动端、brandkit品牌工具包。把它们附加到 ChatGPT 图像生成器里先生成整站参考帧再交给编码 Agent 实现就是完整的图到分析到编码流水线。像 Floria 这种多区块页面每个区块都能单独出一张横图方向对不上时改图比改代码便宜得多。️ 新手最容易踩的 3 个坑坑 1把 SKILL.md 当一次性提示词。错误示范把技能文字复制进一次对话用完就丢。正确做法用npx skills add装进项目或把SKILL.md放进仓库让 Agent 每次自动加载技能的价值在于反复生效。坑 2旋钮永远用默认值。错误示范8/6/4跑到底所有页面长一个样。正确做法先让 AI 声明设计解读再据此覆盖旋钮。公共部门网站用3/2/5创意作品集用9/8/3参数本身就是设计决策。坑 3只装一个万能技能。错误示范装完默认技能就当完事。正确做法改版场景加装redesign-skill图像工作流用image-to-code-skillAI 老截断输出就加output-skill。全套 13 个技能各管一件事组合使用才是完整姿势。✅ 现在就上手5 步行动清单拉取仓库git clone https://gitcode.com/GitHub_Trending/ta/taste-skill安装默认技能design-taste-frontendv2或把skills/taste-skill/SKILL.md直接复制进项目给 AI 一条带明确受众和参考信号的 brief要求它先输出一行设计解读按场景套用预设旋钮比如 SaaS 着陆页用7/6/4交付前让它逐项过一遍预飞行检查清单重点看对比度、暗色模式和重复布局最后说句实在话好的设计不该看起来像 AI 生成的而该看起来像专业设计师的作品。Taste-Skill 提供的就是这道分界线。现在轮到你的 Agent 跨过去了。【免费下载链接】taste-skillTaste-Skill - gives your AI good taste. stops the AI from generating boring, generic slop项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考