GoForum🌐 V2EX

我用 AI 做了个开源的纯前端在线小工具:像素素材去背景 + 像素块规范化(自动推断像素块大小/偏移)+ 批量导出统一网格(如 64×64)。适合用 AI 产出角色部件后,在 Godot/Aseprite 里快速拼装

mtjgu · 2026-03-02 13:17 · 0 次点赞 · 0 条回复

最近心血来潮想学做游戏,就照着教程学习 Godot 的玩家场景创建。学完之后发现,教程里一般用的都是序列帧角色,但我自己不太会画画,折腾了几天,成功确认自己没有美术天赋。

后来在看 Godot 文档时,我研究了一下 剪纸动画( Cutout Animation ),发现这个路线对初学者非常友好:只需要把角色拆成头、手、腿等部位,用 AI 生成素材,然后在引擎里拼起来做骨骼动画即可。

但在实践中,用 AI (比如我用的 nano-bananaseedream4.5 等模型)生成部位素材时,有几个非常痛苦的点:

  1. 像素不纯净:AI 生成的“像素风”往往只是看起来像,实际像素块边界模糊、大小不一,尤其是斜线部分,很难微调。
  2. 背景:部位素材经常自带底色/底纹,还得额外抠图/去背景。
  3. 尺寸过大:AI 动辄输出 2048×20481024×1024 的大图,很难直接统一到游戏常用的 32×3264×64 网格中。

为了解决这些痛点,我用 AI 辅助撸了一个开源的节点式工作流工具(纯前端,浏览器端处理):

核心功能

  • 像素网格规范化 (Pixelate):支持 自动模式 自动推断真实像素块大小与偏移,修正 AI 生成图中不一致的像素密度,让素材回归真正的“纯正像素风”。
  • 智能去背景 (RemoveBg):内置了两种方案。一种是轻量级的本地算法(边缘背景色估计 + BFS 扩散),另一种是基于 @imgly/background-removal 的 AI 方案,专门对付复杂背景。
  • 节点式工作流:采用类似 n8n 的节点操作,支持 上传图片 -> 去背景 -> 像素化 这种自由组合,所见即所得。
  • 批量导出:支持统一目标网格尺寸(如 64×64),一键导出透明 PNG ,配合 Aseprite 调整或直接进引擎都很方便。

效果演示

Workflow demo

在 Godot 中尝试拼接的角色:

Godot 拼接效果

( PS:虽然模仿 Elona Mobile 拼出来的角色还是有点“割裂感”,但起码流程跑通了,再也不用去画那磨人的序列帧了。)

非常欢迎各位大佬提提意见,如果觉得有用欢迎点个 Star 。

相关链接

0 条回复
添加回复
你还需要 登录 后发表回复

登录后可发帖和回复

登录 注册
主题信息
作者: mtjgu
发布: 2026-03-02
点赞: 0
回复: 0