Screenshot Infographic Skill
把「一张截图 + 一段功能描述」或「一段主题文案」自动变成一整套可在小红书/公众号/社群直接发的 风格统一、视觉优美的图。两种模式：①截图模式——生成功能教程图/产品导览图（1张概览+单功能细节， 局部放大，品牌色自动跟随截图）；②纯文案模式——表意型排版信息图，纯排版零插画、离线可跑， 视觉元素直接编码内容。晚秋简约风：主色 #1A3A6B 深蓝 + 哑光金 #B08D45 + 暖白 #FBFAF8。 适合产品教程、功能安利、新手引导、知识科普、活动预告、资讯解读。 触发词：截图生成教程、功能讲解图、产品导览图、截图配图、功能安利图、把截图做成教程、 文案生成信息图、小红书配图、名词科普配图、infographic generator、screenshot tutorial、 feature guide image、text to infographic。
Install
npx skills add Wanqiu12345/screenshot-infographic-skill --skill screenshot-infographic-skillgit clone --depth 1 https://github.com/Wanqiu12345/screenshot-infographic-skill.git /tmp/screenshot-infographic-skill
mkdir -p ~/.claude/skills
cp -r /tmp/screenshot-infographic-skill/. ~/.claude/skills/screenshot-infographic-skillPersonal skills live in ~/.claude/skills. Use .claude/skills in a project folder to share a skill with your team.
From the SKILL.md
# 截图教程图生成器 (Screenshot Tutorial Generator)
把「一张截图 + 一段功能描述」或「一段结构化文案」变成「一整套风格统一、可直接发布的配图」。
用户不需要懂设计，只要发来素材和大致说明，就能拿到成套的 1080×1440（3:4 竖版）高清 PNG。
> v2.0.0 起移除旧版 v1 流程（杂志风模板 + Agnes 3D 插画 + OCR 定位）与 `--style` 参数，
> 全部走「晚秋简约风」渲染器。旧 v1 配置（`visual_prompt` 格式）不再兼容。
## 两种模式
### 截图模式（`run_screenshot_tutorial.py`）
输入一张产品截图 + 产品信息，输出功能导览图：
- `00_cover.png` 极简传播封面（栏目名 + 品牌名 + slogan）
- `01_overview.png` 总体概览（截图嵌顶部窗口，下方表格化拆解功能）
- `02~N_<功能>.png` 功能细节页（局部放大 + 步骤 + 价值/场景）
品牌色从截图主色自动推导（降饱和、压暗），金色 `#B08D45` 只做小面积强调；深浅主题随截图自动判定。
配置由脚本从 ITEMS/DETAILS 常量自动组装，品牌信息用环境变量覆盖：
`BRAND_NAME` / `BRAND_URL` / `BRAND_SUBTITLE` / `BRAND_CATEGORY` / `SCREENSHOT`。
渲染器 `scripts/screenshot_v2.py`。
### 纯文案模式（`run_text_tutorial.py <config.json>`）
输入表意型排版配置 JSON，输出成套信息图。**纯排版零插画、离线可跑**，视觉元素直接编码内容：
竖链=因果推进、点阵=群体、纵向时间线=演进、三列对比表=差异、SVG 示意图封面。
渲染器 `scripts/text_v2.py`；示例配置 `examples/wf_agent_v2.json`。
每页通过 `flex:1` 均分撑满 1080×1440，不允许底部大片真空；主色 `primary`（默认 `#1A3A6B` 深蓝）
+ 金色 `#B08D45` 小面积强调，背景暖白 `#FBFAF8`。
#### 页面类型（type 字段）
除 `cover` 外，每个内容页都支持通用字段：`meta`（页眉栏目）/ `pg`（页码）/ `title` / `lead`（导语）/ `endbar`（底部结论条）。
| type | 用途 | 关键字段 |
|---|---|---|
| `cover` | 封面（SVG 示意图 + 大标题） | `title_lines` / `subtitle` / `net` / `title_size` / `sum` / `note` / `date` / `total` |
| `stats` | 大数字页 | `items: [[大数字, 单位, 标签, 注释], ...]`（四元组） |
| `chain` | 竖向因果链 | `steps: [[标题, 说明, 补充], ...]`（数组，非字典） |
| `timeline` | 纵向时间线 | `nodes: [{dt, tt, ds, key}]`（注意是 `nodes` 不是 `events`；`key: true` 高亮节点） |Details
- Skill name
screenshot-infographic-skill- Repository
- Wanqiu12345/screenshot-infographic-skill
- License
- MIT
- Repo updated
- 18 September 2026
FAQ
What does the Screenshot Infographic Skill skill do?
把「一张截图 + 一段功能描述」或「一段主题文案」自动变成一整套可在小红书/公众号/社群直接发的 风格统一、视觉优美的图。两种模式：①截图模式——生成功能教程图/产品导览图（1张概览+单功能细节， 局部放大，品牌色自动跟随截图）；②纯文案模式——表意型排版信息图，纯排版零插画、离线可跑， 视觉元素直接编码内容。晚秋简约风：主色 #1A3A6B 深蓝 + 哑光金 #B08D45 + 暖白 #FBFAF8。 适合产品教程、功能安利、新手引导、知识科普、活动预告、资讯解读。 触发词：截图生成教程、功能讲解图、产品导览图、截图配图、功能安利图、把截图做成教程、 文案生成信息图、小红书配图、名词科普配图、infographic generator、screenshot tutorial、 feature guide image、text to infographic。
How do I install the Screenshot Infographic Skill skill?
skills CLI (Claude Code, Cursor, Codex and more): npx skills add Wanqiu12345/screenshot-infographic-skill --skill screenshot-infographic-skill. Skills go in ~/.claude/skills (personal) or .claude/skills (project), and Claude loads them automatically when a task matches the description.
Is Screenshot Infographic Skill popular?
It lives in Wanqiu12345/screenshot-infographic-skill, which has 5 GitHub stars and 1 forks.
Related skills
Ugc Creator
50xAnni/ugc-creator
Turns Claude into a hyper-realistic AI UGC influencer studio. Use this whenever the user wants to create, manage, or scale a synthetic/AI influencer or AI UGC creator: building a consistent character, writing image or video generation prompts for an AI model (Flux, Midjourney, Kling, Sora, Veo, etc.), producing TikTok/Reels/Shorts-style content, product/testimonial/UGC clips, or "shot on iPhone" lifestyle photos of a recurring synthetic person. Trigger it even when the user doesn't say "skill": e.g. "make my AI model look the same in every post", "generate a week of UGC for my AI girl", "why d
Music Mv Studio
5chenqianshinian/music-mv-studio
音乐 MV（音乐视频 / 歌词可视化）全流程制作工作流。用于「给某首歌做 MV」「按歌词做分镜并生成画面」「把逐镜片段合成带字幕的成片」，也用于复盘优化已有的 MV 流水线。核心是**先锁设计再生成、一切结论用像素说话**：导演五层与开工必答 → 首帧闸门 → 逐镜生成（方向锁/结构锁/运动锁）→ 像素级验收 → 定点返修。附 73 条血泪清单（真实踩过的坑）与可运行脚本（scripts/）；Windows / macOS / Linux 三平台都有 CI 冒烟。
Xxd Panel 046
5nevertoday/xxd-panel-046
XXD Panel 046｜Impasto Micro-World: rebuilds the photo's subject as a small, tactile 3D miniature painted in thick impasto oil, standing on one clear diagonal band of thick paint — water, ground, a path or a strip of light — across bright white textured paper with wide whitespace, with reflections, ripples or light spots where they fit and only a few impasto clouds, a sun or mist behind. Visible paint ridges and palette-knife marks; bright, fresh colours (sky blue, lake teal, fresh green, warm yellow, coral, peach) drawn from the photo. A short title with a little small text. Outputs PNG top-bo
Moodle Mcq
5danielcregg/moodle-mcq
Generate, review, and improve Moodle quiz questions. Supports GIFT format (compact, ~6x fewer tokens) and Moodle XML format (full features with syntax highlighting). Four modes: create (easy/standard/challenging difficulty), review (improve existing MCQs). Handles MCQ, true/false, short answer, matching, numerical, and cloze questions. Enforces answer length balance (15/15/70), self-contained stems, plausible distractors, and proper Moodle XML structure including the critical <name> tag fix.
AI Image to Vector Redesign
5hxr223/ai-image-to-vector-redesign
Finish flattened GPT Image 2 design outputs by rebuilding text and layout into sharp, editable SVG/PDF/high-resolution PNG deliverables. Use for AI-generated posters, long images, infographics, flyers, social cards, and marketing graphics when upscaling or tracing would not fix blurry text or layout artifacts.
Game Install Size Optimization
5dungnotnull/game-install-size-optimization-agent-skill
Game Install Size Optimization harness - production-grade asset pipeline & install-size analysis. Use when optimizing game install size, reducing download/storage, implementing compression/streaming/dedup, or analyzing game asset distribution. Triggers on: game install size, asset compression, download optimization, storage reduction, texture/audio compression, asset streaming, language packs, delta patches, SteamPipe, game distribution.
Browse the most popular Claude skills, all images, video & audio skills, or write your own with the skills generator.