同一个团队AI 做出来的页面却像三家外包一份共享规则让编码助手不再各画各的【免费下载链接】taste-skillAgent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill你有没有见过这种场面。同一个项目组三个人三款 AI 编程工具。小李用 Cursor小王用 Claude Code老张用 Codex。同一个需求“给咱们的新产品做个官网首页”。半天后三份稿子摆在桌上一份紫色渐变配三张并排卡片一份深色背景加霓虹发光按钮还有一份米黄色加陶土色的“文艺风”。单看都不算丑放一起就像三家不相干的外包公司分别交的活。更麻烦的是下周换个人接着改画风又变了。最近在 GitHub 上被讨论得很热的开源项目taste-skill正好提供了一种很实在的解决思路把“什么好看、什么难看、做完怎么自查”写成一份共享的规则文件让团队里所有编码助手都读同一本手册。它的做法很简单也很巧。一、先说明白这东西不是让你换工具先澄清一个常见误会。taste-skill 不是新的 AI 编程工具也不是设计软件它不生成组件、不接管你的编辑器。它是一份写给 AI 看的“设计施工规范”。打个比方你请了三位装修师傅手艺都不差但一个爱贴大理石、一个爱装水晶灯、一个爱做工业风。你不能指望他们自己商量出统一风格得给他们一份图纸和验收标准。taste-skill 就是那份图纸和验收标准。它的核心就是一个文件夹里面最关键的是一份说明文件。AI 工具读到这份说明就知道接到需求先干什么、从哪些设计方向里挑、哪些“AI 味”的做法一律不许用、做完之后要打开浏览器自己检查一遍。而且它不挑框架。React、Vue、Svelte、纯 HTML 都行因为规则管的是审美和流程不是代码写法。二、一份规则怎么让不同工具都认这是整个项目最值得团队借鉴的地方。Claude Code 有自己的技能目录Codex 也有自己的Cursor 又是另一套读取方式。听着像要维护三份副本其实不用。因为这份规则本质上是纯文本的说明书谁都能读。仓库给了几条不同的“送达方式”有的工具通过官方插件市场一键安装规则会挂在自己的命名空间下不会跟你原有的技能打架有的工具用一条安装命令把整个文件夹拷进对应的技能目录仓库里还提供了一个安装脚本它不复制文件而是在技能目录里建一个“快捷方式”直接指向你 clone 下来的那个仓库。这个细节特别关键。复制文件的话规则改了你得挨个通知同事重新装一遍。用快捷方式的话仓库一更新同事在本地拉一下代码规则就原地生效了——不用重装、不用重启一堆配置。对团队来说这就把“审美规范”变成了一个可以被 git 管理的普通项目。三、规则里到底写了些什么不讲代码只讲它管的三件事你就能感受到差别。第一件先搞清楚“你这家店有什么特别的”再动手。很多人用 AI 做页面提示词就一句“做个咖啡店官网”。AI 只能给你咖啡杯、咖啡豆、棕色背景——因为这是它见过最多的组合。taste-skill 要求 AI 开工前先列清单名字有什么含义、开在哪条街、店里几个座位、有什么别人没有的规矩、几点开门。这些东西才是页面的“原材料”。项目作者放出的对照案例特别能说明问题。德国有家咖啡店店主姓 Bohne德语里就是“豆子”的意思店是父亲带着两个儿子开的。装上这套规则后AI 把“一大两小、三颗豆子”做成了整页反复出现的图形连照片都裁进豆子的轮廓里。没装规则的那一版是巨大店名、蓝底白字、四周一圈细线——标准模板脸。第二件给“AI 味”列一张黑名单。这部分写得非常具体具体到有点好笑紫色渐变、发光按钮、卡片下面的柔和阴影、标题上方那个小号大写字母标签、等宽字体的装饰小字、01/02/03 的序号、一排三张等宽功能卡片、米黄配陶土色的“伪文艺风”……全部在禁止或警告之列。它的判断依据来自对 247 个精选设计站点的观察不是拍脑袋。更妙的是这张黑名单是带日期的。因为今天的“高级感”明天就会变成新的模板。三年前大家嫌紫色渐变土于是集体转向米黄加陶土色结果这个“解药”本身变成了最容易辨认的 AI 痕迹。所以清单必须像日历一样不停翻新。第三件做完不算完必须自己看一遍。这一步是很多团队的痛点。AI 写完代码说“完成了”你一打开标题挤成四行、文字压住图片、电脑上好好的按钮在手机上跑出屏幕。这些问题看代码根本看不出来。taste-skill 的做法是让 AI 启动真实浏览器按电脑、平板、手机三种宽度打开页面量字号、量边距、查溢出、查对比度然后截图存下来。AI 必须看这些截图挑出最严重的三个问题改掉最多改三轮。一句话总结它不相信“我觉得做好了”只相信“我看见了”。四、放到团队里它解决了三个真实的麻烦麻烦一新人入职审美靠口口相传。“咱们的页面别搞那么花”“按钮别用渐变”“标题别超过两行”——这些话以前靠老员工一遍遍说说漏了就出事。现在这些全写在规则文件里。新人第一天拉下仓库他的 AI 助手就自动按团队标准干活。规则变成了可交付的资产而不是某个人脑子里的经验。麻烦二版本混乱谁也不知道自己用的是哪一版。这个项目自己就在认真做版本管理更新日志按小版本记录当前是 2.1.5每次改了什么、修了哪个社区反馈的问题一条条写清楚。团队也可以照做规则仓库打上版本号重要项目在配置里锁定版本升级前先看更新日志。想尝鲜的用最新版要稳定的用固定版两边不打架。还有个特别真实的教训值得所有团队抄走。有一次发版规则文件开头的一段描述里有个冒号没加引号格式解析失败结果技能被工具静默丢弃了——不报错、不提示就是不生效。排查了半天才发现是这个原因。于是作者加了一条自动检查每次提交都验证规则文件的格式、名字是否重复、插件清单指向的文件是否真实存在。规则本身也要被测试这话听起来好笑但确实是团队协作的底层常识。麻烦三规则定完就烂在文档里。taste-skill 把它当“活文档”维护网站上出现了新的流行套路就补进黑名单社区反馈某条规则误伤了正常设计就改某条规则在真实项目里不好用就删。节奏大概是跟着版本走而不是“年初定一次年底没人看”。五、效果和代价都得实话实说社区里有几组实测数据比宣传语有说服力。一位开发者用同一个项目管理工具的官网做了对照不装规则27 分半完成花费约 5.64 美元装上之后36 分 19 秒花费约 17.58 美元。时间多了三成成本翻了三倍。这是必须接受的代价。它让 AI 多做几步查资料、挑方向、找真实图片、开浏览器自查、看截图返工。这些步骤都要烧 token。效果呢作者自己公布的盲测评测里最后一轮三个题目装规则赢了两个平均 7.7 分不装是 7.8 分。分数几乎没差别。但社区里另一位测试者的说法更实在他做的对照页面左边信息更集中、更快讲清楚产品有什么右边排版更大胆、更有品牌感他更喜欢右边但也承认“做得特别”和“让人一眼看懂”是两件都要顾的事。所以别指望它把 AI 从“能用”变成“惊艳”。它真正稳定的价值是让同一个团队、不同的人、不同的工具交出来的东西像一个团队做的。六、普通人或小团队门槛高不高不高但有几个前提。不需要显卡不需要申请任何 AI 接口密钥不用装一堆依赖。需要的是较新版本的运行环境和电脑上已有的 Chrome、Edge 或 Chromium 浏览器——因为它真的要靠浏览器去“看”页面。找配图时需要联网。对完全不想碰命令行的人作者还做了个桌面版应用把规则和设计助手打包成了可以直接下载的软件。适合谁三五人的小团队没有专职设计师但对外要脸面最需要统一标准接外包的工作室客户换、项目换风格不能每次都靠运气自媒体和独立开发者一个人也要产出像样的落地页、作品集、活动页大公司里的创新小组品牌规范已经有了把它翻译成 AI 能读的规则比每次口头叮嘱有效得多。不太适合谁如果你的品牌规范非常明确、非常强势那应该让品牌规范优先而不是让一套通用规则去覆盖它。项目作者自己也提醒这套规则有明确的主见用之前最好通读一遍确认不和现有技术栈、无障碍要求冲突。写在最后AI 编程工具越来越多团队里“人均一个助手”已经是常态。但工具越多产出的风格就越容易散。以前我们担心 AI 写得不对现在更该担心的是它每次都写得“对”但每次都不一样。taste-skill 提供的答案不复杂——把审美写成文件把文件放进仓库让所有工具读同一份像维护代码一样维护它。这件事的意义可能超出网页设计本身。当越来越多的“经验”“品味”“规范”可以被写成 AI 读得懂的文档团队真正要竞争的也许就不再是谁的提示词写得好而是谁更擅长把隐性的经验变成显性的、可共享的规则。你所在的团队现在是靠口头叮嘱统一风格还是已经有一份大家共用的规则文件了如果让你写第一条“绝对不许用”的规矩你会写什么【免费下载链接】taste-skillAgent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考 
长河君 · 2026/10/30 1:46:33 · 阅读 1.2k 同一个团队，AI 做出来的页面却像三家外包：一份共享规则让编码助手不再各画各的
同一个团队AI 做出来的页面却像三家外包一份共享规则让编码助手不再各画各的【免费下载链接】taste-skillAgent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill你有没有见过这种场面。同一个项目组三个人三款 AI 编程工具。小李用 Cursor小王用 Claude Code老张用 Codex。同一个需求“给咱们的新产品做个官网首页”。半天后三份稿子摆在桌上一份紫色渐变配三张并排卡片一份深色背景加霓虹发光按钮还有一份米黄色加陶土色的“文艺风”。单看都不算丑放一起就像三家不相干的外包公司分别交的活。更麻烦的是下周换个人接着改画风又变了。最近在 GitHub 上被讨论得很热的开源项目taste-skill正好提供了一种很实在的解决思路把“什么好看、什么难看、做完怎么自查”写成一份共享的规则文件让团队里所有编码助手都读同一本手册。它的做法很简单也很巧。一、先说明白这东西不是让你换工具先澄清一个常见误会。taste-skill 不是新的 AI 编程工具也不是设计软件它不生成组件、不接管你的编辑器。它是一份写给 AI 看的“设计施工规范”。打个比方你请了三位装修师傅手艺都不差但一个爱贴大理石、一个爱装水晶灯、一个爱做工业风。你不能指望他们自己商量出统一风格得给他们一份图纸和验收标准。taste-skill 就是那份图纸和验收标准。它的核心就是一个文件夹里面最关键的是一份说明文件。AI 工具读到这份说明就知道接到需求先干什么、从哪些设计方向里挑、哪些“AI 味”的做法一律不许用、做完之后要打开浏览器自己检查一遍。而且它不挑框架。React、Vue、Svelte、纯 HTML 都行因为规则管的是审美和流程不是代码写法。二、一份规则怎么让不同工具都认这是整个项目最值得团队借鉴的地方。Claude Code 有自己的技能目录Codex 也有自己的Cursor 又是另一套读取方式。听着像要维护三份副本其实不用。因为这份规则本质上是纯文本的说明书谁都能读。仓库给了几条不同的“送达方式”有的工具通过官方插件市场一键安装规则会挂在自己的命名空间下不会跟你原有的技能打架有的工具用一条安装命令把整个文件夹拷进对应的技能目录仓库里还提供了一个安装脚本它不复制文件而是在技能目录里建一个“快捷方式”直接指向你 clone 下来的那个仓库。这个细节特别关键。复制文件的话规则改了你得挨个通知同事重新装一遍。用快捷方式的话仓库一更新同事在本地拉一下代码规则就原地生效了——不用重装、不用重启一堆配置。对团队来说这就把“审美规范”变成了一个可以被 git 管理的普通项目。三、规则里到底写了些什么不讲代码只讲它管的三件事你就能感受到差别。第一件先搞清楚“你这家店有什么特别的”再动手。很多人用 AI 做页面提示词就一句“做个咖啡店官网”。AI 只能给你咖啡杯、咖啡豆、棕色背景——因为这是它见过最多的组合。taste-skill 要求 AI 开工前先列清单名字有什么含义、开在哪条街、店里几个座位、有什么别人没有的规矩、几点开门。这些东西才是页面的“原材料”。项目作者放出的对照案例特别能说明问题。德国有家咖啡店店主姓 Bohne德语里就是“豆子”的意思店是父亲带着两个儿子开的。装上这套规则后AI 把“一大两小、三颗豆子”做成了整页反复出现的图形连照片都裁进豆子的轮廓里。没装规则的那一版是巨大店名、蓝底白字、四周一圈细线——标准模板脸。第二件给“AI 味”列一张黑名单。这部分写得非常具体具体到有点好笑紫色渐变、发光按钮、卡片下面的柔和阴影、标题上方那个小号大写字母标签、等宽字体的装饰小字、01/02/03 的序号、一排三张等宽功能卡片、米黄配陶土色的“伪文艺风”……全部在禁止或警告之列。它的判断依据来自对 247 个精选设计站点的观察不是拍脑袋。更妙的是这张黑名单是带日期的。因为今天的“高级感”明天就会变成新的模板。三年前大家嫌紫色渐变土于是集体转向米黄加陶土色结果这个“解药”本身变成了最容易辨认的 AI 痕迹。所以清单必须像日历一样不停翻新。第三件做完不算完必须自己看一遍。这一步是很多团队的痛点。AI 写完代码说“完成了”你一打开标题挤成四行、文字压住图片、电脑上好好的按钮在手机上跑出屏幕。这些问题看代码根本看不出来。taste-skill 的做法是让 AI 启动真实浏览器按电脑、平板、手机三种宽度打开页面量字号、量边距、查溢出、查对比度然后截图存下来。AI 必须看这些截图挑出最严重的三个问题改掉最多改三轮。一句话总结它不相信“我觉得做好了”只相信“我看见了”。四、放到团队里它解决了三个真实的麻烦麻烦一新人入职审美靠口口相传。“咱们的页面别搞那么花”“按钮别用渐变”“标题别超过两行”——这些话以前靠老员工一遍遍说说漏了就出事。现在这些全写在规则文件里。新人第一天拉下仓库他的 AI 助手就自动按团队标准干活。规则变成了可交付的资产而不是某个人脑子里的经验。麻烦二版本混乱谁也不知道自己用的是哪一版。这个项目自己就在认真做版本管理更新日志按小版本记录当前是 2.1.5每次改了什么、修了哪个社区反馈的问题一条条写清楚。团队也可以照做规则仓库打上版本号重要项目在配置里锁定版本升级前先看更新日志。想尝鲜的用最新版要稳定的用固定版两边不打架。还有个特别真实的教训值得所有团队抄走。有一次发版规则文件开头的一段描述里有个冒号没加引号格式解析失败结果技能被工具静默丢弃了——不报错、不提示就是不生效。排查了半天才发现是这个原因。于是作者加了一条自动检查每次提交都验证规则文件的格式、名字是否重复、插件清单指向的文件是否真实存在。规则本身也要被测试这话听起来好笑但确实是团队协作的底层常识。麻烦三规则定完就烂在文档里。taste-skill 把它当“活文档”维护网站上出现了新的流行套路就补进黑名单社区反馈某条规则误伤了正常设计就改某条规则在真实项目里不好用就删。节奏大概是跟着版本走而不是“年初定一次年底没人看”。五、效果和代价都得实话实说社区里有几组实测数据比宣传语有说服力。一位开发者用同一个项目管理工具的官网做了对照不装规则27 分半完成花费约 5.64 美元装上之后36 分 19 秒花费约 17.58 美元。时间多了三成成本翻了三倍。这是必须接受的代价。它让 AI 多做几步查资料、挑方向、找真实图片、开浏览器自查、看截图返工。这些步骤都要烧 token。效果呢作者自己公布的盲测评测里最后一轮三个题目装规则赢了两个平均 7.7 分不装是 7.8 分。分数几乎没差别。但社区里另一位测试者的说法更实在他做的对照页面左边信息更集中、更快讲清楚产品有什么右边排版更大胆、更有品牌感他更喜欢右边但也承认“做得特别”和“让人一眼看懂”是两件都要顾的事。所以别指望它把 AI 从“能用”变成“惊艳”。它真正稳定的价值是让同一个团队、不同的人、不同的工具交出来的东西像一个团队做的。六、普通人或小团队门槛高不高不高但有几个前提。不需要显卡不需要申请任何 AI 接口密钥不用装一堆依赖。需要的是较新版本的运行环境和电脑上已有的 Chrome、Edge 或 Chromium 浏览器——因为它真的要靠浏览器去“看”页面。找配图时需要联网。对完全不想碰命令行的人作者还做了个桌面版应用把规则和设计助手打包成了可以直接下载的软件。适合谁三五人的小团队没有专职设计师但对外要脸面最需要统一标准接外包的工作室客户换、项目换风格不能每次都靠运气自媒体和独立开发者一个人也要产出像样的落地页、作品集、活动页大公司里的创新小组品牌规范已经有了把它翻译成 AI 能读的规则比每次口头叮嘱有效得多。不太适合谁如果你的品牌规范非常明确、非常强势那应该让品牌规范优先而不是让一套通用规则去覆盖它。项目作者自己也提醒这套规则有明确的主见用之前最好通读一遍确认不和现有技术栈、无障碍要求冲突。写在最后AI 编程工具越来越多团队里“人均一个助手”已经是常态。但工具越多产出的风格就越容易散。以前我们担心 AI 写得不对现在更该担心的是它每次都写得“对”但每次都不一样。taste-skill 提供的答案不复杂——把审美写成文件把文件放进仓库让所有工具读同一份像维护代码一样维护它。这件事的意义可能超出网页设计本身。当越来越多的“经验”“品味”“规范”可以被写成 AI 读得懂的文档团队真正要竞争的也许就不再是谁的提示词写得好而是谁更擅长把隐性的经验变成显性的、可共享的规则。你所在的团队现在是靠口头叮嘱统一风格还是已经有一份大家共用的规则文件了如果让你写第一条“绝对不许用”的规矩你会写什么【免费下载链接】taste-skillAgent skills that give coding agents taste: art direction, reference images and a browser check instead of generic AI pages项目地址: https://gitcode.com/GitHub_Trending/ta/taste-skill创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考