AI 辅助制作 Spine 序列帧动画工作流：从创意到 Cocos 引擎只需 3 步

在独立游戏开发中，动画制作往往是成本最高的环节之一。骨骼绑定了、K 帧完成、网格变形调试好——一个角色的成本可能是数天甚至数周。

但如果有一种方式，从一张图或一个创意 Idea 开始，半小时内就能产出可用的 Spine 动画素材呢？

Cocos 论坛的 davidwangcn9（晨风工坊） 分享了一套完整的工作流，借助 AI 生成视频 + 两套自研工具，快速制作 Spine 序列帧动画，很适合独立开发者和小团队。

⚠️ 声明：这种方式产出的已是”披着 Spine 外衣的序列帧动画”，并非传统意义的骨骼动画。包体会变大，失去了 Spine 骨骼动画的灵魂。但好处是上手极快，适合量大于质的场景——小怪、道具、特效等。

适用场景

作者的做法是主角老老实实做 K 帧绑骨骼，小怪用这套流程——搭配着来。

工作流全景

创意/图片 → AI 生成视频 → 转序列帧 → 生成 Spine → 导入引擎
   ①           ②             ③          ④

工具链：

• 豆包 AI（免费，每天 10 次视频生成）
• 视频转序列帧图片生成器（自研，免费）
• Spine 序列帧动画生成器（自研，免费）
• 目标引擎：Cocos Creator / Unity / Godot

Step 1：AI 生成动画视频

1.1 文生图

如果从创意出发，用文字描述让 AI 出图。关键在于提示词的质量——背景颜色、站姿（A-Pose）、手脚摆放都直接影响后续效果。

作者在豆包上制作了一个智能体，输入”复古动画，中国古代剑客”就能自动生成丰富的人物提示词：

用户输入：复古动画，中国古代剑客
智能体输出：完整的 A-Pose 人物描述 + 背景颜色 + 构图参数

选图的标准：

• ✅ A-Pose 侧身站立
• ✅ 人物无阴影或影子
• ✅ 背景颜色统一、无渐变

如果已有设计稿，可以跳过这一步直接图生视频。

1.2 图生视频

将选好的参考图上传到豆包，添加提示词。提示词的关键是包含：人物、朝向、如何做、做什么。

例如制作跑步动画：

让人物朝侧面原地不断快速奔跑

豆包默认生成 5 秒视频。只需其中 1-2 秒包含一组可闭环且流畅的动作即可——从左脚踏地到右脚踏地，再回到左脚踏地。

💡 如果需要复杂动作，可以用火山方舟平台生成 10 秒视频（底层与豆包相同），免费额度用完后需要付费。

Step 2：视频转序列帧图片

使用自研工具 视频转序列帧图片生成器，将 AI 生成的视频处理成序列帧：

2.1 导入与预览

将视频导入工具，预览找到包含关键动作的视频片段。通常不需要整个 5 秒，只需截取包含完整动作循环的 1-2 秒。

2.2 选取视频片段

通过拖拽 Slider 标记起始和结束时间。工具会循环播放所选片段，方便确认。

2.3 提取并选择关键帧

这是最影响动画质量的一步。关键参数：

提取后通过拖拽帧滑块快速预览，筛选出能形成连贯动作的连续帧。例如跑步：从第 9 帧（右脚着地）到第 23 帧（右脚即将再次着地）形成一个完整循环。

2.4 抠图与去水印

工具提供两种抠图方式：

颜色容差是关键参数：

• 调大 → 抠图更猛（可能伤到主体）
• 调小 → 保留更多（可能有残留）

去水印使用区域选择算法，默认勾选四个角。如果画面中的武器等元素会划过某个角，需要取消勾选那个角。

2.5 缩放

AI 生成的分辨率通常较大（720×720），游戏中一般需要缩小。支持自定义尺寸和预设（64/128/256/512），使用 Pica library（Lanczos3 算法） 保留最多细节。

2.6 生成序列帧图片

输出一张长图，宽度 = 单帧宽度 × 帧数，高度 = 单帧高度。支持快速预览后下载。

Step 3：序列帧转 Spine 动画

使用第二个自研工具 Spine 序列帧动画生成器：

3.1 添加动画组

将上一步生成的序列帧图片拖拽到工具中，配置：

支持设置 Spine 事件——拖拽触发帧滑块选择帧，填写事件名称。即使不需要事件，也可以利用这个滑块快速预览切分效果。

支持添加多个动画组，一个角色可以有多个动作。

3.2 生成与预览

填写文件名，点击生成 Spine 动画。支持：

• 切换预览动画动作
• 切换背景颜色
• 打包下载（.png + .atlas + .json，Spine 3.8.99 格式）

注意：当前仅支持 3.8.99 版本，不支持 .skel 二进制文件。

Step 4：导入 Cocos Creator

将下载的三个文件直接拖入 Cocos Creator 的 Spine 组件中即可使用。作者以”古代剑客”角色为例，制作了奔跑、跳舞、摔倒、起剑四个动作，全部在 Cocos 中顺畅运行。

写在最后

这套工作流的核心思路是用效率换质量——在还不需要高质量美术资源的阶段，快速产出足够使用的动画素材。

工具都是免费的（只要服务器负载允许），作者会持续改进。最新的动态会在他的 Bilibili 主页发布。

对于独立开发者来说，这不会是动画制作的终极方案，但它提供了一个非常实用的起点：当你需要在周末把一个想法变成可玩的游戏 Demo，这些”黑科技”工具可以帮助省下大把时间。

参考资料

1. Cocos 论坛原文：AI加持”黑科技”工作流快速制作Spine序列帧动画 (作者: davidwangcn9 / 晨风工坊)
2. 视频转序列帧图片生成器 — 见论坛原文链接
3. Spine 序列帧动画生成器 — 见论坛原文链接
4. 作者 Bilibili 主页 — 见论坛原文链接