1实现原理 · 为什么它能做到
反 slop 完全靠 prompt 编排实现:skill 目录只有单文件 SKILL.md(87,253 字节 / 1206 行 markdown),没有任何脚本或数据文件;规则以『硬性禁令 + 计数阈值 + 自检清单』形式让 agent 在输出前自我过滤。
[taste-skill]="skills/taste-skill/SKILL.md"
先『读 brief』再套规则:三拨盘(DESIGN_VARIANCE/MOTION_INTENSITY/VISUAL_DENSITY)作为贯穿全文的全局伪变量,基线 8/6/4,一切版式/动效/密度决定都由它门控,规则只在该变量语境下生效。
**Baseline:** `8 / 6 / 4`. Use these unless the design read overrides them. Do not ask the user to edit this file - overrides happen conversationally.
反 slop 规则是可操作的『AI Tells 黑名单』:把 LLM 生成物的高频破绽逐一列成可识别签名(em-dash、eyebrow 计数、三卡均分、分屏 header、纯色版本脚注等),并配可数阈值,多数带明确的 override 路径。
**Em-dash (`—`) is COMPLETELY banned.** It is the LLM's signature stylistic crutch and it is the #1 visual Tell in production tests. There is no "limited use" allowance, no "natural language frequency" allowance, no "in body copy is fine" allowance. None.
强制终检矩阵:§14 PRE-FLIGHT CHECK 提供 50+ 个勾选盒覆盖此前所有规则,输出前必须逐项自检,任何一项打不了勾即『not done』。
Run this matrix before outputting code. This is the last filter. **THIS IS NOT OPTIONAL. Run every box. If any box fails, the output is not done.**
提供『复制即用』的代码骨架与真实安装命令,防止 agent 靠记忆写错库:§5.A/B/C 内联 GSAP/Motion 的 TSX canonical skeleton,附录 A 给各设计系统真实 install 命令,附录 B 给官方文档链接。
The sections below are vendored reference content. They give the agent real install commands, real canonical doc links, and real working starter snippets for each design system named in Section 2. Use them to ground decisions in production reality, not training-data fiction.
跨项目轮换机制对抗『模型先验复用』:字体、premium 调色板都规定不得在连续项目里重复使用同一套,强制多样化。
**Palette-rotation rule:** if the previous premium-consumer project you generated used the beige+brass family, this one MUST use a different family. Do not ship the same warm-craft palette twice in a row.
2核心能力
3外部依赖
| 类型 | 依赖 |
|---|---|
| cli | npx shadcn@latest |
| cli | npm install / yarn add(设计系统安装指令) |
| package | 设计系统:@fluentui/react-components、@material/web、@carbon/react、@primer/css、@radix-ui/themes、govuk-frontend、uswds、bootstrap、@atlaskit/* |
| package | 动效库:motion(motion/react)、gsap、three.js |
| package | 图标库:@phosphor-icons/react、hugeicons-react、@radix-ui/react-icons、@tabler/icons-react(lucide 降级) |
| network | 素材源(写进生成页面):picsum.photos 占位摄影 / cdn.simpleicons.org 品牌 logo / unsplash、pexels(若明确允许) |
| network | Polaris Web Components CDN script(仅 Shopify app 场景,写入生成页面 head) |
| tool | 图像生成工具(条件式):generate_image / MCP image tool / IDE-integrated gen / OpenAI image tools——仅在宿主环境可用时 |
| network | 官方文档链接(仅参考不抓取):github.com、developer.mozilla.org、各设计系统官网、developer.apple.com 等 50+ 条 |
4风险提醒 风险提醒:绿色 · 放心使用
- 全部约束靠模型自我遵从,无程序化执行 — 文档自己承认 'The agent has historically ignored em-dash limits when phrased as "use sparingly"'(§9.G)——弱模型或长输出场景下禁令可能漏执行;无 lint/校验兜底
- 87KB/1206 行单文件是巨量上下文载荷 — 每次触发都需完整载入,短上下文或高成本模型下可能被截断/降采样,规则库后半段(§10-14、附录)可能失读
- 诱导产物含第三方 CDN 外链 — 生成页面会按规则引用 cdn.simpleicons.org、picsum.photos,Shopify 场景插 cdn.shopify.com <script>;产物页有外网运行时依赖与可用性风险
- Block Library 尚不存在,词表 > 实现 — §10 列 30+ 模式名,§12 承诺的实现目录在本 commit 为空——agent 只能靠词表名自行实现,无逐模式校验基准
- 硬编码技术代际建议会随生态漂移 — 如 'Tailwind v4'、'motion/react'(原 framer-motion)、禁止 lucide 等断言有有效期;§3.F 依赖校验能缓解但版本性指令(如 v4 配置写法)可能过时
5第二遍独立确认
- [ok] 『无脚本、单文件』 — git ls-tree 确认 skills/taste-skill/ 下仅 SKILL.md;仓库根 skill.sh 只是 SKILL.md 路径注册表,非 skill 运行代码
- [ok] 『无网络外发』 — 全量提取 55 个 http(s) URL,全部为官方文档链接或写给生成页面的素材/CDN 源;SKILL.md 内无 fetch/axios/curl/wget
- [ok] 『无凭证读取』 — 全文唯一命中 api-key 的是 Polaris 模板中的 <meta name="shopify-api-key" content="%SHOPIFY_API_KEY%" /> 占位符,写入的是用户页面;无 env/keychain/密钥读取指令
- [ok] 『安装命令仅文字指示』 — npm/npx/yarn 只出现在 Appendix A 代码块与 §2.A 表格,作为给 agent 的安装提示;npx shadcn 为官方初始化器
- [discrepancy] §12 引用的 blocks/ 目录 — SKILL.md 内唯一内部路径引用 skills/taste-skill/blocks/(§12.A)在本 commit 不存在;正文已自述 'Blocks will be added iteratively',属未兑现契约而非缺陷
- [ok] em-dash 自洽性(正文宣称全禁却含 em-dash) — 全文仅 5 个 —,均为禁令规则演示文本;git log 339afcb 证实 'purge em-dashes throughout (177 -> 6)',与声明一致
- [ok] 『strict pre-flight check』是否夸大 — §14 确实给出 50+ 勾选盒矩阵并声明 'THIS IS NOT OPTIONAL';但它是认知自检而非程序化校验——文档未声称有自动化,无夸大
- [ok] 『real design systems when applicable』是否夸大 — §2.A 表 + Appendix B 官方文档 + Appendix A 真实安装命令俱全;Appendix C 主动声明 Apple Liquid Glass 无官方 web 实现,诚实度高于多数同类 skill
6结论
ccbc15639c