十年匠心定制 · 商业建站与技术教学双线并行 咨询热线:400-886-1026 service@lmnt.cn
ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

别让 AI 再产出模板页面:Taste-Skill 前端设计技能 3 条命令装好调好

别让 AI 再产出模板页面:Taste-Skill 前端设计技能 3 条命令装好调好 别让 AI 再产出模板页面Taste-Skill 前端设计技能 3 条命令装好调好【免费下载链接】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 味你肯定受够了。Taste-Skill 就是给 AI 代理用的前端设计技能包装一次AI 出的页面就有布局、排版和动效的纪律不再是套模板。它面向用 AI 写前端的人不绑框架Codex、Cursor、Claude Code 这类代理都能用。装上之后AI 拿到的是什么这节帮你判断装了这个和白装的差别。Taste-Skill 的核心是一组可移植的 SKILL.md 文件每个文件都是一套完整设计规则AI 动手写代码前必须先输出一句设计判断这是什么页面、给谁看、什么气质再定下面要讲的三个参数最后过一遍发布前检查清单。规则里明令禁止一堆 AI 通病——紫调渐变、hero 里挂假版本号、Scroll to explore 滚动提示、把每个列表行都加上下边框。装完之后输出会从能用变成有品。三种方式把它拿到手 这节解决技能怎么塞给 AI的问题三条路径按你的习惯选。最省事的是一键装齐命令会自动扫描仓库 skills/ 目录下的所有技能npx skills add https://gitcode.com/GitHub_Trending/ta/taste-skill只要其中一个时用 --skill 指定安装名。默认技能的安装名是 design-taste-frontend注意它不是文件夹名 taste-skill——安装名以 SKILL.md 文件头frontmatter里的 name: 字段为准npx skills add https://gitcode.com/GitHub_Trending/ta/taste-skill --skill design-taste-frontend也可以完全不装随便挑一个 skills/ 目录下的 SKILL.md把内容拷进项目或直接粘进对话里效果一样。仓库拉到本地后根目录的 skill.sh 是个查找小脚本敲source ./skill.sh taste-skill就会打印该技能 SKILL.md 的相对路径方便你直接打开看source ./skill.sh taste-skill按场景挑一个技能这节帮你避免全装了、不知道用哪个。实际用不到全量设计类技能管写页面taste-skill 是最稳的默认gpt-taste 是给 GPT/Codex 的更严变体出图类技能只产设计参考图不写代码imagegen-frontend-web 出网站稿、imagegen-frontend-mobile 出移动端界面、brandkit 出品牌套件redesign-skill 专治旧项目先审计现有 UI 再修布局、间距和层级还有几个风格件soft-skill 偏高端质感、minimalist-skill 是 Notion/Linear 那种克制感、brutalist-skill 走工业粗野风另外 output-skill 就干一件事——治 AI 写一半断尾、用占位注释糊弄的问题。想省事的话image-to-code-skill 把生成参考图 → 分析 → 写代码串成一条流水线。按场景拧三个旋钮 ️这节解决为什么出来的效果不对。默认技能 v2 在文件开头放了三个 1-10 的旋钮布局实验度、动效强度、每屏信息密度。不用改文件直接在对话里说就行比如密度低一点、动效拉满。下面是几个常见场景可以直接抄的值场景DESIGN_VARIANCEMOTION_INTENSITYVISUAL_DENSITYSaaS 落地页764创意机构网站983个人作品集873信任型服务政务/受监管行业325默认值是 8 / 6 / 4。而且技能本身带读需求这一步你说出极简、Apple 风、实验性这类气质词它自己就会推断出一套合理的数值所以多数时候你只需要把想要的场景说清楚。装完先验证这三件事这节帮你快速确认装好了并处理两个最高频的坑。验证生效直接让 AI 按 Taste-Skill 规则写个落地页看它有没有先输出一句设计判断、页面里有没有三张等宽卡加紫渐变。有判断、没模板脸就是装上了。技能不生效九成是安装名没对上。核对传给 --skill 的值是不是 frontmatter 里的 name: 字段比如 design-taste-frontend而不是文件夹名或你随手编的。想锁旧版本当前默认的 design-taste-frontend 是 v2 实验版重跑同一条安装命令就是原地升级脚本不用动如果你的流程依赖原版行为装 design-taste-frontend-v1那是完整保留的 v1。去装一个让 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辅助生成(AIGC),仅供参考
返回列表