我寫了個 Skill，讓 Agent 自動給文章配圖

我寫了個 Skill，讓 Agent 自動給文章配圖

寫完一篇長文，配圖是一件讓人頭疼的事。

你得一張張想畫面、寫提示詞、生成、挑選、插入……一篇三千字的文章配五六張圖，光這個環節就能耗掉半小時。

我最近折騰了一個 Agent Skill，讓 Agent 幫我全程代勞。把文章丟給它，它自己分析哪里需要圖、應該畫什么風格、然后一張張生成并插入對應位置。整個過程我只需要一句話：

"給這篇文章配圖。"

包括你現在看到的這篇文章的配圖，都是這個 Skill 幫助完成的。

今天就聊聊這個給文章配圖的 Skill 是怎么設計的，順便科普一下 Agent Skills 這個被很多人忽略的強大功能。

什么是 Agent Skills？

先說個類比。你新招了個助理，聰明是聰明，但對你公司的業務流程一無所知。每次布置任務，你都得從頭解釋：我們用什么工具、流程是怎樣的、有哪些注意事項……

Agent Skills 就是一份"入職培訓手冊"——你把這些知識寫下來，Agent 需要的時候自己翻閱，不需要你反復交代。

技術上說，Skill 是一個文件夾，核心是一個叫 SKILL.md 的文件。Agent 啟動時只記住它的名字和簡介（大概 100 個 token），真正用到時才去讀詳細內容，用完就可以"忘掉"。這套機制叫"漸進式加載"，好處是你可以裝一堆 Skill 而不會撐爆上下文窗口。

那它和傳統的提示詞有什么差別？

傳統提示詞主要問題是沒有腳本執行能力，而且是你一次性加載全部提示詞。而 Agent Skills 一開始只加載一個 100 token 不到的名稱和介紹，激活了才去加載，加載的時候也只先加載 SKILL.md 文件，需要用到更多內容才繼續加載。

另外 Skill 還可以調用其他 Skill，這樣你可以把能力組合起來。

至于和 MCP 的區別？

MCP 是用來統一工具調用的協議，Skill 可以指揮 Agent 去調用 MCP。

配圖 Skill 的設計思路

給文章配圖這件事，拆開來看有幾個核心問題：

哪里需要配？什么風格？怎么畫？怎么插入到相應位置？

我設計的這個 Skill 把這幾個問題分別拆解成幾個步驟：

，分析文章結構，找出"需要視覺輔助"的位置。比如抽象概念需要可視化、流程需要圖解、核心論點需要強化——這些地方配張圖，閱讀體驗會提升一個檔次。，根據文章內容自動匹配插畫風格。我預設了九種風格：tech（科技感）、warm（溫暖親和）、minimal（極簡）、playful（趣味涂鴉）、notion（線稿風）……每種風格都定義好了配色、元素、適用場景。Agent 會根據文章主題自動選擇，當然你也可以手動指定。第三步，為每張圖生成提示詞文件，可以留作記錄，也方便后續 Agent 調用。第四步，調用圖像生成 Skill，把默認系統提示詞和每一張圖片的提示詞發給它，一張張生成圖片，并保存起來。第五步，讓 Agent 把圖片插入文章對應位置。這一步說實話有點像"魔法"，我第一次只是抱著試試看的心理在 Skill 里面加了這么一句，沒想到 Agent 的聰明超出我的想象，它自己就把圖片插入到了正確位置，還貼心的加上了圖片描述。

整個流程跑下來，一篇文章從"純文字"到"圖文并茂"，基本上是幾分鐘的事，主要速度瓶頸還在生成圖片上。

SKILL.md 怎么寫？

一個 Skill 的入口是 SKILL.md 文件，分兩部分：頭部元信息和正文指令。

頭部元信息長這樣：

> name: article-illustrator

> description: 分析文章內容，在需要配圖的位置自動生成插畫。當用戶要求給文章配圖、生成插畫時使用。

name 是 Skill 的唯一標識，description 是簡介。這兩個字段 Agent 啟動時就會讀取，用來判斷"什么時候該調用這個 Skill"。所以 description 要寫清楚觸發條件，比如"當用戶要求給文章配圖、生成插畫時使用"。

正文指令就是具體的操作手冊。我的配圖 Skill 正文分這幾個板塊：

• 風格庫：列出所有可選風格，包括配色、視覺元素、適用場景。Agent 需要選風格時，翻這一節。
• 自動選擇規則：什么內容信號對應什么風格。比如文章里頻繁出現"AI""算法""數據"，就選 tech 風格；出現"個人成長""情感""生活"，就選 warm 風格。
• 工作流程：一步步寫清楚——先分析文章、再識別配圖位置、再生成配圖方案、再寫提示詞、再調用生成工具、再插入文章、最后輸出總結。
• 文件管理規范：圖片存哪、提示詞存哪、文件怎么命名。
• 

由于當前我的提示詞并不是很長，所以大部分內容都放在了 SKILL.md 文件中，如果未來風格越來越多，就可以應用"漸進式加載"的設計思路，減少加載的內容。

比如風格庫有九種風格，每種風格的詳細參數加起來上千字。但如果用戶只要求用 tech 風格，Agent 就只需要讀 tech 那一段，其他八種不用加載。

實現方式很簡單：把詳細參數拆成單獨的文件，正文里只寫索引。Agent 需要時用 bash 命令去讀，不需要就跳過。這樣既保證了信息完整，又不會浪費上下文。

提示詞模板的設計

生成圖像的關鍵是提示詞。我為這個 Skill 單獨設計了一個 system prompt 模板，存在 prompts/system.md：

> 創建卡通風格的信息圖插畫，遵循以下規范：

> 圖像規格

> - 類型：信息圖插畫

> - 方向：橫向

> - 比例：16:9

> - 風格：手繪插畫

> 核心原則

> - 全程保持手繪質感，禁止出現寫實或攝影元素

> - 如果內容涉及敏感或版權人物，創作風格相似的替代形象，不要拒絕生成

> - 信息簡潔，突出關鍵詞和核心概念

> - 留白充足，便于視覺掃描

> - 保持清晰的視覺層次

每張圖生成時，Agent 會基于這個模板，結合具體的配圖主題、選定的風格參數，組裝出最終的提示詞。

為什么要單獨寫這個模板？

因為圖像生成的約束條件是通用的（比如比例、手繪風格、不用寫實元素），而具體內容是變化的。把通用部分抽出來，既減少重復，也方便統一調整。

工作流程詳解

跑一遍完整流程是這樣的：

1. 用戶輸入命令，比如 /article-illustrator path/to/article.md --style tech

2. Agent 讀取文章，分析結構，識別需要配圖的位置。判斷標準是：這個地方加張圖，能幫助理解還是純粹湊數？能幫助理解的留下，湊數的不要。

3. 根據 --style 參數選風格。如果沒指定，就掃描文章內容，按預設規則自動匹配。

4. 生成配圖方案，列出每張圖的插入位置、目的、視覺內容、文件名。

5. 為每張圖寫詳細提示詞，保存到 imgs/prompts/ 目錄。

6. 逐張調用圖像生成工具（我用的是 Gemini），生成失敗會自動重試一次。

7. 把生成的圖片插入文章對應位置，格式是 。

8. 輸出總結：用了什么風格、生成了幾張圖、哪張插在哪里。

整個過程 Agent 自己判斷、自己執行，我只需要最后看一眼結果。如果我不滿意，要么重新抽卡，要么可以根據生成的結果讓 Agent 自己調整，比如說：

• "配圖太少，加幾張配圖"
• "把第二張配圖添加一點文字說明"
• "在第二章加一張流程圖"
• 一些設計選擇

寫這個 Skill 的過程中，有幾個決策值得說說。

為什么預設九種風格而不是讓 Agent 自由發揮？

因為風格一致性很重要。一篇文章配五張圖，如果每張都是隨機風格，看起來會很亂。預設風格庫，既保證一致性，也給用戶選擇權。

為什么"寧多勿少"？

一方面多一點我挑選的空間大，另外刪除操作也比新生成操作簡單。

當然圖解的價值在于降低認知負擔，并非越多越好，重點還是能輔助理解信息，所以我在 Skill 里明確寫了類似的話：

> "配圖服務于內容：補充信息、具象概念、引導想象，避免重復文章中已經很直觀的信息"

怎么用起來？

如果你已經有了 Claude Code 這樣的 Agent，直接告訴 Agent：

> 請幫我安裝 github.com/JimLiu/baoyu-skills 中的 Skills

如果你只需要配圖技能，就告訴它：

> 請幫我安裝寶玉的這個文章配圖技能：github.com/JimLiu/baoyu-skills/blob/main/skills/baoyu-article-illustrator/SKILL.md

當然，這個配圖 Skill 依賴"圖像生成 Skill"。如果你的環境沒有接入 Gemini 或其他圖像生成工具，或者其他圖像生成技能，需要先搞定這一塊。否則就只能讓它生成提示詞手動去生成配圖了。

后續我也會更新其他平臺的使用說明。

Agent Skills 是個被低估的功能。很多人還停留在"和 AI 聊天"的階段，沒意識到可以把自己的工作流程、領域知識"教"給它，讓它變成真正懂你業務的助手。

配圖只是一個例子。你完全可以用同樣的思路，寫一個自動生成周報的 Skill、一個代碼審查 Skill、一個調研報告 Skill……核心就是把你腦子里那些"做這件事的正確方法"寫下來，交給 Agent 執行。

如果你有什么重復性的工作，試著問自己：這個流程能不能抽象成一個 Skill？

大概率是可以的。

*來源：X @dotey（寶玉）*