# 官方设计四件：假抱怨逼出二道工序 ## 概述 本期是本栏第7轮同赛道横评，对象选了一个此前没人横向比过的赛道：官方示例插件架上的四件「管好看」的Skill——canvas-design（海报画布）、algorithmic-art（生成艺术）、theme-factory（主题皮肤）、brand-guidelines（品牌规范）。四件同仓同源，回答的却是同一道题的四种解法：怎么让Agent产出「好看」的东西。逐份读完SKILL.md后最大的发现不在功能，而在写法：官方把「审美」这件最虚的事，拆成了宣言、模板、目录、色板四种可执行的工程结构，其中canvas-design甚至内置了一句「假装用户已经嫌你不够完美」的咒语，逼Agent自动多做一轮精修。本文逐件拆到SKILL.md的段落级，文末给出可抄写的写法模式清单。 ## 先看全景：同一层货架，四种卖法 四件Skill都在官方的example-skills插件包里，同仓同源，共享同一个仓库的星数，没有各自独立的Star可查——所以本文的「社区活跃度」维度按官方维护程度统一记分，并在表中注明这一局限。这个赛道的选择逻辑很简单：四件的触发场景高度重叠（用户说「给我做张海报」「把这个deck弄好看点」「画点有艺术感的东西」，都可能命中其中任何一件），但四份SKILL.md给出的工程路线几乎零重合： - **canvas-design**：先写一份「美学运动宣言」，再照着宣言画一张海报（PNG/PDF）； - **algorithmic-art**：先写一份「算法美学宣言」，再照着宣言写一个p5.js生成艺术程序（自包含HTML）； - **theme-factory**：不创作，只批发——十套命名好的配色字体主题，让用户看着样张挑； - **brand-guidelines**：不创作也不批发，只发规范——把官方自己的色板和字体规则交给Agent执行。 一个是老师，一个是工程师，一个是售货员，一个是门卫。下面逐件拆。 ## 评测对比表 | 维度（权重） | canvas-design | algorithmic-art | theme-factory | brand-guidelines | |---|---|---|---|---| | 功能完整度 25% | ★★★★ | ★★★★ | ★★★★ | ★★★ | | 设计质量 25% | ★★★★★ | ★★★★★ | ★★★★ | ★★★★ | | 实战效果 20% | ★★★★ | ★★★★ | ★★★★ | ★★★ | | 上手难度 15% | ★★★ | ★★★ | ★★★★★ | ★★★★★ | | 社区活跃度 15%* | ★★★★ | ★★★★ | ★★★★ | ★★★★ | *四件同仓同源，无独立星数可查，此项按官方维护程度统一记分，不构成个体差异依据。 ## 逐件拆解 ### canvas-design：教审美的老师，还藏着一句假抱怨 **定位**：把一句模糊需求变成一张「博物馆级」的单页视觉作品。SKILL.md开宗明义只允许三种输出：.md、.pdf、.png。 **工作流是两阶段的**。第一遍不画图，先写一份「设计哲学」——给一个艺术运动命名（SKILL.md自己举的例子：「Brutalist Joy」「Chromatic Silence」「Metabolist Dreams」），然后写四到六段宣言，说清这套美学如何落在空间、色彩、构图、节奏上。第二遍由Agent拿着这份宣言去作画，成品要求「90%视觉设计，10%必要文字」。 两处写法值得所有Skill作者抄走。第一是**工艺咒语**：SKILL.md用加重语气要求宣言里必须反复强调成品要像「顶尖高手耗费无数小时精心打磨」（原文反复出现meticulously crafted、painstaking attention、master-level execution），这是用提示词直接对抗AI出图的廉价感。第二更妙——文末有一段「FINAL STEP」，开头的原文是： > **IMPORTANT**: The user ALREADY said "It isn't perfect enough. It must be pristine, a masterpiece if craftsmanship…" 用户根本没说过这句话。这是SKILL.md替用户预设的一句假抱怨，作用是强制Agent交稿前自动再做一轮精修，且明确规定精修方向是「不加新图形，只把已有的东西磨得更利落」。一份提示词文件，内置了一道质检工序，这是本期四件里最狠的一笔设计。 另有小机关： SKILL.md要求动笔前先从需求里「推断一个隐晦的概念梗」，原文的比喻是「像爵士乐手引用另一首歌——懂的人会心一笑，不懂的人也觉得好听」；字体不许凭空捏造，必须从随包的canvas-fonts目录里选；支持多页模式，把单页当作「还没写满的咖啡桌画册」。 **短板**：流程长、判断主观，出片质量方差大；对只想快速出图的人，两遍宣言成本偏高。 ### algorithmic-art：教算法的工程师，模板管到行级 **定位**：产出「活的」生成艺术——不是一张图，而是一个带参数面板的单文件HTML，浏览器打开就能玩，种子一样，输出就一样。 **骨架和canvas-design是孪生的**：同样是先写四到六段「算法美学宣言」并给运动命名（例：「Organic Turbulence」「Quantum Harmonics」「Recursive Whispers」），同样反复念工艺咒语，同样要求埋一个隐晦的概念梗，同样强调「90%算法生成，10%必要参数」——连百分比都和兄弟件对齐。可以说官方用同一套骨架造了两件，只换了执行端：一个落笔成图，一个落笔成码。 但它的工程约束比canvas-design严一个量级。开篇就是「STEP 0：先读模板」：必须先读随包的templates/viewer.html，以它为「字面起点而非灵感来源」，文件里用注释划清了哪些是FIXED（页面布局、侧栏结构、种子导航的上一个/下一个/随机/跳转按钮、重新生成/重置/下载PNG按钮）哪些是VARIABLE（p5.js算法本体、参数定义、参数滑杆）。写法上明确禁止从零造HTML、禁止自创配色和暗色主题。 参数设计那段是全文最值得抄的一课：不要问「用哪种图案」，要问「这个系统有哪些性质需要可调」——数量、尺度、概率、比例、角度、阈值。种子用Art Blocks式的可复现随机（randomSeed加noiseSeed），同一颗种子永远产出同一张图；页面自带种子导航，用户可以在种子空间里自己淘 variation，SKILL.md把这个比喻成「同一块版子印出的系列版画」。 **短板**：赛道窄，只服务p5.js生成艺术；模板约束带来一致性，也封死了自定义UI的空间。 ### theme-factory：售货员，先看样张再付钱 **定位**：四件里最不像「创作」的一件——它不生成任何视觉，只做主题的搬运：给已有的幻灯片或artifact套皮。 SKILL.md本体短小，是一个典型的**索引型写法**：正文只登记十套主题的名字和一句话人设（Ocean Depths、Sunset Boulevard、Forest Canopy、Modern Minimalist、Golden Hour、Arctic Frost、Desert Rose、Tech Innovation、Botanical Garden、Midnight Galaxy），真正的色值和字体搭配全在themes/目录的各自文件里，用到哪套读哪套——渐进披露的标准姿势。 它的灵魂在**四步强制流程**：第一步，把随包的theme-showcase.pdf原样展示给用户看（SKILL.md特意加了一句「不许对它做任何修改，只许展示」）；第二步，问用户选哪套；第三步，**等用户明确确认**；第四步才动手套用。在四件里唯一一个把「停下来等人拍板」写进主流程的——前两件是放Agent去创作，这一件是先收钱再发货，宁可多一轮往返，不许套错主题。 还有兜底设计：十套都不合适时，允许按用户给的描述现场生成一套自定义主题，起一个同样风格的名字，先给用户过目再套用。 **短板**：只换皮，不救内容；十套主题之外的审美全部依赖兜底流程。 ### brand-guidelines：门卫，只认色板不认灵感 **定位**：四件里体量最小的一件，本质是一份机读的品牌手册——而且是Anthropic自家的：别人装了它，主要价值是拿来当「品牌规范类Skill怎么写」的模板抄。 内容是精确到色号的硬规范：主色四个（Dark `#141413`、Light `#faf9f5`、Mid Gray `#b0aea5`、Light Gray `#e8e6dc`），点缀色三个（橙`#d97757`、蓝`#6a9bcc`、绿`#788c5d`）；字体两套——标题用Poppins、正文用Lora，并规定了回退链（Poppins缺失退Arial，Lora缺失退Georgia，不装字体也能跑）。 写法上有两个可圈点处。一是**分界线思维**：规则不给模糊描述，给可执行判据——「24pt及以上的标题用Poppins」「非文字形状的点缀色按橙、蓝、绿轮换」，Agent照做即可，无需理解「品牌感觉」。二是**显式触发词**：SKILL.md开头直接列了一行Keywords（branding、corporate identity、visual identity……），四件里唯一一个不靠描述语义、直接报关键词触发的——这是解决「触发不命中」最笨但最稳的写法。落地侧绑定python-pptx的RGBColor，说明它的主战场是给已生成的PPT做品牌化后处理。 **短板**：色板字体锁死在Anthropic自家品牌上，泛用性天然受限。 ## 两种打开方式（图解） 第一张图：同一个需求进门，四件Skill怎么分流。 ```mermaid flowchart TD A["手里有件活要变好看"] --> B{"想要什么产物"} B -->|可交互的画| C["algorithmic-art"] B -->|一页海报封面| D["canvas-design"] B -->|旧稿换皮肤| E["theme-factory"] B -->|守住品牌色| F["brand-guidelines"] C --> C1["交出单文件HTML"] D --> D1["交出PNG或PDF"] E --> E1["十套主题直接套"] F --> F1["色板字体全锁定"] ``` 第二张图：canvas-design的流水线——注意第四步，那道工序是SKILL.md替用户「谎报」出来的。 ```mermaid flowchart TD A["一句模糊需求"] --> B["第一遍 写美学宣言"] B --> C["给运动命名 写四到六段"] C --> D["第二遍 照宣言作画"] D --> E["隐藏工序 假抱怨触发精修"] E --> F["交付宣言加成图"] ``` ## 四件共用的六个写法模式 本期横评的真正产出，是给想自己写SKILL.md的读者一份可抄清单： 1. **两阶段解耦，宣言即合同**。canvas-design和algorithmic-art都把「定方向」和「执行」拆成两遍，第一遍产出的宣言文档就是第二遍的风格合同，Agent自己和自己签。 2. **工艺咒语对抗AI味**。两件创作类都在SKILL.md里硬性要求文本中反复出现「大师级、磨了无数小时」级别的措辞——不是写给用户看的，是写给下一遍的Agent看的自我暗示。 3. **固定与变量分区**。algorithmic-art用模板注释把UX骨架钉死、只留算法区可写，换来所有产出品交互一致。Skill作者都该问自己：我的产出里哪些该锁死？ 4. **资产随包**。字体目录（canvas-fonts）、viewer模板、主题样张PDF、主题定义文件——SKILL.md只是清单，真本事在随包资源里，用到才读。 5. **强制检查点**。theme-factory把「展示—询问—等待确认」写死在流程里，宁多一轮往返不返工。高风险或主观性强的产出，都值得抄这招。 6. **判据优先于感觉**。brand-guidelines全程给色号、字号分界线、回退链、轮换规则，没有一句「要有品牌感」。规则写到机器可执行，Skill才算写完。 另外别忘了那个阴暗的小发明：canvas-design的假抱怨二道工序。它证明SKILL.md不只能「描述」行为，还能「虚构对话状态」来诱导行为——这是提示词工程里相当激进的用法，抄之前先想清楚是否愿意对自己的用户撒这个谎。 ## 推荐排行榜 - **要快、要稳、要省心**：theme-factory——看样张、点菜、收货，全程一分钟。 - **要作品、要能发朋友圈的图**：canvas-design——上限最高，方差也最大。 - **要能玩、能分享、能二次调参的活东西**：algorithmic-art——单文件HTML即开即玩，种子可复现。 - **要全组产出不跑偏**：brand-guidelines——前提是你的品牌恰好是（或愿意借用）这套色板字体。 - **想学写SKILL.md，抄谁**：先抄algorithmic-art（模板分区），再抄brand-guidelines（显式触发词），然后是theme-factory（检查点），最后挑战canvas-design（工艺咒语与假抱怨）。 ## 安装命令 四件同属官方示例插件包，一次安装全部到手，在Claude Code里执行： ``` /plugin marketplace add anthropics/skills /plugin install example-skills@anthropic-agent-skills ``` 若只想用其中一件，也可以克隆仓库后把对应技能目录整个拷进 `~/.claude/skills/`： ```bash git clone https://github.com/anthropics/skills # 将 skills/canvas-design 等对应目录拷入 ~/.claude/skills/ ``` ## 参考来源 1. [anthropics/skills：四件Skill的上游官方仓库](https://github.com/anthropics/skills) — 官方示例技能架，canvas-design、algorithmic-art、theme-factory、brand-guidelines 均随 example-skills 插件包分发，本文全部引文核验自该包内四份SKILL.md原文及随包资源（canvas-fonts、themes/、theme-showcase.pdf、templates/viewer.html） 2. example-skills插件包内四份SKILL.md原文 — 本文一手分析材料，段落级引用均出自原文 3. theme-showcase.pdf与themes/目录 — theme-factory的十套主题名录与「先看后选」流程的载体 4. templates/viewer.html与generator_template.js — algorithmic-art的固定/变量分区写法的实物证据 > [!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 等场景全覆盖。