Notebook-style doodle visuals for WeChat articles
面向微信公众号文章的手帐涂鸦风配图技能
Works with Claude Code and OpenAI/Codex-style agents.
中文 | English | Style Guide
面向微信公众号文章的手帐涂鸦风配图技能。
inknote-wechat 可以把中文文章选题、文章草稿或完整公众号文章，转成一组可直接使用的封面图和内文插图。它特别适合 AI 产品、Vibe Coding、设计工具、创作者工具、效率工具和个人知识工作类内容。
下面这组图来自一篇关于 Codex 登陆 ChatGPT 移动应用的文章示例。目标不是做复杂信息图，而是让公众号读者在手机上快速抓住每一节的意思。
| 封面图 | 内文图 |
|---|---|
|
 |
| 随时随地使用 Codex | 随时接住进展 |
 |
 |
| 关键时刻介入 | 远程环境继续跑 |
用 $inknote-wechat 给这篇文章出一套公众号配图：1 张封面 + 3 张内文图。
默认会先生成 1 张封面图确认风格；你确认后，再继续生成内文图。如果想一次性生成整套，可以直接说明“全部一次出图”。
- 生成公众号封面图
- 生成文章内小插图
- 为长文章设计一组统一风格配图
- 把一篇文章拆成 3-6 个视觉节点
- 默认优先直接生成成品图
- 图片生成工具不可用时，退回输出 Prompt
- 白色笔记本纸
- 浅蓝色横线
- 一条红色页边线
- 黑色马克笔手绘线条
- 不完美的方框、箭头、UI 卡片、便签、文件夹、鼠标指针和小人
- 少量红、黄、蓝或绿色点缀
- 适合手机阅读，不做复杂信息图
用 $inknote-wechat 给这篇文章直接出一张公众号封面图。
Use $inknote-wechat to generate a WeChat cover image for this article.
Claude Code 主要读取 SKILL.md。agents/openai.yaml 不是 Claude Code 必需文件。
推荐安装方式：
~/.claude/skills/inknote-wechat/
├── SKILL.md
├── assets/
└── references/
本地安装命令：
mkdir -p ~/.claude/skills/inknote-wechat
cp -R SKILL.md assets references ~/.claude/skills/inknote-wechat/安装后可以在 Claude Code 中使用：
/inknote-wechat 给这篇公众号文章生成配图。
如果当前 Claude Code 环境没有图片生成工具，这个技能会退回输出完整 Prompt。
普通公众号文章：
- 先出 1 张封面图确认风格
- 3 张内文插图
- 每张图附一条简短使用建议
早期选题阶段：
- 输出视觉分镜
- 需要时再输出 Prompt
inknote-wechat/
├── .gitignore
├── SKILL.md
├── README.md
├── agents/
│ ├── README.md
│ └── openai.yaml
├── assets/
│ ├── style-reference.jpg
│ └── examples/
│ ├── codex-mobile-cover.png
│ ├── codex-mobile-work-anywhere.png
│ ├── codex-mobile-decision.png
│ └── codex-mobile-remote-ssh.png
└── references/
└── style-guide.md
这个技能不是单纯写 Prompt，而是服务于公众号生产流程：目标是直接拿到一组风格统一、能放进文章里的配图。
assets/examples/ 中的示例图是当前风格基准：后续生成应尽量对齐它们的纸张质感、粗黑手写标题、手绘 UI 卡片和少量红色点缀。
agents/openai.yaml 是给 OpenAI/Codex 类界面使用的可选元数据，用来提供展示名、简介和默认提示词。Claude Code 使用时主要依赖 SKILL.md。
它不规定图片保存位置。实际保存目录应由使用它的项目或用户自己决定。
Notebook-style doodle illustrations for WeChat official account articles.
inknote-wechat turns Chinese article ideas, drafts, or finished WeChat articles into usable cover images and in-article illustrations. It is tuned for AI product, Vibe Coding, design tools, creator workflows, productivity, and personal knowledge-work topics.
This sample visual set is based on an article about Codex becoming available in the ChatGPT mobile app.
| Cover | In-article visuals |
|---|---|
|
|
| Use Codex Anywhere | Catch progress on mobile |
|
|
| Step in at key moments | Remote environments keep running |
- Creates WeChat article cover images
- Creates section illustrations for long articles
- Designs a consistent visual set for one article
- Splits an article into 3-6 visual beats
- Generates finished images by default
- Falls back to prompt-only output when direct image generation is unavailable
- White notebook paper
- Pale blue ruled lines
- One red margin line
- Black marker doodles
- Imperfect boxes, arrows, UI cards, sticky notes, folders, cursors, and small people
- One or two small color accents
- Mobile-readable composition for WeChat articles
Use $inknote-wechat to generate a WeChat cover image for this article.
Use $inknote-wechat to create a full visual package: 1 cover image + 3 in-article illustrations.
By default, the skill generates the cover first for style confirmation, then continues with the in-article visuals after approval. Ask for all images in one pass if you want the full set immediately.
Claude Code uses SKILL.md directly. agents/openai.yaml is not required for Claude Code.
Recommended install location:
~/.claude/skills/inknote-wechat/
├── SKILL.md
├── assets/
└── references/
Install locally:
mkdir -p ~/.claude/skills/inknote-wechat
cp -R SKILL.md assets references ~/.claude/skills/inknote-wechat/After installation, use:
/inknote-wechat generate visuals for this WeChat article.
If no image generation tool is available in the current Claude Code environment, the skill falls back to complete image prompts.
For a normal WeChat article:
- 1 cover image first for style confirmation
- 3 in-article illustrations
- Short usage note for each image
For early ideation:
- Visual shot list
- Prompt-only output when requested
This skill is designed for article production workflows where the goal is not only to write prompts, but to produce usable WeChat visuals with a consistent editorial illustration style.
The images in assets/examples/ are the current style baseline for paper texture, rough hand-lettered titles, hand-drawn UI cards, and restrained red accents.
agents/openai.yaml is optional metadata for OpenAI/Codex-style interfaces. It provides display text and a default prompt, but Claude Code primarily relies on SKILL.md.
It does not prescribe a fixed output directory. The save location should be decided by the host project or the user.