宝玉（JimLiu）的baoyu-skills：一个前端工程师把20+AI技能做成了内容创作全家桶最新版

一、这个项目在解决什么

如果你经常用 Claude Code、Codex 或其他 AI Agent 做内容创作，迟早会遇到两个问题：

• 技能散落各处：小红书配图要找一套提示词，公众号封面要找另一套，信息图又要重新调试风格，每次都从零开始。
• 风格无法复用：好不容易调出一套满意的”可爱风卡片”，下次想换个”Notion 风格”又得重新写提示词。

JimLiu/baoyu-skills 把这些高频内容创作场景打包成了 20+ 个独立可安装的 Agent Skills，每个都带风格/布局选择器、命令行参数、完整测试用例和可预览的示例图。

项目维护者 宝玉（@宝玉xp） 是微博知名的 AI 提示词玩家，长期分享各类内容生成的提示词模板。他的另一本书《图解 Skill —— AI 提效实战指南》专门讲如何从零创建 Agent Skills——这个仓库就是那本书的实战产物。

二、核心特性

1. Style × Layout 双维度设计系统

这是 baoyu-skills 最有亮点的部分。以小红书卡片生成器（baoyu-xhs-images）为例：

• 12 种视觉风格：cute（可爱）、fresh（清新）、warm（温暖）、bold（大胆）、minimal（极简）、retro（复古）、pop（波普）、notion（Notion 风）、chalkboard（黑板）、study-notes（学习笔记）、screen-print（丝网印刷）、sketch-notes（速记风）
• 6 种信息布局：sparse（1-2 点，适合封面/金句）、balanced（3-4 点，常规内容）、dense（5-8 点，知识卡片/速查表）、list（4-7 项，清单/排名）、comparison（双栏对比）、flow（3-6 步，流程/时间线）
• 3 种调色板覆盖：macaron（马卡龙）、warm（暖色）、neon（霓虹）

组合起来就是 12 × 6 = 72 种风格变体，而且每个风格都提供了真实的预览截图（README 里直接展示 36 张示例图），不再是抽象的文字描述。

2. 信息图生成器的 21 × 21 组合

baoyu-infographic 更夸张：20 种布局类型 × 17 种视觉风格（外加 4 种命名的纵横比预设），覆盖了几乎所有常见的信息图场景：

布局类型（信息结构）：

• 问题-方案：bridge（桥梁）、do-dont（对错对比）
• 循环/流程：circular-flow（循环）、funnel（漏斗）、flow（流程）、journey-path（旅程）
• 层级/结构：pyramid（金字塔）、layers-stack（层级）、tree-hierarchy（树状）、mind-map（思维导图）
• 对比/权衡：comparison-table（对比表）、scale-balance（天平）、venn（韦恩图）
• 分析/洞察：fishbone（鱼骨图）、iceberg（冰山）、priority-quadrants（四象限矩阵）
• 时间线：timeline-horizontal（水平时间线）
• 其他：feature-list（特性清单）、equation（公式分解）、grid-cards（网格卡片）、nested-circles（嵌套圆）

视觉风格（从可爱到极客）：

• 手绘/可爱：craft-handmade（手工风，默认）、kawaii（日系萌）、storybook-watercolor（水彩故事书）、claymation（粘土动画）
• 现代/商务：corporate-memphis（扁平商务）、bold-graphic（漫画风）、ikea-manual（宜家说明书风）、knolling（俯拍平铺）
• 科技/极客：technical-schematic（蓝图工程）、cyberpunk-neon（赛博朋克）、pixel-art（像素风）、subway-map（地铁图）
• 复古/文艺：aged-academia（学院派）、chalkboard（黑板）、origami（折纸风）、lego-brick（乐高风）
• 工具/UI：ui-wireframe（线框图）

README 里展示了 60 张布局预览 + 51 张风格预览，这种”所见即所得”的文档质量在开源项目里非常罕见。

3. 真实的测试用例

仓库的 packages/ 目录下有多个独立包，每个都带 src/__tests__/ 和完整的测试文件：

• baoyu-fetch：URL 抓取与 Markdown 转换（14 个测试文件）
• baoyu-codex-imagegen：Codex 图像生成后端（7 个测试文件）
• baoyu-chrome-cdp：Chrome DevTools Protocol 工具（含 Mermaid 渲染）

对于一个”提示词集合”类项目来说，这种工程化程度令人意外——它不是简单的提示词打包，而是一套完整的内容生成基础设施。

三、三大技能类别

内容类（Content Skills）

AI 生成类（AI Generation Skills）

工具类（Utility Skills）

四、安装与使用方式

快速安装（推荐）

npx skills add jimliu/baoyu-skills

按需安装

作者明确提醒：这个仓库包含 20+ 个技能，按需安装，不要全部装——批量安装会增加 Agent 的上下文开销。

对于微信公众号文章工作流，最小集合是：

# 封面图 + 插图 + 发布
cp -r skills/baoyu-cover-image <project>/.agents/skills/
cp -r skills/baoyu-article-illustrator <project>/.agents/skills/
cp -r skills/baoyu-post-to-wechat <project>/.agents/skills/

baoyu-post-to-wechat 已内置 Markdown → 微信 HTML 转换，不需要单独装 baoyu-markdown-to-html。

凭据配置

微信公众号 API 凭据可放在：

• 用户级：~/.baoyu-skills/.env
• 项目级：<project>/.baoyu-skills/.env（仅当前项目生效，不提交 Git）

五、关联项目：baoyu-design

仓库里专门推荐了另一个独立项目 JimLiu/baoyu-design——一个设计专用的 Agent Skill，可以在 Cursor / Claude Code / Codex / Claude Desktop 等任意文件型编码 Agent 中运行，产出：

• UI 线框图 / 高保真原型
• 落地页 / Dashboard / 移动端 App
• 交互式原型（自包含 HTML）
• 幻灯片

npx skills add JimLiu/baoyu-design

这说明作者对”内容生成 → 设计交付”全链路有完整思考，baoyu-skills 聚焦内容生产，baoyu-design 聚焦视觉设计，两者可组合使用。

六、工程质量与文档

• 920 个文件，包含完整的 packages 目录、测试用例、文档、工作流配置
• README 长度接近 60KB，提供中英双语版本，每个技能都有详细的命令示例、参数表、预览图
• 多平台支持：可发布到 ClawHub / OpenClaw（./scripts/sync-clawhub.sh），也可注册为 Claude Code 插件市场（/plugin marketplace add JimLiu/baoyu-skills）
• 语义化版本：使用 Changesets 管理 CHANGELOG，提供中英双语更新日志

七、适用场景与人群

适合：

• 自媒体运营（小红书 / 公众号 / 知乎等平台的内容卡片、封面、插图）
• 产品/运营制作信息图（数据可视化、对比分析、流程说明）
• 需要批量生产特定风格内容的团队（通过 –yes 非交互模式接入自动化流程）
• 正在学习如何创建 Agent Skills 的开发者（配套《图解 Skill》书籍）

不适合：

• 一次性简单图片生成（直接用 ChatGPT / Claude 的内置图像生成即可）
• 需要完全自定义风格、与现有品牌视觉体系强绑定的场景（这套系统以预设风格为主）

八、一句话总结

宝玉把”内容生成的风格可复用性”问题，做成了一个完整的 Style × Layout 设计系统，并打包成 20+ 个可独立安装的 Agent Skills——从提示词模板升级到了工程化的内容生产基础设施。

GitHub 地址：https://github.com/JimLiu/baoyu-skills