SPRITE TRIMMING GUIDE
透明留白裁剪为什么会让精灵动画抖动
去掉透明区域可以减小图片边界,也会让资源看起来更整洁。但动画帧并不是互相独立的图片。如果每帧都裁到各自最小可见范围,左上角原点和几何中心就可能逐帧变化。游戏引擎把这些图片放到同一坐标时,角色就会出现并非原画造成的跳动。
裁剪和枢轴解决的是不同问题
裁剪用于删除图片外围完全透明的像素;枢轴用于定义图片中的哪个点落在世界或 UI 坐标上。静态图标往往可以直接裁边,而连续动画需要同时保存帧与帧之间的位置关系。
以脚底位置为例最容易理解
走路动画中,某一帧可能因为左脚向前而更偏左,下一帧则因为右脚向前而更偏右。按可见像素逐帧裁剪会改变包围盒。如果引擎再把每张裁剪后的图片居中,身体就会左右摆动。保持脚底或身体原点稳定可以避免这种人为位移。
静态图片可以更积极地裁边
背包图标、头像和独立特效碎片通常不依赖相邻帧坐标关系。裁边后图片尺寸更贴近内容,在缩略图生成、自动布局和后续处理中往往更容易预测。
动画资源要调整操作顺序
- 先在同一公共画布上播放原始帧,观察是否抖动。
- 确定游戏中必须保持稳定的点:脚底、身体、武器或其他锚点。
- 统一所有帧的枢轴。
- 之后如果继续裁边,导出时要保留枢轴坐标或等价的偏移信息。
还要检查 Alpha 边界
抗锯齿图像可能包含肉眼几乎看不到的低 Alpha 像素。只把 Alpha 0 当作透明的裁剪器可能留下更多边缘;阈值过高又可能切掉柔和阴影或发光。像素画与平滑插画通常需要不同阈值,批量处理前应检查半透明效果。
推荐判断规则
- 独立图片:可以优先考虑裁边。
- 循环动画:先检查枢轴关系。
- 含阴影或发光:确认低 Alpha 像素是否有意义。
- 使用引擎图集:确认引擎如何保存枢轴和裁剪偏移。