Taste-Skill 新版升级:把“设计品味“装进 AI 智能体
Taste-Skill 新版升级把设计品味装进 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让 AI 帮你写前端页面却总带着一股挥之不去的AI味紫色渐变、居中布局、三张等宽卡片几乎成了 AI 生成网页的出厂设置。开源项目Taste-Skill专治这个问题它把专业设计师的审美准则写成了 AI 智能体可以直接读取的规则文件让生成结果不再像同一个模板印出来的。最近它的默认技能完成了一次大版本升级思路比之前硬核得多值得每个和 AI 打交道的开发者看一眼。一条命令装好给 AI Agent 加一套审美规则Taste-Skill 的核心载体是 SKILL.md——一种便携的指令文件Claude Code、Cursor、Codex 等工具都能自动加载。安装整个技能包只需要一条命令npx skills add https://gitcode.com/GitHub_Trending/ta/taste-skill只想装最核心的设计品味技能就加个参数npx skills add https://gitcode.com/GitHub_Trending/ta/taste-skill --skill design-taste-frontend这次的升级对老用户特别友好安装名没变重新跑一遍命令就能原地升级如果你依赖旧版的确切行为design-taste-frontend-v1依然可以单独锁定安装。技能本身框架无关React、Vue、Svelte 项目都能用规则针对的是设计意图而不是某个框架的 API。新版第一步先读懂需求再决定长什么样旧版最大的问题是 AI 经常不看需求就开写——你只说了一句做个极简的它就直接套默认模板。新版在写任何代码之前强制要求先输出一句设计解读Design Read比如Reading this as: B2B SaaS landing for technical buyers, with a Linear-style minimalist language, leaning toward Tailwind utilities Geist restrained motion.翻译过来就是我把这个项目读作面向技术采购者的 B2B SaaS 落地页极简语言倾向 Tailwind 工具类加克制动效。看起来只是一句话背后却是整套推理流程页面类型、用户的语气词、参考链接、目标受众、已有的品牌资产全都要先过一遍。更实用的是设计系统映射。用户说想要微软风格就接官方 Fluent UI说 Google 味就用 Material 3做开发者工具用 Primer CSS公共服务网站直接上 GOV.UK Frontend。规则明确要求用官方包不许手搓一套看起来像的山寨版——这一步对落地质量的影响比想象中大得多。三个旋钮把设计风格从 1 调到 10Taste-Skill 最独特的机制是三个可调旋钮每个范围都是 1 到 10DESIGN_VARIANCE设计变异度1 是完美对称10 是艺术性混乱MOTION_INTENSITY动效强度1 是完全静态10 是电影级物理效果VISUAL_DENSITY视觉密度1 是画廊般空旷10 是驾驶舱般密集新版的基线是 8/6/4并且内置了一张场景预设表你不用自己摸索使用场景VARIANCEMOTIONDENSITYSaaS 产品落地页764创意机构作品集983公共部门服务网站325值得注意的细节是旋钮的值会反过来约束后续所有布局、动效和密度决策。选错了参数AI 在后面的每一个环节都会跟着跑偏调对了整套页面风格就能保持一致。被拉黑的AI 标志破折号、版本徽章、滚动提示为什么一眼就知道这页面是 AI 做的——因为到处是破折号—、hero 区挂着V0.6 BETA徽章、底部一排Scroll ↓的滚动提示。这些被开发团队称作 AI TellsAI 露馅点这次升级把它们写进了禁令清单。规则之细有点出乎意料整页禁止出现一个破折号要用连字符或改写句子替代禁止装饰性图片说明文字禁止浮动右上角副标题列表超过五项就不能用ul加分割线偷懒得换成卡片、轮播或标签页。颜色和圆角也上了锁——全页只能有一个强调色、一套圆角体系。另外还有一条布局多样性红线一个八区块的页面必须使用至少四种不同的布局家族从根上杜绝三个等宽卡片的复制粘贴感。这些规则不是拍脑袋定的。项目仓库里专门有research/目录记录了关于训练数据偏差、RLHF 与算力约束、认知捷径等方向的研究笔记禁令背后是有数据支撑的。动效、暗色、性能细节标准全面收紧新版把技术栈也统一了。动画库固定用Motion原 Framer Motion 更名后的包并附上 GSAP 粘性堆叠、水平平移的标准代码骨架window.addEventListener(scroll)这类低效写法被直接禁用高强度动画强制提供prefers-reduced-motion降级。暗色模式从可选项变成了必选项明暗两套颜色令牌都要定义对比度和层次结构必须对齐。图标按 Phosphor、HugeIcons、Radix、Tabler 的优先级选手绘 SVG 图标被禁。交付前的预飞行检查更是把标准量化了每个 CTA 按钮必须通过 WCAG AA 对比度核心网页指标对齐 LCP 2.5s、INP 200ms、CLS 0.1移动端适配和字体方案逐项核对全过了才允许交付。和能用就行相比这套标准显然要苛刻得多。60 秒快速上手从安装到第一次生成装好技能后直接给 AI 发一段提示词比如遵循 design-taste-frontend 技能。先输出 Design Read 再按旋钮 VARIANCE7, MOTION6, DENSITY4 为一个叫 Flowly 的 SaaS 产品做一个暗色落地页 全页只用一个强调色生成后逐项跑预飞行检查清单。AI 会先声明它对项目的理解再动手。如果想走先看图、再写码的流程项目还提供了imagegen-frontend-web、imagegen-frontend-mobile、brandkit三个图像生成技能配合 ChatGPT 图像生成出参考帧再交给 Codex、Cursor 或 Claude Code 落地实现。谁适合用三个典型人群独立开发者一个人干全栈的活前端审美没人把关这套规则相当于白捡一个资深设计审稿人。产品设计师用 AI 快速出多版方案给客户选旋钮机制能稳定复现同一种风格不会每版都长不一样。前端团队新版本把设计规范写进了工具链成员用 AI 生成的代码也能自动对齐团队的设计基线。开源路上现在能做什么官方明确说了当前版本是实验性预发布还在向稳定的 v2.0.0 收敛未来会补充更多设计系统映射和更聪明的需求推理。因为遵循 MIT 协议你可以直接克隆仓库查看全部 SKILL.md 和研究笔记git clone https://gitcode.com/GitHub_Trending/ta/taste-skill如果你也受够了 AI 生成页面的模板脸不妨今晚就装上试试——跑一条命令让下一个项目从一眼 AI变成像设计师做的。用过的朋友欢迎把反馈提给项目方顺手给仓库点个 star就是对这个开源项目最直接的支持。【免费下载链接】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),仅供参考