我常用的 Skill：美学设计系统HERMES & AGENT ENGINEERING · 课时 04

4.1 Kami 设计系统

Kami（紙）是一套约束式设计系统。它要解决的问题很直接：AI 生成的文档大多长得差不多——白底黑字，套个模板，换个字体，好看谈不上，丑也说不上，就是那种一眼能认出来的"AI 味"。

Kami 的做法是把一整套视觉规则写死，交给 AI 去执行。核心就几句话：

• 页面底色是暖色羊皮纸（#f5f4ed），不是纯白
• 强调色只有一种：墨蓝（#1B365D），不超过页面的 5%
• 中文用仓耳锦楷（TsangerJinKai02），一种书法级衬线字体
• 标题用 500 字重，正文用 400，不用合成粗体
• 行距分三档：标题紧凑（1.1-1.3）、正文舒适（1.5-1.55）

规则不多，但组合在一起的效果很好。它做出来的东西不像"AI 排的版"，更像是一个有设计品味的人手工排出来的。

4.2 它能做什么

Kami 支持 9 种文档类型，覆盖日常能想到的大部分场景：

除了文档，它还内置了 14 种 SVG 图表——架构图、流程图、柱状图、折线图、环形图、时间线、泳道图、维恩图等等。

4.3 理解原理

看起来 Kami 似乎能直接生成 PPT、PDF、图片等各种格式的文件。但实际上，Kami 生成的东西其实都是 HTML。 至于这个 HTML 拿来干嘛，完全由你决定。转 PDF 打印、当网页部署、直接作为网站的前端、浏览器全屏当幻灯片、截图发社交媒体，都行。

HTML 是中间产物，也是最终产物，它不像 Word 或 PPT 那样锁死在某个格式里。

AI 时代，最重要的两种媒介：Markdown 和 HTML，一个负责内容，一个负责样式，它们可以作为中间媒介转换成其他任何格式的文件。这里分享一个我制作资料的经验：

先用 Markdown 把内容写好，再把 Markdown 转成 HTML，文字就有了样式。最后，把 HTML 转成你需要的任何格式——PDF、PPT、Word，都行。以前我没有理解这一点的时候，直接拿 Markdown 去转 Word 或者 PPT，那简直是一场灾难，转出来的样式非常难看。后来想明白了，中间一定要经过 HTML 这一层，让样式先落地，再去做格式转换，出来的东西才像样。

4.4 实战演示：生成一份精美文档

下面用具体的例子走一遍完整流程。

我们准备了一份鲁迅《孔乙己》的解读文稿（Markdown 格式），用 Kami 把它变成一份排版精美的文档。

第一步：搜索

> 用 hermes skills search 帮我找一个 叫 Kami 的技能。

Hermes 会用内置命令搜索技能生态，返回匹配的技能列表：

第二步：安装

从搜索结果里找到 Kami，让 Hermes 安装：

> 安装 Kami 技能

装好之后不需要记任何命令，直接说需求就行。

第三步：说出需求

> 用 Kami 把这份《孔乙己》解读做成一份漂亮的 PDF 文档
> 这是一篇文学解读，面向普通读者
> 希望排版精致一些，适合阅读

Hermes 收到后不会马上动手。Kami 的设计是"先搞清楚再干活"，它会先确认几个关键信息：

第四步：生成

确认之后，Hermes 会规划结构、填充内容、生成 HTML，随后把 HTML 再输出为 PDF。

4.5 重要经验

实际使用 Kami 的过程中，你可能会遇到各种各样的问题。每个人的环境不一样——用的模型不同，操作系统有 Windows 有 Mac，字体环境也不同。再加上模型有时候会偷懒，不一定严格按照技能的规则去执行，出来的东西可能和你预期的有出入。

这很正常。遇到不符合要求的地方，直接告诉它改就行。

拿这次《孔乙己》解读来说，就出了两个问题。第一次，字体和样式完全没有按照 Kami 的指导来做，是模型自己编了一套。第二次，样式没问题了，但它没考虑到内容密度：有的 PDF 页面文字密密麻麻，有的页面只稀稀拉拉几行。告诉它之后，它才修改。

就这样一轮一轮改，改到满意为止。然后有一步非常重要：让它把整个过程沉淀成一个技能。

沉淀下来之后，它是这样回复的：

沉淀好了，新技能叫 kami-document-pdf。以后再做类似任务，
直接 skill_view(name='kami-document-pdf') 就能看到整套流程。

记进去的关键经验：

- 模板选择：根据内容长度选 long-doc / one-pager 等
- 布局决策：短章用流动排版，厚文档用强制分页
- 不动 CSS：复制模板，只改字体路径和内容
- 正文字号：长篇阅读提到 12pt
- PDF 渲染：macOS 上 WeasyPrint CJK 不可用，用 Chrome headless + --no-pdf-header-footer
- 验证：pdffonts 查字体嵌入，pdftotext 验文字，pdfinfo 看页数
- 双文件输出：保留 HTML 用于对比

这样做的好处是：下次你再让它做类似的文档，它就不会再犯同样的错误了。踩过的坑变成了经验，犯过的错不会再犯。这才是 Hermes 技能系统真正的威力——不只是用别人写的技能，而是把你自己的经验也变成技能。

4.6 再试一个：带图表的财报分析

Kami 真正厉害的地方不只是排版，而是能根据数据生成 SVG 图表——柱状图、饼图、折线图、环形图，一共 14 种。

我准备了一份苹果 2026 财年 Q2 的财报解读，里面全是数据表格：五大业务线营收、区域表现、毛利率对比。这些数据天然适合用图表来呈现。

这次的需求可以这样写：

> 选择合适的模板，用 Kami 把这份苹果财报解读做成一份研报
> 重点是里面的数据表格，都配上对应的 SVG 图表
> 图表类型由你自行决定

和上一个例子相比，这个用例展示了 Kami 的另一面：数据可视化能力。一份好的财报分析，光有文字是不够的，图表才是让数据说话的关键。Kami 内置的 14 种 SVG 图表模板，就是为这种场景准备的。

4.7 ■ 学点英语