把本教程一键复制给 Agent 即可

本文有一段关键内容上了锁,Agent 打开链接也看不到它。请先解锁,再一键复制完整内容给 Agent。

一张头像图,变成会挥手的透明动画:用 sprite-gen 让你的 IP 形象动起来

入门教程:备一张全身原图,让 Codex 或 Claude Code 装好开源 Skill sprite-gen,在 GPT 逐帧和 Grok 视频两条路线里选一条,写清动作、循环和导出格式,再在挑帧页面删掉坏帧,导出能叠进视频、做表情包、放上网站的透明动画。附 3 段可直接复制的提示词。

你会得到什么

你已经有一个固定的 IP 形象,比如头像、吉祥物或者 AI 生成的卡通自己。照这篇做完,它能挥手、点头、庆祝,而且背景是透明的:可以叠在教程视频的角落,可以导出成动图表情,也可以放进个人网站。用的是开源 Skill sprite-gen,交给 Codex 或 Claude Code 去跑,你不用写代码。文中有 3 段可直接复制的提示词。

分工先说清:Agent 负责安装和生成,从出帧、抠透明背景到拼成动画都是它的事,你负责交一张合格的原图,再挑出好看的帧。 原图是成败的一大半,原图不对,后面怎么调都救不回来。

五步做出透明角色动画:备一张全身原图,让 Agent 装好 sprite-gen,选 GPT 出帧或 Grok 视频,写清动作和格式,最后挑帧导出

它为什么能让角色不变脸

直接让 AI 画"挥手的四帧",常见的结果是每一帧的脸都不太一样,背景也抠不干净。sprite-gen 的做法是把你那张原图锁成身份参考,一个动作一行地生成,生成时用纯色背景,再把颜色换成真正的透明通道,最后切成一帧一帧的透明图。

它本来是做游戏角色的工具,GitHub 上近 4000 星,Apache-2.0 许可证。下面这张是仓库里的演示,同一只狼做了待机、工作和庆祝三套动作:

sprite-gen 的挑帧页面:同一只卡通狼的三组动作(待机、敲电脑和庆祝),每组几帧,右侧是循环预览

图片来自 sprite-gen 仓库的 README 和文档。

用在个人 IP 上,要盯住三件事:

  • 原图定稿后再动:脸型、配色和比例在原图里定死,后面只改动作。
  • 动作要简单:挥手、点头、眨眼、开心跳一下都很稳。转身和跑步这类连续动作容易出问题。
  • 用透明格式交付:叠视频用 PNG 序列或 WebP,GIF 只适合做表情包。

第一步:准备一张合格的原图

sprite-gen 要的是一张完整、没裁切的全身待机图,风格、比例和朝向都是最终想要的样子。对照这几条检查:

  • 全身入画,头顶和脚下都留一点空,别只给半身头像。
  • 纯色或干净的背景,不要场景和杂物。
  • 朝向就是最终朝向:要正面就给正面,要侧身就给侧身,别指望它帮你转过来。
  • 手上、头上的小配饰尽量少,配饰在动作里最容易跑位。

如果手上只有一张半身头像,先让 Agent 用它补画一张全身待机图,你确认像了再往下走。

第二步:让 Agent 装好 sprite-gen

把下面这段发给 Codex 或 Claude Code:

帮我安装开源 Skill sprite-gen:https://github.com/aldegad/sprite-gen
要求:
1. 先检查我电脑上有没有 Python 3.11 以上、ffmpeg 和 codex 命令行,缺什么告诉我,别自己装系统级的东西。
2. 把仓库克隆到你的 Skill 目录(Codex 用 ~/.codex/skills/sprite-gen,Claude Code 用 ~/.claude/skills/sprite-gen),在仓库里建 .venv 虚拟环境,再用 pip install -e . 安装。
3. 运行 sprite-gen --help 确认能用。
4. 告诉我它生成图片走的是哪个账号,会不会按次扣费。装好就停,先不要生成任何东西。

最后一条最要紧。sprite-gen 出图默认走你电脑上 codex 命令行登录的 ChatGPT 账号,用的是订阅额度。只有你明确选了 OpenAI API 或 xAI API 时,才会按次扣费,而且它会在调用前提示。让 Agent 先讲清楚,免得用完才发现走了 API。

第三步:选一条路线

很多人以为不用 Grok 就得自己改工作流,其实不用。仓库本来就有两条路线,装好后它会问你选哪条:

路线 用什么动起来 需要什么 适合
GPT 逐行出帧 ChatGPT 的图像模型一帧帧画 codex 登录 ChatGPT 挥手、点头、眨眼这类 4 到 8 帧的小动作
Grok 视频 Grok Imagine 先拍一段视频,再从视频里切出循环 grok 命令行登录 SuperGrok,或者 xAI 的 API Key 更顺滑、帧数更多的动作,比如跳跃、出场

只有 ChatGPT 账号的话,直接选第一条就行,这是正规路线,不算绕路。两条路线最后都会交出透明的帧和预览动图。

第四步:说清动作和格式

这一步决定你拿到的东西能不能直接用。把下面这段改成你自己的内容发给 Agent:

这段关键内容需要登录后解锁

新用户注册就送 10 积分,每天签到再领 1 积分。用 1 积分解锁,以后随时回来都能看。

为什么这样写:动作一行一个,它才能按动作分组生成。"最后一帧回到待机"这句是给挥手用的。按仓库的说明,挥手默认只播一次,想让它循环,就得补一帧回到待机姿势,否则接缝处会跳一下。要求先报调用次数,是因为每个动作都要单独生成,动作越多,用掉的额度越多。

第五步:在挑帧页面里挑一遍

生成不会每一帧都好。sprite-gen 自带一个网页版的挑帧页面:每个动作的所有帧排成一行,右边实时播放循环,你可以删掉崩的帧,拖动换顺序,再微调位置。

sprite-gen 挑帧页面:上面一行是当前的跑步序列,下面是候选帧,右侧实时预览循环

挑的时候重点看三处:脸有没有变、手有没有多指或断开、循环接缝处有没有跳。挑完让 Agent 按你的选择导出,不要用它最初那一版。

抠透明背景这一步也可以单独用。下图是仓库里的例子:一张白底图先换成品红底,再把品红抠成透明。

一盏路灯素材的三步:白底原图、换成品红底、抠成透明背景

拿到动画之后怎么用

用在哪 用哪个文件 怎么放
教程视频角落、开场出场、结尾挥手告别 透明 PNG 序列帧,或者透明 WebP 剪映、Premiere、达芬奇都能导入图片序列,作为一层叠在画面上
动态表情包 GIF 按各平台的表情尺寸要求再压一下大小
个人网站首页挥手欢迎 WebP 动图,或者精灵图加程序播放 直接用 img 标签放 WebP,让 Agent 帮你写进页面

GIF 只有"全透明"和"全不透明"两档,边缘会有锯齿,叠在视频上不好看,所以视频里用 PNG 序列或 WebP。

注意

  • 原图不像,后面全白做:动作生成完才发现脸不对,只能从原图重来。
  • 复杂动作别一次要太多:先做待机和挥手两组,效果满意了再加动作。
  • 看清走哪个账号:订阅额度会用完,选了 API 就按次付费。
  • 它不替你发布:导出的文件要你自己放进剪辑软件、聊天软件或网站。

参考

读完了?标记一下,记录学习进度。登录
收藏起来,稍后再看登录
对这篇有疑问?向 Ask AI 提问

评论(0)

还没有评论,来说第一句。

登录后参与讨论。登录