mcpField
S
stick-figure

stick-figure

github.com/artemnovitckii创意与媒体755105 次安装2 周前更新
代码仓库

关于 stick-figure

stick-figure 是制作动画短视频的技能，将脚本、代码绘制的场景、旁白和音效组合起来。它提供示例项目及构建流程，涵盖逐词对齐、镜头时序和 MP4 渲染。

主要功能

  1. 01在项目文件夹中组织每条短片
  2. 02用代码绘制角色和场景
  3. 03按旁白逐词时间对齐镜头
  4. 04制作旁白和合成音效
  5. 05渲染镜头并导出 MP4

适用场景

  1. 01制作动画讲解短片
  2. 02替换旁白后重新调整镜头时序
  3. 03根据审核通过的脚本制作短视频

安装

复制下面的命令，在终端中运行。

$npx skills add https://github.com/artemnovitckii/claude-animation-skills --skill stick-figure

安装后在 Claude Code 中输入/stick-figure确认已加载。

包含的文件

除 SKILL.md 外，安装时一起下载的参考资料和脚本。

engine/
make.sh
engine/template/
audio.py
captions.json
script.json
engine/template/audio/
words_ref.json
engine/template/web/
chars.js
env.js
index.html
lib.js
main.js
shots.js
warp.js
words.js
engine/template/web/fonts/
OFL-lora.txt
OFL-poppins.txt
engine/tools/
align.py
render.js
tts_elevenlabs.py
tts_kokoro.py

详细介绍

/stick-figure

┌──────────────────────┐
│   ☀      ☁           │  bright sky, sea, props drawn in code
│      ◯   ◯           │  stick people with big white heads, expressive faces
│     /|\ /|\          │
│     / \ / \  🛢       │
│     eye patch        │  1-2 word captions, lowercase, ~70% down
└──────────────────────┘

附带一个完整示例：engine/template 是一段已完成的 37 s 短片，标题为“如果海盗眼罩和失去眼睛毫无关系呢？”

首次使用

此技能的文件夹就是 Claude Code 加载它时显示的“Base directory”。

SKILL_DIR="<base directory of this skill>"
ENGINE="$SKILL_DIR/engine"
KIT=$(python3 -c 'import os,sys;print(os.path.realpath(os.path.join(sys.argv[1],"..","..","kit")))' "$SKILL_DIR")
[ -x "$KIT/.venv/bin/python" ] && [ -d "$KIT/models" ] || bash "$KIT/setup.sh" --voice   # ~1 GB of voice models, once
PY="$KIT/.venv/bin/python"; export NODE_PATH="$KIT/node_modules"

需要 ffmpeg、Node 和 Python 3.9+。如需查看示例：cp -r "$ENGINE/template" ~/reels/pirate && bash "$ENGINE/make.sh" ~/reels/pirate。

工作原理

一段短片对应一个文件夹：

  • script.json：配音稿，每个条目一句话。
  • captions.json：字幕的可选文本替换（{"twenty five": "25"}）。
  • web/shots.js：镜头列表。每个镜头都以配音中的秒数为单位，通过 SHOTS.push({start, end, tr, draw(ctx, lt, t)}) 添加；lt 是镜头内的时间，tr 是转场类型（'whip' 或 'cut'）。
  • web/lib.js（缓动、关键帧 kf、形状、文本）、web/chars.js（火柴人骨架 drawStick、帽子、面部、手臂 IK、眼罩）、web/env.js（天空、云、海、船只、甲板、木桶、炮、灯笼、甲板下方）、web/main.js（鞭甩模糊、暗角、颗粒、字幕）。将新道具添加到 env.js，或新建 env2.js（并在 web/index.html 中列出）。
  • audio.py：音乐和音效，全部通过代码合成，并按配音时间放置。

make.sh 会生成配音、对齐每个词（audio/words_new.json）、混合音频、并行渲染镜头，并写入 <folder>/<folder name>.mp4。

时间：audio/words_ref.json 是镜头计时所依据的配音。当配音变化但台词不变时，make.sh 会将镜头时间适配到新录音，因此更换录音无需修改。如果台词有变化，请删除 audio/words_ref.json（下一版录音会成为参考），并重新调整 shots.js 的时间。

步骤

  1. 脚本。 38 到 40 秒的短片约需 110 到 120 个词，每句话表达一个想法：以“如果……会怎样”的钩子开场，介绍普遍认知，用“But”转折，逐步举例，用一个镜头展示原理，最后给出回应开场钩子的结尾。开始动画前先给用户查看。
  2. 事实。 用来源核实每项说法。对于理论要使用保留措辞（“科学家认为”）。
  3. 文件夹。 执行 cp -r "$ENGINE/template" <reel>，然后清空其中的 audio/，并替换 script.json（和 captions.json）。
  4. 配音。 在文件夹中执行："$PY" "$ENGINE/tools/tts_kokoro.py"（免费），或使用用户自己的录音，或使用 ElevenLabs 和 ELEVENLABS_API_KEY（"$PY" "$ENGINE/tools/tts_elevenlabs.py" audio/vo_el.mp3）。将录音放到 audio/vo.wav，然后执行 "$PY" "$ENGINE/tools/align.py" audio/vo.wav，并查看 audio/words_new.json 中的词语时间。
  5. 镜头。 重写 web/shots.js：大约 10 到 12 个场景，大多数持续 2 到 4 s，讲解镜头时间更长。新想法应配一个新场景。开场钩子从第 1 帧就开始呈现动作。人物面部和关键道具应避开字幕区域（y 约为 1250 到 1420），并位于 Instagram 安全区域内（x 100 到 980，y 220 到 1500）。
  6. 静帧。 在文件夹中执行：node "$ENGINE/tools/render.js" stills 1.5,4.2,9.0，生成 stills/。查看内容最丰富的时刻，并在完整渲染前修正问题。
  7. 音效。 根据词语时间编辑 audio.py 中的提示音。
  8. 构建。 执行 bash "$ENGINE/make.sh" <reel>（保留 audio/vo.wav；传入 kokoro、elevenlabs 或一个文件来替换它）。在核心数较多的机器上设置 WORKERS=8。设置 AUDIO_ONLY=1 可重新混音而不重新渲染。
  9. 交付 <reel>/<name>.mp4。

风格

  • 字幕：Poppins Bold，白字加深色描边，每条 1 到 2 个词，全小写，不加标点（main.js 中的 capText() 会处理；数字和 % 保持原样）。画面中不得出现 em dash。
  • 明亮饱和的配色、墨线描边（#221c22）、柔和的接触阴影、缓慢推进并带手持漂移、带动态模糊的鞭甩转场。冲击效果要包含爆发、震动和闪光。
  • 音效音量低于配音（增益约为 0.38）。音乐是安静的拨弦背景音，在配音下方压低，开场绝不能使用音量很大的循环音乐。

评论

支持 Markdown