七种画风，把口播做成讲解动画 dashi-animationstyle

让画面解释你正在说的内容

录好了口播，却不知道配什么画面，最后只能把关键词放上屏幕——做知识视频时经常会遇到这个问题。这个技能让 Claude Opus 5.5 用 HTML / Canvas 编写动画，把一段 15–60 秒的中文口播变成可放进剪映的讲解片段。你可以选现成画风，也可以提供参考图或描述想要的感觉，再逐步确认画面。

上方是作者手绘笔记示例的一张截帧：电脑里显示一句请求，旁边标出“提示词”，用电脑里的请求举例，帮助观众理解口播中提到的“提示词”。仓库 README 还用同一段讲解 Token 的口播展示了七套画风，可以比较哪一种更适合自己的内容。

下面练习讲解“为什么订阅没有取消成功”。先录一段约 20–30 秒的解释：关闭通知只是停止提醒，取消订阅需要进入订阅管理，确认状态和到期日。你要做的是把这两种容易混淆的操作展示清楚，不是将这几句话逐行搬上屏幕。

安装后，先确认能渲染示例

作者只在 Apple Silicon Mac、Claude Opus 5.5 上测试过。需要 Node.js 22+、FFmpeg 和 Google Chrome。在 Mac 终端中安装所需工具，再获取技能：

brew install node ffmpeg
git clone https://github.com/chuspeeism/dashi-animationstyle.git ~/.claude/skills/dashi-animationstyle

然后在 Claude Code 中说：“检查一下风格动画的环境，再渲一个例子看看。”这是作者提供的启动用法。技能会检查环境，用内置 Token 示例制作约 21 秒的片段；缺少依赖时先按提示处理。

部分字体需要在 macOS“字体册”里下载。不补齐也可能渲染，但会回退到苹方，画面不一定和样片相同。自动转写可选用 whisper-cpp；没有它时需要提供文字稿，字幕时间还要人工检查。

本文安装与流程依据 README、SKILL.md 和脚本说明核对，本站没有实际安装依赖或渲染视频。示例中的作者声音仅供试用技能，不能拿去做自己的作品。

准备录音与文字稿，选一种画风

把自己的音频和对应文字稿放进项目目录。文字稿应与实际录音一致；改了稿子却没重录，字幕就会与口播不一致，画面也可能与讲解错开。这个技能使用已有录音，不负责把稿子合成为你的声音。

本例选“扁平流程图”，因为要比较两个操作，讲清因果和步骤。内置七套是立体卡通、黑底科技、超现实拼贴、复古剪纸、复古报刊、扁平流程图与手绘笔记。知识库还整理了 27 种画风，供设计新风格时参考，不代表有 27 套现成模板。

将下面需求发给 Claude Code。以下对话示例由本站编写，尚未实际生成视频验证。

用 dashi-animationstyle，把我的中文口播做成扁平流程图讲解动画。
音频：[文件路径]；文字稿：[文件路径]。
主题：为什么关闭通知不等于取消订阅。
用虚构 App 演示，不照搬某个真实产品的操作界面。
先对比“停止提醒”和“结束自动续费”，再展示进入订阅管理、取消、确认状态的过程。
保留录音原意，不补写未经我确认的操作事实。
先给我分镜，再给三张关键画面；两步确认后再渲染整段。
字幕直接嵌入画面，最终还要保留 SRT 和可修改工程。

作品应放在自己的项目目录，例如 动画作品/订阅讲解_扁平流程图/，不要放进技能安装目录。那里会保存录音、字幕、分镜、时间线、网页和成片，后续修改需要一起保留。

确认分镜，再看三张关键画面

先看分镜是否把两个概念区分开。关闭通知这一镜应该表现“提醒消失”，而不是让订阅卡片也消失；取消订阅那一镜才展示续费状态的改变。这样观众才能理解两种操作的后果。

如果分镜只列了三张标题卡，可以要求：

第二镜不要只显示“关闭通知不等于取消订阅”。
用两个并列区域表现：一边通知停止，另一边订阅仍在。
下一镜再进入订阅管理，展示取消后的状态变化。
请先更新分镜，不要急着渲染。

分镜确认后，检查开始、中段和结尾的三张静帧。文字在手机尺寸下是否可读？两个操作是否容易分辨？结尾能否看清最终状态？手写或逐字出现的文字，还要在写完后的时刻检查，避免把未完成的帧误判成缺字。

播放首版，检查画面是否跟上口播

静帧只能验证构图，不能验证节奏。首版需要带声音完整播放，尤其听“关闭通知”和“取消订阅”两个词出现时，对应动作是否已经开始。

按确认的分镜和静帧制作首版。
检查关键词出现时对应动作是否跟上，字幕是否与录音一致。
播放时重点检查镜头切换的地方，避免出现空白或提前换字幕。
片尾留出阅读最终状态的时间，交付 MP4、字幕.srt 和工程目录。

技能使用 Chrome 逐帧绘制，再合成带口播的 1920×1080、30fps MP4。配乐、额外音效和真人拍摄的片段，可以在剪映中继续添加。作者报告的一次 23 秒作品制作约半小时，内容差异与修改次数都会影响耗时，不应把渲染示例的几十秒理解为整个创作只需几十秒。

如果在剪映里统一加字幕，可以让 AI 另出无字幕版。上游渲染器的 --no-subtitle 会同时关闭字幕与字幕底带，另存 _无字幕.mp4；保留 字幕.srt 供剪辑软件导入。

提一个具体修改，再换成自己的主题

假设第 8 秒画面已经跳到取消流程，口播还在解释通知，可以这样改：

调整第 8 秒附近的衔接：在口播说完“只是停止提醒”前，继续保留通知与订阅的对比。
说到“进入订阅管理”时再切到下一镜。
保留已确认的画风和文案，先给我看这段预览，再重新生成整片。

如果修改的是录音内容，字幕、时间线和相关画面都需要重新检查。只修改代码里某个镜头的开始时间，容易让后面镜头继续错位。

换成自己的知识、产品或操作说明时，可以填写：

口播与文字稿：[路径，15–60 秒]
观众：[给谁看，对方最容易误解什么]
希望看懂：[一个概念、对比或操作过程]
画风：[现成风格，或参考图与描述]
必须准确：[产品事实、术语、数字与限制]
素材：[自己的 Logo、配色或界面资料]
字幕：[直接嵌入画面，或回剪映统一添加]
先确认分镜和三张静帧，再出首版；保留工程与 SRT。

长视频可以挑最需要解释的几段分别制作。若按参考图开发新画风，先确认几张风格预览图，再安排整段内容；参考图的使用权和素材许可仍需分别确认。代码与文档采用 MIT 许可，作者示例录音不在这一许可范围内。