ip-diagram-creator
byhaloshin· 1 skill
个人 IP 图解创作器。用你的 IP 形象，生成专属内容图解。用于把用户授权提供的照片、主页截图、简介、账号资料或角色档案转成稳定的极简手绘图解角色，并继续生成长文配图、图文号知识卡、手机海报、方法拆解图、分镜故事图、IP 演讲 PPT、直播分享课件和全图化手绘 PPT 页面等内容视觉。它强调 IP 主角 + 执行 Agent 的知识图解系统：用户 IP 做主讲、拆解、批注和调度，执行 Agent 做搬卡片、反馈、试错、标记风险和递交结果。用户想做个人 IP 形象、用自己的形象做知识图、图文号知识卡、文章配图、课程图解、内容海报、方法拆解图、IP 演讲 PPT、直播分享课件，或上传照片/主页截图/简介希望做内容视觉时，使用本 Skill。
How to install ip-diagram-creator?
haloshin/ip-diagram-creator
$npx -y skills add haloshin/ip-diagram-creator --skill ip-diagram-creatorInstalls into the current project.
›Prefer a prompt? Paste this to your agent
Run `npx skills use "https://github.com/haloshin/ip-diagram-creator" --skill "haloshin/ip-diagram-creator"` and follow the generated skill instructions now. Read its complete output, redirecting it to a temporary file first if necessary. Resolve relative paths from the supporting-files directory it provides.
Use the skills in "https://github.com/haloshin/ip-diagram-creator" that are relevant to the current task. Run `npx skills add "https://github.com/haloshin/ip-diagram-creator"` and select the relevant skills, then follow their instructions.
SKILL.md
| 1 | # ip-diagram-creator |
| 2 | |
| 3 | **个人 IP 图解创作器：用你的 IP 形象，生成专属内容图解。** |
| 4 | |
| 5 | 把授权照片、主页截图、简介或已有角色档案，转成一套可长期复用的极简手绘图解角色；再把文章、课程、观点或脚本拆成适合传播的长文配图、知识卡、方法拆解图、手机海报或整页 PPT 演讲页面。 |
| 6 | |
| 7 | 它不是单纯的头像生成器，而是 **IP 主角 + 执行 Agent 的知识图解系统**：用户 IP 负责主讲、拆解、批注和调度，执行 Agent 负责搬卡片、递交结果、标记风险、反馈和试错。 |
| 8 | |
| 9 | 底层原则：**先定角色，再拆内容，最后生成图解。** |
| 10 | |
| 11 |  |
| 12 | |
| 13 | --- |
| 14 | |
| 15 | ## 快速开始 |
| 16 | |
| 17 | ### 1. 安装 |
| 18 | |
| 19 | 当前项目安装： |
| 20 | |
| 21 | ```bash |
| 22 | npx skills add https://github.com/haloshin/ip-diagram-creator |
| 23 | ``` |
| 24 | |
| 25 | 全局安装： |
| 26 | |
| 27 | ```bash |
| 28 | npx skills add https://github.com/haloshin/ip-diagram-creator -g |
| 29 | ``` |
| 30 | |
| 31 | 不使用安装器也可以：下载本仓库，把整个目录放进你的 Agent Skills 目录，然后让 Agent 读取 `SKILL.md`。 |
| 32 | |
| 33 | ### 2. 第一次出 IP 图 |
| 34 | |
| 35 | 上传你的照片、主页截图或简介，然后说一句就够： |
| 36 | |
| 37 | ```text |
| 38 | 帮我出一组 IP 图。 |
| 39 | ``` |
| 40 | |
| 41 | 如果你希望更可控，可以先不出图，让 Agent 对齐方向： |
| 42 | |
| 43 | ```text |
| 44 | 先不要出图。请根据我的照片、主页截图和简介，先帮我对齐角色方向、三张角色资产思路和后续出图方式，确认后再继续。 |
| 45 | ``` |
| 46 | |
| 47 | ### 3. 继续做内容图解 |
| 48 | |
| 49 | 确认三张角色资产后，可以直接发内容让 Agent 推荐出图方式： |
| 50 | |
| 51 | ```text |
| 52 | 这篇内容想配图，请先推荐适合做几张，分别是什么类型。 |
| 53 | ``` |
| 54 | |
| 55 | 也可以明确指定模式和尺寸。 |
| 56 | |
| 57 | | 方式 | 适合内容 | 可以这样说 | |
| 58 | | --- | --- | --- | |
| 59 | | Agent 推荐 | 还不确定该画几张 | 这篇内容想配图，请先推荐适合做几张，分别是什么类型。 | |
| 60 | | 知识卡 | 方法、步骤、流程、对比、案例 | 用这个形象做一张 16:9 知识卡。 | |
| 61 | | 手绘插图 | 单个观点、故事场景、隐喻表达 | 用这个形象做一张手绘插图。 | |
| 62 | | 长文 shot list | 文章、课程、脚本 | 这篇文章想配图，请先判断适合几张图，给 shot list，不要直接全生成。 | |
| 63 | | PPT 演讲模式 | 直播分享、课程课件、主题演讲 | 我有一个分享大纲，请先做整套 PPT 导演规划卡，不要直接出图。 | |
| 64 | |
| 65 | --- |
| 66 | |
| 67 | ## 推荐环境 |
| 68 | |
| 69 | 推荐在支持图片读取、较高推理强度和图像生成工具的 Agent 环境中使用。这样可以直接完成照片 / 截图理解、角色建档、三张角色资产、内容图解生成和返修。 |
| 70 | |
| 71 | 如果当前环境不能直接生成图片，本 Skill 仍然可以输出可复制到 GPT Image 2、`image_gen` 或其他图像生成工具的完整 prompt，并附返修 prompt。它不会在没有生图能力时假装已经出图。 |
| 72 | |
| 73 | --- |
| 74 | |
| 75 | ## 你会得到什么 |
| 76 | |
| 77 | ### 角色资产：三张固定资产 |
| 78 | |
| 79 |  |
| 80 | |
| 81 | 角色资产不是只生成一张头像，而是先固化“像谁”，再固化“不能跑偏”，最后固化“小比例场景里还能认出来”。 |
| 82 | |
| 83 | ### 图解产出：从低信息量插图到知识卡 |
| 84 | |
| 85 |  |
| 86 | |
| 87 | 这张图展示同一个内容主题在不同信息密度下的产出差异：低信息量手绘插图、中信息量插图、高信息量标注图，以及更适合收藏和复盘的知识卡。 |
| 88 | |
| 89 | 核心产出分成 7 类： |
| 90 | |
| 91 | | 产出 | 作用 | |
| 92 | | --- | --- | |
| 93 | | 角色三件套 | 角色主锚图、角色规范说明图、动作 / 表情 / 小比例场景扩展图。 | |
| 94 | | 内容图解 | 先读长文、课程、截图或一句话主题，再判断适合画哪几张图。 | |
| 95 | | Agent 协作图解 | 方法、步骤、流程、对比、案例和风险类知识卡，默认安排 2-6 个执行 Agent 参与动作。 | |
| 96 | | 模式判断 | 手绘插图看信息量，知识卡看内容结构和执行分工，PPT 模式看页面节奏。 | |
| 97 | | 出图前确认卡 | 先确认图类型、尺寸、图内文字、主画面隐喻、角色动作和辅助 Agent 分工。 | |
| 98 | | PPT 导演规划 | 先规划整套页面类型、信息密度、人物出现频率和样张页，再分批生成。 | |
| 99 | | Prompt 和返修建议 | 可复制到图像生成工具，也方便持续迭代角色稳定性。 | |
| 100 | |
| 101 | ### PPT 模式：从单张图解到整套演讲页面 |
| 102 | |
| 103 |  |
| 104 | |
| 105 | PPT 演讲模式用于个人 IP 直播分享、课程课件、主题演讲和案例复盘。它不是把每一页都做成知识卡，而是先控制整套页面节奏，再生成整页 PPT 页面图。 |
| 106 | |
| 107 | 基本流程： |
| 108 | |
| 109 | 1. 提供主题、大纲、逐字稿或旧 PPT。 |
| 110 | 2. 确认个人 IP 角色资产。 |
| 111 | 3. 输出导演规划卡：每页类型、视觉权重、图文比例、人物职责和 QA 风险。 |
| 112 | 4. 先做 1-2 页样张，确认字体、角色和信息密度。 |
| 113 | 5. 分批生成整套页面，并用 contact sheet 做整套 QA。 |
| 114 | |
| 115 | 常见页面类型包括：封面页、大判断页、模块页、标准页、场景页、时间线页、方法页和收束页。 |
| 116 | |
| 117 | ## 适合谁 |
| 118 | |
| 119 | - 个人 IP、知识型创作者、课程作者、咨询顾问、内容团队。 |
| 120 | |
| 121 | - 想把自己的形象变成长期稳定内容视觉的人。 |
| 122 | |
| 123 | - 想让 AI 先理解内容结构，再推荐图解形式，而不是直接套模板出图的人。 |
| 124 | |
| 125 | ## 不能做什么 |
| 126 | |
| 127 | - 不保证复刻真人长相，也不适合生成身份证照、商业肖像照或高拟真写真。 |
| 128 | |
| 129 | - 不直接使用未授权照片、他人主页截图、私信截图、客户资料或不可分发参考图。 |
| 130 | |
| 131 | - 不替代商标、肖像权、平台规则、课程销售和广告投放前的人工审核。 |
| 132 | |
| 133 | - 不把用户确认后的私有角色资产放进公共 Skill 包作为默认资产。 |
| 134 | |
| 135 | ## 输入和输出 |
| 136 | |
| 137 | | 类型 | 内容 | |
| 138 | | --- | --- | |
| 139 | | 角色材料 | 本人照片、头像、主页截图、简介、账号资料、已有角色图、角色档案。 | |
| 140 | | 内容材料 | 长文、Markdown、链接摘要、截图、课程大纲、视频脚本、直播主题、案例复盘、一句话观点。 | |
| 141 | | 参考材料 | 你有权使用的风格参考、知识卡参考、版式参考。 | |
| 142 | |
| 143 | 输出通常包括： |
| 144 | |
| 145 | | 阶段 | 输出 | |
| 146 | | --- | --- | |
| 147 | | 角色建档 | 角色信息提取卡、三张角色固定资产 prompt、角色档案摘要。 | |
| 148 | | 内容拆解 | 长文 shot list、出图方案推荐、内容确认卡、辅助 Agent 分工建议。 | |
| 149 | | PPT 演讲模式 | 整套导演规划卡、page card、样张页建议、整套 QA 检查。 | |
| 150 | | 生成与返修 | 可复制的图像生成 prompt、QA 检查、返修 prompt。 | |
| 151 | |
| 152 | --- |
| 153 | |
| 154 | ## 示例图库 |
| 155 | |
| 156 | 示例图只展示最终成品，不包含原始照片、主页截图或私有参考图。 |
| 157 | |
| 158 | <details> |
| 159 | <summary>展开查看 5 类示例图</summary> |
| 160 | |
| 161 | <table> |
| 162 | <tr> |
| 163 | <td width="50%"> |
| 164 | <img src="assets/examples/gallery/workflow-overview-16x9.webp" alt="workflow overview" /> |
| 165 | <br /> |
| 166 | <strong>工作流总览</strong><br /> |
| 167 | 从个人材料到内容图解的完整链路。 |
| 168 | </td> |
| 169 | <td width="50%"> |
| 170 | <img src="assets/examples/gallery/character-assets-sample.webp" alt="character assets sample" /> |
| 171 | <br /> |
| 172 | <strong>角色资产</strong><br /> |
| 173 | 角色主锚、动作场景、道具和使用建议如何固化。 |
| 174 | </td> |
| 175 | </tr> |
| 176 | <tr> |
| 177 | <td width="50%"> |
| 178 | <img src="assets/examples/gallery/article-illustration-low-density.webp" alt="article illustration low density" /> |
| 179 | <br /> |
| 180 | <strong>手绘插图模式</strong><br /> |
| 181 | 画面更空，用一个大场景隐喻解释一个核心观点。 |
| 182 | </td> |
| 183 | <td width="50%"> |
| 184 | <img src="assets/examples/gallery/knowledge-card-high-density.webp" alt="knowledge card hig |
Related
6 picksType
- remotion-best-practicesRouter for all Remotion skillsJul 2026
- ai-image-generationGenerate AI images with GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve and 50+ models via inference.sh CLI.Jul 2026
- hyperframes-cliUse the HyperFrames CLI development loop: init, add, catalog, capture, lint, check, snapshot, compare, grade-compare, preview, play, present, beats, keyframes,…Jul 2026
- hyperframesMandatory entry point: read this first for any request to make, create, edit, animate, or render a video, animation, or motion graphic, including a promo,…Jul 2026
- remotion-to-hyperframesPort an existing Remotion (React) composition''s source to HyperFrames HTML.Jul 2026
- hyperframes-coreThe HyperFrames composition contract — build one renderable project.Jul 2026
