精简和压缩：2D动画优化技巧

AngerForce: Reloaded 是我们制作的一款九十年代街机风格的 STG 游戏，目前已经发布，可以在Steam中下载到。你没有玩过这款游戏也没有关系，这并不影响你阅读后面的内容。

本篇文章还是用我们游戏项目里的例子，说说动画制作和优化时的一些小把戏。

插播个广告：AngerForce的Switch、PS4和Xbox版本也基本移植完毕了，近期将会发布，喜欢STG的同学请奔走相告，千万别错过。ヽ(∀ﾟ )人(ﾟ∀ﾟ)人( ﾟ∀)人(∀ﾟ )人(ﾟ∀ﾟ)人( ﾟ∀)ﾉ

开发组的知乎专栏：右左上下AB。

纹理优化

2013年，我第一次看到《龙之皇冠》的2D动画时彻底惊呆了。
当时我还是个菜逼，刚刚和小伙伴们组了个票友班子开始做游戏。我们的动画工具是自己开发的，功能十分有限。看到龙之皇冠的动画，我完全没有头绪应该怎么去实现，更不要想有一天能用FFD等动画技术制作自己的游戏了。

（扯得有点远，工具我就不安利了……）

这次作为例子的Boss拥有4个阶段形态，每个形态的各个动画加起来一共有40多个动画。这个Boss体型巨大，但所有动画所用纹理只有下面这张1024x1024大小的纹理。

之前的文章中提到了一些常用的制作2D动画的技巧：网格形变、关节替换、遮蔽物。在开始之前，我想特别说明的一点是：上述所有技巧得应用有一个前提——合理的设计方案。

设计是动画实现的天花板

一个机体能够做出怎样的动作在设计时就已经决定了，实现动画只是演出这个机体的设计。机甲想要做出比较帅的动作和变形，需要有结构上的支持。设计OK，动画实现就水到渠成。

设定阶段需要确定动画的细节：这单位如何行动、攻击方式是怎样的、如何展开武器结构等等。

下图是这个Boss最终决定时的设计图：
我们确定设计可行的话，就会为这个单位制作模型，渲染出这个机甲在游戏中最终的样子，确定他在场景中的效果：

优化的细节

动画优化的技巧，在之前的文章中其实都有提到过，在此我再总结一下：

1. 部件关节充分拆解。
2. 利用镜像翻转减少素材。
3. 小幅动作使用网格形变。
4. 关节替换配合位移制造整体效果。
5. 特定关节采用低精度素材。

合理的应用这些技巧，让这个Boss复杂的动画得以使用非常少的素材完成。

充分拆解

接下来进入制作动画的阶段，我们会拆解所用的关节，单独渲染某些关节所需的透视角度，然后将这些关节导入动画工具。

这是这个单位在动画编辑器里的工程：

充分拆解为了两点：①最大化复用关节；②动画处理操作起来更容易处理前后层关系，产生更好的动态立体效果。

不过拆解比较细也会造成动画制作的额外难点——在骨骼绑定的时候工作量比较大，你需要思考清楚各个关节在绑定骨骼时的**关系。所以，在实现中，究竟要拆解到何种程度，需要各位自己来权衡。

利用镜像减少素材

一些特定的关节，如果是对称的，那么我们全可以用镜像来缩减素材量。

镜像的话，纹理的阴影会不正确，可能会影响单位的体积感，这点请注意。这部分我们处理的比较“偷”——根本没渲影子。

小幅动作使用FFD

FFD在之前的文章中已经介绍过了，这个技术应用合理就是神技。

机甲题材配合网格形变有非常大的优势——机甲单位有很多规整的几何图形，在定义网格时是很好的参照，形变时更容易操作，也会制造更出色的视觉效果。

这个Boss很多关键帧都是通过网格形变得到的，这让复杂的动画得以使用非常少的素材完成。

网格形变在小幅度的透视变化下，效果非常出色，但想提醒一点就是，不要滥用。有些动画师非常执着与追求应用这个技术制作类似3D效果的平滑动画，比如侧转之后补个面啊一类的。

对于这点我想说，如果你特别在意3D的效果就应该用3D来实现，这才是最经济的。2D技术刻意去模拟这个得不偿失。

使用低精度素材

部分关节，如果无伤大雅，完全可以使用低精度的素材。比如说：被其他纹理所覆盖的关节；不影响动画观感的关节，像光芒、带有模糊效果的纹理；在动画中出现时间较短的纹理。

下面这个动画中，旋转的炮轮是使用同一张纹理进行镜像并放大得到的，你能看出它的像素精度只有其他纹理的一半吗：

使用低精度的素材放大

几个胡逼的例子

上面是正经的套路，下面说点邪门歪道。

AngerForce: Reloaded的一些单位是在老Boss的方案基础上修改的，但最初Strikers和Reloaded重制相隔了了大概4年，最早设计的时候我们还都是菜鸟，很多地方没考虑的特别仔细。

Reloaded重制时，我们对每个Boss明确了流程要求：至少3个形态，每个形态多种攻击动作，清晰的武器结构等等。开头提到过，单位的动作需要有结构上的支持，但AngerForce的老设计翻新多少得碰上点结构不支持的例子。

这个Boss在Strikers的第四关登场，设定上是一个非常耳鼻摇滚乐队样的战斗小队，分别驾驶着不同的部件先和玩家在关卡中战斗，然后在最后关底合在一块和玩家继续干。

这个Boss后来给我们找了不少麻烦

当时这boss只有一个形态，结构简单合体后的行动能力有限，攻击动作都是硬怼出来的。而且这个boss两边有两个大轮子，如果进行左右方向的移动会在视觉上特别难受，就像是悬浮在场景中，最后我们只给他做了倒退移动（屏幕X轴方向没有位移）。

Reloaded这个Boss翻新特别难搞，我们觉得这玩意儿真是积重难返了，甚至考虑过设计一个新的守关Boss，最后硬着头皮给他重做了。

改造后

我们修改了一体下半身的造型，把轮椅改成了气垫船了。这样Boss是悬浮在地面之上，左右移动也就不违和了。但气垫船也没有支持变形的结构，为了拥有第二形态，我们又给他重新设计了一个新的身体，让他一体战毁后还能接着打。

而在三体时，这个小队的老大开着残破的脑袋瓜子拉着他的两个小**和玩家进行最后的殊死搏斗。

小弟没了载具只能扒软梯

但二体的新身体还是有的问题——缺少武器结构，他肚子是个驾驶舱。这时候我们基本把头都已经想破了，结构、合理性什么的想要兼顾的话已经很难设计了。

(´-ι_-｀)

没招，最后我们就胡逼了。 二体的武器都是Boss各种从后背直接掏，神马结构的根本不管了。

自带动态模糊(´ー`)

动画的中间过渡我们就给了这么一帧。

转身后还能从肚子里掏各种僚机，无敌了，简直跟机器猫一样。

不过效果似乎不怎么违和，感觉还能接受。(⁰⊖⁰)

合理的过程掩盖不合理的结果

后来，我们就发现：如果提供了一个“清晰合理的前摇”，然后产生一个并“不合理的结果”，观看者是可以接受的。

比如同一个空间结构，两次展开出现了不同的结构，你肯定想“这特么不科学”。( ºΔº )

但是，如果稍稍做一点改变，加一些前摇动画进去后……

这次再看似乎有那么点儿道理了，嗯。(´-ω-｀)

隐藏违和部分

还有另一种情况，用合理的结构可以隐藏不合理的结构，整体观感也是OK的。

Boss出场时，箱体正面舱门掀开，同时中间的横梁缓缓回缩……等到完全展开时，你会发现，横梁在箱体中根本没有可回收的空间和结构。但在动画连续播放时，舱门遮挡了部分视线，玩家只可以看到横梁收缩，无法看到后面“供回收的结构”（其实根本不存在），可视的部分合理而正确，会让玩家误认为一切都是合理的。

展示合理的部分，而隐藏违和的部分，也是一个重要的技巧。

总结

上述就是我们在制作AngerForce这个游戏时的一些优化的一些技巧和总结，这些技巧具体如何应用，或者应用到何种程度还是需要根据情况来。一些技巧应用的优劣我也写了出来，如果你也正在制作一款2D游戏，希望这个文章能对你有帮助。

最近一直在制作新的游戏：轮回深渊AncientAbyss，这篇文章也是拖了很久了。之后暂时不写AngerForce了，陆续整理一些新游戏里面有意思的东西写写吧。这里也放一个我们新作的海报，喜欢的话可以拿去当手机壁纸。

新作：轮回深渊AncientAbyss

我们近期会带着这款游戏参加11月3在上海的WePlay游戏展，以及11月和12月的广州厦门两站核聚变，也会在在微博上陆续发一些素材和内容，感兴趣的话，请在微博上关注我们：http://weibo.com/thescreambox