ARTICLE DETAIL

建站实战干货

来自一线的建站与推广经验沉淀,每一条都经过真实交付验证。

让 AI 写的页面不再像 AI 写的:Taste-Skill 设计品味技能快速上手

2026/8/29 15:38:29 拓冰建站 浏览量
让 AI 写的页面不再像 AI 写的:Taste-Skill 设计品味技能快速上手 让 AI 写的页面不再像 AI 写的Taste-Skill 设计品味技能快速上手【免费下载链接】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 写落地页十次有九次是同一副面孔居中大标题、三张等宽卡片、紫蓝光效。Taste-Skill 干的就是破解这件事的事它用一份可移植的 SKILL.md 技能文件给编码代理注入一整套前端设计品味规则让产出在布局、排版、配色上明显接近真实设计师的作品。 上手篇三步装好第一页就能判断效果克隆仓库git clone https://gitcode.com/gh_mirrors/ta/taste-skill挑技能。skills/ 目录下每个子目录是一个独立技能默认用 taste-skill建议从这里开始。让代理读到它。把对应的 SKILL.md 复制进项目或整段粘进 ChatGPT/Codex 对话。环境支持 npx skills CLI 的话npx skills add 仓库地址一次装全加--skill design-taste-frontend只装单个。然后给一句给花艺工作室写个落地页看首屏布局是不是还是居中三板斧、三张等宽卡片还在不在。这两个问题的答案就是技能起没起作用的判据。⚖️ 价值对照装之前和装之后差在哪AI 的默认行为装上 Taste-Skill 之后居中 Hero标题副标题按钮一竖排左右分栏、不对称留白区块之间布局会变化三张等宽特性卡片是标配卡片只留给需要层级的内容更多用分隔线和负空间紫蓝光效、高饱和强调色全页最多一个强调色饱和度压在 80% 以下Inter 模板化字体明确指定展示字体与正文字体层级有规则动效要么满屏要么没有只在承担意义处加动效并尊重系统减少动效设置差别不在更好看而在不像模板两个页面并排看你不会一眼认出哪个是 AI 生成的。️ 机制篇三个旋钮两种技能默认技能文件顶部有三个 1-10 档的旋钮代理会先读需求再定值你也可以在提示词里直接给。1. DESIGN_VARIANCE布局变化1-312 列对称网格、均等内边距稳但保守4-7负边距重叠、图片比例混搭、左对齐标题8-10瀑布流、分数网格、大面积留白区2. MOTION_INTENSITY动效强度1-3只有 hover/active 状态无自动动画4-70.3 秒过渡 级联入场只动 transform 和透明度8-10滚动触发视差、滚动劫持走 GSAP ScrollTrigger3. VISUAL_DENSITY视觉密度1-3画廊模式区块间大留白空旷但显贵4-7常规 Web 应用间距8-10驾驶舱模式小内边距、1px 分隔线、数字等宽字体4. 两种技能两种产出实现类技能输出代码图像生成类技能只出参考图网页、移动端、品牌套件给下一轮写码当依据。完整清单见 技能列表。 选型篇按场景挑技能你的需求推荐技能新做落地页/作品集风格未定taste-skill默认用 GPT/Codex想要更严规则和更多动效gpt-tasteskill已有设计图想变成代码image-to-code-skill已有项目只改 UI 不重写redesign-skill风格已定要锁某种画风minimalist-skill / soft-skill / brutalist-skill只要设计图网页、移动、品牌板imagegen-frontend-web / imagegen-frontend-mobile / brandkit❓ 常见问题QReact、Vue、Svelte 都能用吗能。规则针对设计意图不绑定某个框架 API代码示例偏 React Tailwind规则本身可平移到任何框架。QSKILL.md 是什么文件代理能自动加载的可移植指令文件用 npx skills add 安装或直接复制进仓库、粘进对话。Q图像生成技能也走同一命令安装吗是。它们和代码技能同在 skills/ 目录同一套 CLI 能发现。Q默认技能行为变了怎么办默认 taste-skill 现在是 v2实验版原 v1 保留在 taste-skill-v1 里差异见 更新日志。如果你经常让 AI 写页面或受够了生成界面的模板味这套技能值得一试先用默认 taste-skill三个旋钮各给 3-5 分起步跑出第一页后再逐个调。【免费下载链接】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),仅供参考