Communitygithub.com

nikisge/claude-motion-kit

用于创作或修改动态图形作品(宣传片、解释性动画、YouTube插入片段、白板图形、社交媒体/竖屏剪辑、作品集、一次性展示)以及在编写场景代码之前的使用;也适用于当动态作品看起来像幻灯片、网站或通用AI输出,或感觉静态、缓慢时。触发词:Motion Graphics, Animation, Launchvideo, Erklärvideo, Einblendung, Showcase, Stil, "wie ein Motion Designer"。

claude-motion-kit 是什么?

该技能赋予AI Agent像专业动态设计师一样思考和工作的方法论与工具集。它提供了从创意简报、风格参考、分镜设计到构建、质量检查以及最终声音制作的端到端工作流,避免生成千篇一律的AI视频。该技能强调基于具体参考的“语法”学习(如节奏、转场、镜头运动),而非复用内容,并强制要求每部影片做出有意识的风格决策并融入至少一个原创想法。它支持HyperFrames(HTML + GSAP + Three.js)、3D(Three.js/Blender)以及真实视频模型等多种引擎,用户可根据项目类型选择合适的工具。核心原则包括:每个镜头必须是动态的画面、每个转场应是一个物体、避免静止无意义的段落、以及每个镜头只突出一个视觉重点。

兼容平台✓Claude Code~Codex CLI✓Cursor
npx skills add https://github.com/nikisge/claude-motion-kit/tree/HEAD/motion-kit/skills/motion-director

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

Motion Director: 像动态设计师一样工作

模型可以制作动画。但它缺少的是品味、具体的参考以及带有检查的流程。本技能正是提供这些。渲染引擎是可替换的(默认:HyperFrames、HTML + GSAP + Three.js → MP4)。

核心态度:

  • 你要为每部影片自行构建组件和专属设计。目录(HyperFrames注册表、配方)是资源宝库,而非现成套件。
  • 参考资料提供的是语法(节奏、转场、镜头运动、字体行为),而非内容。
  • 对抗AI同质化:每部影片做出一个有意识的风格决策,加上至少一个原创想法。
  • 绝不“从零开始”:没有具体参考,模型只会猜测,结果就像任何AI视频一样。

工具位于技能 motion-inspo 中(scripts/refs.py、sheet.py、ref_metrics.py、motion_check.py、beats.py)。项目位于工作目录的 projects/<name>/ 文件夹中。

先读任务,再选路径

任务路径格式部分(见 references/formats.md)
新影片(发布片、解释片、作品集)标准流程发布片 / 解释动画 / 作品集
YouTube插入片段、白板图形标准流程,精简版(用词句时间代替音乐)YouTube插入片段
社交媒体 / 竖屏标准流程,钩子优先社交竖屏
“单镜头”、“展示片”、“展示你的能力”、无需提问的测试单镜头模式展示片
小任务(修改一个场景、Logo闪白、数字动画、反馈修复)精简路径–

精简路径: 一句话描述目标,调整分镜中受影响的镜头(如有),构建,对片段运行 motion_check(使用 --from/--to),查看单帧,展示。无需新简报,无需Critic。

标准流程(新影片)

  1. 简报(references/brief.md):一个承诺、一个想法、目标感受、格式、品牌、音调角色。
  2. 风格 + 目标参考:
    • 从 references/styles/README.md 中选择风格卡片,混合或自行衍生。
    • 寻找一个目标参考(motion-inspo、whatships.com),测量(ref_metrics.py)并逐镜头分解。测量值将成为简报中的目标(references/inspiration.md)。
    • 2–5个额外参考仅作为语法。记录自己的原创想法。
  3. 与用户进行灵感 + 情绪板分享: 将参考时刻以图像序列展示,提供2–3个故事方向。用户在真实图像上做决定,而非描述。关口。
  4. 在目标工具中制作3个风格帧(references/style-frames.md)。关口:用户批准。
  5. 在节拍网格上制作分镜 + 动态故事板(references/storyboard.md、beats.py)。关口。
  6. 构建,逐个镜头。先构建最难的镜头。
  7. 检查:
    • motion_check.py render.mp4 配合风格的阈值(references/rules.md),
    • ref_metrics.py render.mp4 --ref ziel.mp4 --out check/metrics,
    • 自行查看4帧/秒的接触印相,
    • 然后进行独立的Critic(references/critic.md),它只看到图像和数字,不看到代码。
  8. 声音 使用技能 motion-sound(提示列表,混音至 −14 LUFS)。
  9. 完成: 导出(10位 + 细腻颗粒防止色带),接触印相,简短报告。

修改总是先修改分镜,再修改代码。

首版后最多进行2轮Critic,然后交付最佳版本并诚实指出缺点。无尽的改进循环耗费数小时,每次仅提高少量分数。

单镜头 / 展示片模式

无需提问,无需等待批准,全力以赴。观众应感到惊叹并理解你能为他们构建什么(references/formats.md → 展示片)。

  1. 创意环节(brief.md):用一句话构思5个故事创意。删掉你想到的第一个创意,以及任何主角是行业工具(关键帧、时间线、缓动曲线、光标)的创意。选择那些可以复述的创意。
  2. 简报、风格、目标参考(测量 + 分解)、原创想法:自行决定并说明理由。
  3. 计划至少两个令人惊叹的镜头(技术、秒数、理由),这些镜头构建难度较高。它们将优先构建。
  4. 为自己制作风格帧 + 分镜 + 动态故事板。
  5. 在动画制作前进行Critic(子Agent,强模型,全新上下文)。仅在批准后开始动画。
  6. 构建、检查、声音。
  7. 在最终渲染上进行最终Critic。若低于展示片标准:优先处理最薄弱的镜头,若“惊叹感”不足,则加强令人惊叹的镜头而非打磨小细节。

选择工具

当需要工具
UI、字体、2.5D镜头、SVG、图表HyperFrames(HeyGen的技能:npx hyperframes skills)
真实3D(产品、金属、玻璃、景深模糊)技能 motion-3d(HyperFrames中的Three.js,可选Blender)
真实世界、人物、地点视频模型(Kling、Seedance、Veo等),消耗积分;在剪辑中为每个AI镜头添加代码镜头运动
声音技能 motion-sound

决定一切的关键原则

  • 每个镜头是一幅“在动的画”,而非带插图的句子。文本最多以一个单词形式出现在物体上。
  • 每个转场是一个物体(显示屏变成UI,芯片变成页面)。淡入淡出是应急方案。
  • 没有静止不动的理由: 阅读休止是一种缓慢的、指向下一目标的运动,而非定格。
  • 每个镜头只做一件突出的事。 同时动画所有东西等于什么都没动画。
  • 禁止幻灯片和网站卡片(标题+文本、功能方块、图标网格、编号01/02/03),以及典型的AI结尾卡片(空白区域上的Logo+口号+URL)。结尾应该是一幅“在动的画”,或一个变成Logo的物体。
  • 最强的图像属于前2秒。 影片应从运动中开始,绝不以黑场淡入开始。

测试中效果最好的做法

  1. 每部影片一个经过测量的目标参考。 感觉上的密度通常来自镜头运动,而非剪辑。测量能显示这一点,单靠眼睛做不到。
  2. 一个独立的Critic。 开发者往往高估自己的作品,而新视角在接触印相上能立即发现图像缺陷。
  3. 避免“工具为主角”的创意环节。 影片的失败更多源于故事而非技术。
  4. 品味作为数据: 记录用户喜欢的参考和反参考(“slop”)。

参考资料

brief.md · inspiration.md · style-frames.md · storyboard.md · rules.md(数字、检查阈值) · critic.md · formats.md · styles/(风格卡片)

Individual skills in this repo

This repo contains 4 individual skills — each has its own dedicated page.

相关技能