画好的 SVG 怎么动起来不像 PPT:把动画经验交给 Agent

让角色抬手并不难，难的是抬手前重心如何移动、手停住后头发怎样跟上。如果每个部位只在几个姿势之间切换，再漂亮的插画也可能像幻灯片。

— 角色全身表演

图源：官方仓库 demo，纯代码绘制并渲染

一句话结论：rossark-motion-skill 不是一键动画 App，而是一套供编程 Agent 使用的动作规则、代码模板和测量方法。

核心要点

怎么选／速览：已有角色、植物或图标，想让 Agent 基于代码制作可调整的动效，可以从这套方法入手；如果需要现成动画编辑器或无需处理素材的全自动成片，它不是这类产品。项目提供 React Native 和 SwiftUI 模板，网页可借鉴同一套数学方法；实际接入仍要适配现有绘图结构。

常见问题是把姿势当成静图：表情直接替换，各部位同时启停，眨眼太短像闪烁。缺少连续变化，动作便显得机械。

项目区分两种关键帧读取方式：track 到每个关键点会停一下，适合眨眼或开门；flow 以连续速度经过姿态，不在每个点刹停，更适合身体和手臂表演。要短暂停留，可以重复姿态值，再叠加微动，而不是让整个人物彻底冻结。

一组角色或一个场景共用时钟，各部位从同一个时间值计算动作，而非为每根头发单独开一个计时器。手臂绕肩旋转，头绕脖子旋转；尾巴和头发则延迟读取身体动作，再逐渐跟上。项目给出的跟随起点是延迟约 60–150 毫秒、力度为父动作的 0.3–0.6 倍，具体仍需按画面调整。

待机不是大幅晃动：角色呼吸可先从 3–5 秒移动 1–2 个绘图单位试起；眨眼可约 3–4 秒一次，闭眼约 110 毫秒、睁眼约 190 毫秒。这些是调参起点，不是通用定律。通常选一个主动作，再加两三个低调的循环，就足够让画面有生命感。

— 花园浇水场景

图源：官方仓库 demo，纯代码绘制并渲染

仓库提供两套平台的时钟与曲线代码，以及可配置眼睛、嘴巴的面部模板。面对参考视频，先用 sheet.sh 输出全帧率分镜，观察动作节奏；再用 track_edges.py 追踪主体边缘，测量呼吸、摇摆的幅度和周期。项目提醒，约 1%–5% 的小动作可能在分镜图上看不出来。

接着用 sample_colors.py 从画面取色，把动作节拍写成时间段，分部位建模；最后在相同时间点并排比较参考与成片。项目的另一组卡片示例展示了同样的思路不只适用于角色。

— 卡片环绕场景

图源：官方仓库 demo，纯代码绘制并渲染

先从已有插画中选一个主动作，将头、手等需要运动的部分按关节拆层，再调小幅度和时间曲线。检查循环首尾是否接上、眼睑边缘是否露出细线；隐藏或离屏时暂停时钟，开启减少动态效果时，循环应停在合适的首帧，单次动作展示最终帧。界面中高频操作也应比庆祝场景更克制。

参考视频的图像不等于可自由商用的素材：公开发布时应使用原创或获得授权的作品，并在目标设备上检查帧率和效果。抓取时仓库快照约 500+ star，这只能说明当时的关注度，不代表适配所有项目。

GitHub 项目仓库

https://github.com/rossark0/rossark-motion-skill

项目技能正文

https://github.com/rossark0/rossark-motion-skill/blob/main/SKILL.md

项目 README

https://github.com/rossark0/rossark-motion-skill/blob/main/README.md