很多老师、学生和自媒体朋友都卡在同一个地方：知识点自己懂，可一到“做成图、做成动画”就犯难。剪辑软件学不会，外包又太贵。
现在有一批开源的 AI Skill（可以理解为给 Claude Code 这类 AI 编程助手装的“专业插件”），能把一段文字、一份讲稿直接变成讲解图、动画网页，甚至带配音的 MP4。
但项目一多就容易挑花眼。今天按 “你最后要交付什么” 帮你分好类，每个都讲清楚适合谁、怎么起步、要准备什么，看完就能选。
先看你要交付什么
- 讲解图（静态）：Anatomy、Visual Explainer
- 交互网页（HTML）：AI-Animation-Skill、Animated Explainer Skills（Anatomy 也能出交互演示）
- MP4 视频：Knowledge Explainer、Manim Skill、iart Explainer Video Skills、Whiteboard Explainer
- 脚本 + 分镜 + 配音一条龙：Vox Explainer、iart Explainer Video Skills
一个原则：先想清楚发在哪里。公众号配图选讲解图，课堂演示选网页，视频号、B 站选 MP4。
1. Anatomy：把机器“拆开”给你看
一句话定位：给真实机器和复杂系统画等距（2.5D）结构图，可生成精致 SVG 和交互演示。
适合谁：讲硬件、工程、“XX 内部是怎么工作的”这类内容的作者和老师。
怎么上手：装好 Skill 后，直接告诉 AI“画一张咖啡机内部结构等距图”，再让它做成可交互的 HTML 版本。
准备与注意：需要 Node.js 和 Chrome；3D 效果目前还是测试功能，正式用先以 2D 图为主。
仓库：https://github.com/wheresryan22/anatomy
2. Visual Explainer：一段文字秒变信息图
一句话定位：把主题、文档或 Mermaid 图，转成白板手绘、信息图、流程图、思维导图、多格图等静态图片。
适合谁：公众号作者、做 PPT 和知识卡片的人，最适合“文章配图”场景。
怎么上手：把文章段落或一段 Mermaid 代码丢给它，指定风格（如“白板手绘”）即可出图。
准备与注意：需要 OpenAI 或 Gemini 的图片生成 API（会产生费用），以及 curl、jq；输出是静态图，不是动画。
仓库：https://github.com/ericblue/visual-explainer-skill
3. Knowledge Explainer：Markdown 讲稿直接出视频
一句话定位：把结构化的 Markdown 文稿，用 Remotion（用 React 写视频的框架）渲染成讲解动画 MP4。
适合谁：已经有现成讲稿、想批量出视频的老师和知识博主。
怎么上手：照示例写好讲稿，一行命令渲染：
node cli.js examples/script.md out/example.mp4
准备与注意：需要 Node.js 和 FFmpeg；配音和字幕要另外处理。
仓库：https://github.com/znyupup/knowledge-explainer-skill
4. Vox Explainer：一句话生成“Vox 风”拼贴短片
一句话定位：输入一个主题，自动完成脚本、关键帧、动画、配音、配乐，本地合成 Vox 风格的纸张拼贴短视频。
适合谁：想做有“杂志感”的社会、历史、科普短视频的创作者。
怎么上手：给它一个话题，比如“为什么咖啡越来越贵”，让它先出脚本和分镜，确认后再生成。
准备与注意：需要 Atlas Cloud API Key（付费生成）、Python 和 FFmpeg；全流程自动，建议每一步都先确认再花钱。
仓库：https://github.com/CK42BB/vox-explainer-skill
5. AI-Animation-Skill：文字变“会动的 PPT”
一句话定位：把科普文本变成类似幻灯片轮播的单文件 HTML 演示动画，自带模板，偏流程图风格。
适合谁：上课演示的老师、录屏讲解的博主，中文文档，上手友好。
怎么上手：把一段讲解文字交给它，选模板，生成后用浏览器打开，直接录屏就是视频素材。
准备与注意：输出是网页，要视频需自己录屏；风格偏简洁图表，不适合复杂插画。
仓库：https://github.com/Unclecheng-li/AI-Animation-Skill
6. Manim Skill：让 AI 写出 3Blue1Brown 风动画
一句话定位：给 AI 装上 Manim 最佳实践，同时覆盖 Manim 社区版（CE）和 ManimGL。
适合谁：讲数学、物理、算法的老师和学生，要公式推导、几何变换效果的人。
怎么上手：装好后让 AI“用 Manim 做一段勾股定理证明动画”，它会写出代码并渲染。
准备与注意：需要 Python 和 LaTeX，环境配置有一定门槛；效果最“硬核”，学习回报也最高。
仓库：https://github.com/adithya-s-k/manim_skill
7. iart Explainer Video Skills：5 合 1 视频工具包
一句话定位：一套 5 个 Skill：讲解视频、年度回顾、图表动画、白板动画、等距动画，覆盖脚本、分镜到渲染。
适合谁：想一次装好、多种视频都能做的自媒体团队。
怎么上手：用 npx skills add 一键安装整套，再按需要调用对应 Skill。
准备与注意：基于 Remotion 渲染，配音需要另配语音服务。
仓库：https://github.com/iart-ai/explainer-video-skills
8. Animated Explainer Skills：Kurzgesagt 风扁平动画
一句话定位：做出类似 Kurzgesagt（“简单来说”）的扁平插画动画，带视差效果和可拖动进度的播放器，最终是一个独立 HTML 文件。
适合谁：追求高颜值、想做“质感科普”的创作者。
怎么上手：让 AI 按它的动画编排模式写场景，生成单个 HTML，浏览器打开即可预览、拖动检查。
准备与注意：动画依赖 GSAP（通过 CDN 加载，需联网）；配音用 ElevenLabs，需要对应账号。
仓库：https://github.com/BusyBee3333/animated-explainer-skills
9. Whiteboard Explainer：真人手绘白板视频
一句话定位：用真实的手部照片加遮罩“边画边出现”，并用 Whisper 逐词时间戳，让画面和配音精准同步。
适合谁：喜欢经典白板讲解风格的老师、培训师。
怎么上手：先写好讲稿生成配音，再让 Skill 根据逐词时间轴安排每一笔出现的时机。
准备与注意：依赖最多：HyperFrames、Python、openai-whisper、Pillow，还要图片生成和语音合成（TTS）服务，适合愿意折腾的进阶用户。
仓库：https://github.com/brandonvant/claude-skill-whiteboard-explainer
选型速查表
- 只要公众号配图 → Visual Explainer
- 讲机器、系统结构 → Anatomy
- 课堂演示、录屏 → AI-Animation-Skill
- 要高颜值动画网页 → Animated Explainer Skills
- 已有讲稿想出视频 → Knowledge Explainer
- 数学物理公式 → Manim Skill
- 一个话题全自动出片 → Vox Explainer
- 想一套工具包搞定 → iart Explainer Video Skills
- 经典手绘白板风 → Whiteboard Explainer
新手建议从 Visual Explainer 或 AI-Animation-Skill 开始，依赖少、见效快；熟悉之后再挑战视频类。
复制即用：给 AI 的需求模板
不管选哪个 Skill，开口这样说，能少走很多弯路：
请帮我做一段科普动画。
观众：【比如：初二学生 / 没有技术背景的上班族】
要讲清楚：【一个具体知识点，比如：为什么天空是蓝色的】
最终交付：【讲解图 / HTML 网页 / MP4 视频】，发布在【公众号 / 视频号 / 课堂】
风格参考：【比如：白板手绘 / 扁平插画 / 杂志拼贴】
要求：
1. 先只做一段约 20 秒的试做片段，满意后再扩展；
2. 动手前先列出分镜、需要安装的依赖和预计费用；
3. 任何会产生付费的生成步骤，先停下来等我确认。
最后一条尤其重要：图片、视频、配音生成大多按次计费，先看样片再放量，钱花得最值。
如果这篇对你有用，点个关注、转发给同样在做内容的朋友。接下来我会挑其中两三个亲手跑一遍，把真实效果和踩坑记录分享出来。
参考：X 用户 @Haosen9527 的整理文章
