本期是 Skills 生态拆解第 7 轮，做同赛道对比横评。选题落在一个此前从未拆过的赛道：视觉产出。对象是 Anthropic 官方示例技能包（example-skills）里的四件套——frontend-design、canvas-design、theme-factory、brand-guidelines。它们出自同一个仓库、同一个作者团队、同一条「让 Claude 产出视觉物」的赛道，但四个 SKILL.md 的写法完全不同：一份是纯条款的「审美宪法」，一份是两段式流水线还内置强制返工，一份是素材册加点单门禁，一份是精确到色值的品牌参数表。本文全部内容基于本机插件缓存中对四个 SKILL.md 的逐段实读，不掺二手转述。核心发现一句话：同一赛道可以共存四个技能，前提是描述层把「产物类型」划清了边界——这四份文件恰好是四种可复用的 SKILL.md 写作范式。
| 维度（权重） | frontend-design | canvas-design | theme-factory | brand-guidelines |
|---|---|---|---|---|
| 功能完整度（25%） | ★★★★★ | ★★★★ | ★★★☆ | ★★★ |
| 设计质量（25%） | ★★★★★ | ★★★★★ | ★★★★ | ★★★★ |
| 实战效果（20%） | ★★★★★ | ★★★★ | ★★★★ | ★★★☆ |
| 上手难度（15%） | ★★★★★ | ★★★★ | ★★★★★ | ★★★★★ |
| 社区活跃度（15%） | ★★★★☆ | ★★★★ | ★★★☆ | ★★★☆ |
| 加权总分 | 4.9 | 4.3 | 4.0 | 3.7 |
说明：四件同属官方示例包，更新节奏随主仓库统一，社区活跃度按公开讨论热度做定性判断，未做精确数据核验；其余维度依据实读内容评定。
定位是「做出有辨识度、可上生产的前端界面」，一句话点出行业痛点：avoid generic "AI slop" aesthetics——别再产出一眼 AI 味的页面。它没有任何脚本、没有任何附属资产，整份 SKILL.md 就是给模型上的一道审美宪法：写代码前先做 Design Thinking，选定一个极端的美学方向（brutalist、editorial、luxury、retro-futuristic……），然后用五个章节约束执行——字体、配色、动效、空间构图、背景细节。最有价值的是两条负面清单：一条禁用 Inter、Roboto、Arial 和「白底紫渐变」这类俗套；另一条更狠——「NEVER converge on common choices (Space Grotesk, for example) across generations」，连模型自己最爱用的安全牌 Space Grotesk 都点名封杀，防止它每次生成趋同。短板几乎没有，唯一要适应的是它的「主见」：如果你就是想要 Inter，必须在提示词里显式指定，否则它会替你做冒险的选择。
这是四件里工序设计最精致的一个。它把一次设计任务拆成两个交付物：先写一份「设计哲学宣言」（.md）——给这个虚构的艺术运动起名（示例里有 Brutalist Joy、Chromatic Silence 这种味道），写 4-6 段空间、色彩、构图的主张；第二步再拿着宣言去画布上产出 .pdf 或 .png。中间还藏了一个彩蛋环节叫 Deducing the Subtle Reference：把用户的主题处理成「内行才看得出的暗梗」，原文的比喻是爵士乐手引用另一首歌——懂的人会心一笑，不懂的人也觉得构图漂亮。两处写法堪称教科书：一是反复向「下一个 Claude」强调 craftsmanship，要求成品看起来像顶级高手熬了无数小时；二是在 FINAL STEP 里直接预埋了一句「用户已经说了：It isn't perfect enough. It must be pristine」——把二刷打磨写成了必经工序，不依赖用户真的去挑剔。代价是工序长、产物限定在 png/pdf，赶时间或想要网页代码的别用它。
定位最克制：它不生成设计，只做「换肤」。内置 10 套现成主题（Ocean Depths、Midnight Galaxy、Desert Rose……），每套含色板 hex 码和标题/正文字体对，存放在 themes/ 目录按需读取，另附一份 theme-showcase.pdf 作为可视化的菜单。它的 SKILL.md 最大的特点是把交互顺序写成了硬性门禁：先展示 showcase 给用户看，再询问选哪套，然后「等待用户明确确认」，最后才动手套用——四件里唯一一个把「停下来等用户」写成流程的。还有一条逃生通道：十套都不合适时，按同样规格现造一套新主题给你过目。短板在功能边界：只管视觉一致性，不管内容和布局质量，deck 本身烂它救不了；另外它面向 presentation slide decks 的场景描述，也让它基本退出其他赛道的路由。
名字容易误导：它不是通用工具，而是 Anthropic 自家品牌规范的技能化——精确到 hex 的色值（主色 #141413/#faf9f5，强调色橙 #d97757、蓝 #6a9bcc、绿 #788c5d）、字体对 Poppins 配 Lora、字号阈值（24pt 以上标题用 Poppins）、以及完整的回退链（缺字体时退 Arial/Georgia）。技术上依托 python-pptx 的 RGBColor 做精确上色。它是四件里唯一显式写触发关键词的——开头一行 Keywords: branding, corporate identity, visual identity…，其余三件全靠描述隐式路由。单件实用价值一般（你多半不想让自己的文档一身 Anthropic 味），但它是一间样板间：想知道「怎么把一套品牌规范翻译成机器可执行的 SKILL.md」，抄它的结构最省事——色值表、字体回退、应用规则三段式，换成你家 VI 就是你的品牌技能。
把四份文件并排放，真正的价值才显出来。它们其实是四种可复用的写法范式：
| 技能 | 写法范式 | 附属资产 | 交互模式 | 产物 |
|---|---|---|---|---|
| frontend-design | 审美宪法（纯条款） | 无 | 一把梭直出 | 可运行前端代码 |
| canvas-design | 两段流水线 + 强制二刷 | canvas-fonts/ 字体目录 | 一次交付三件套 | 宣言 .md + 成品 .pdf/.png |
| theme-factory | 素材册 + 点单门禁 | showcase.pdf + themes/×10 | 展示→等确认→套用 | 套肤后的 deck |
| brand-guidelines | 品牌参数表 | 无（依托 python-pptx） | 直接应用 | 品牌化文档 |
范式一：宪法式。 frontend-design 证明了一个反直觉的事实——不配任何脚本和素材，只靠条款密度也能造出最强技能。它的条款全是「负面清单 + 反趋同」结构：不告诉你该做什么，而是把模型的所有惯性路径逐一点名封死。适合「输出质量取决于品味」的任务。
范式二：流水线式。 canvas-design 的核心技巧是「把中间产物显式化」：先让模型写一份给自己的设计哲学，再让它执行。等于把一次生成拆成两次思考，中间产物还能给用户审。FINAL STEP 里预埋「用户已不满意」更是神来之笔——它利用了指令的既成事实感，模型读到「用户已经说了不完美」时，返工不再是可选项而是既定流程。
范式三：门禁式。 theme-factory 解决的是「选择权归属」。当技能自带一个素材库，最糟的体验是模型擅自挑一套就开干。它把「展示菜单 → 问 → 等确认 → 执行」写成四步硬流程，把 SKU 型技能的用户体验一次定型。凡是内置素材库的技能都该学这一手。
范式四：参数表式。 brand-guidelines 展示了最低门槛的写法：一份数值精确的规范（hex、pt、fallback 链）就是一份合格 SKILL.md。它还是唯一写 Keywords 行的样本——在描述层之外又加了一层显式触发词保险。
同赛道共存不打架的秘密也在描述层：四个描述各自锁死了产物类型——frontend-design 交付「可运行的界面代码」，canvas-design 只出 md/pdf/png，theme-factory 只提 presentation slide decks，brand-guidelines 只认品牌词。用户说「做张海报」「做个落地页」「给 deck 换肤」「按品牌规范排」，各走各的门，互不抢活。
flowchart TD
A["用户提出视觉需求"] --> B{产物是什么}
B -->|可运行的界面代码| C["frontend-design"]
B -->|单页海报或画布作品| D["canvas-design"]
B -->|给幻灯片换主题| E["theme-factory"]
B -->|按品牌规范排版| F["brand-guidelines"]
C --> G["HTML React Vue 代码"]
D --> H["哲学宣言 md 加成品 pdf/png"]
E --> I["10 套主题色板加字体对"]
F --> J["Anthropic 品牌参数表"]
canvas-design 的内部流水线单独看一眼：
flowchart LR
A["一句模糊需求"] --> B["写设计哲学宣言 md"]
B --> C["推敲隐性梗"]
C --> D["按宣言产出画布"]
D --> E["预埋终审：假定已被告知不完美"]
E --> F["二刷打磨后交付"]
四件套同属官方示例技能包 example-skills，随包附带。两种装法：
# 方式一：插件面板（推荐）
# 在 Claude Code 会话中执行 /plugin，打开插件面板
# 搜索 example-skills（Anthropic 官方示例技能包）一键安装，四件套全部到位
# 方式二：手动安装任意单件
git clone https://github.com/anthropics/skills
mkdir -p ~/.claude/skills
# 在仓库内找到对应技能目录（如 skills/frontend-design），整目录复制：
cp -r skills/frontend-design ~/.claude/skills/
装完在会话里直接说「做一个 XX 落地页」「给这份 deck 换个主题」「按 Anthropic 品牌规范排一份 PPT」即可触发对应技能。
按使用频率排：frontend-design > theme-factory > canvas-design > brand-guidelines。按「值得逐行精读」排：canvas-design > frontend-design > theme-factory > brand-guidelines——两个榜单顺序相反，这本身就是本期最有意思的发现：最常用的和最值得学的，往往不是同一件。
[!tip] 51学通信知识星球 星主：爱卫生（微信：gprshome201101）——公众号「51学通信」创办者，19 年通信行业运维与讲师经验，著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书（各大电商平台有售）。 星球定位：深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域，主打运维岗位与信令分析。 当前规模：5200 篇主题 / 990 个回答，198 元/年。 加入福利：加入星球后请加爱卫生微信，拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题，另有群内分享。 AI 加持：51学通信知识星球已作为 skill 接入 WorkBuddy，使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例，做总结、找文档和 PPT 等场景全覆盖。