Spine(2D骨骼动画制作)

Spine官方版是一款专为软件和游戏而量身打造的2D动画软件。传统的二维动画的制作是依靠每秒播放大量的手绘图片的方式来完成的，而这种方式虽然可做到精致但非常耗费精力和成本显然得不偿失，而现如今随着科技的日益更新，越来越多的最新科技被应用于各行各业，显然二维动画制作行业也涉及其中，其中在这行业最为受益也是最突出的无疑就是-Spine。它具有良好的UI设计和完整的2D骨骼动画编辑功能，包含皮肤、自由变形、蒙皮等等特色功能，用户可通过将图片绑定到骨骼上来控制骨骼并实现动画播放，甚至他还可模拟人体复杂的动画运行，以此使得游戏的动画细节变的更加精致。Spine允许您在矩形边界内自定义多边形，而这种优化方式可将在多边形外的像素自动忽略掉，从而在最大限度内提高最终纹理贴图集的空间使用率，同时它还允许用户通过移动网格点来变形图片，可实现拉伸、挤压、弯曲、反弹等一些矩形图片无法实现的功能。此外，新版Spine新增的“蒙皮”功能，可允许用户网格中指定的点附加给指定骨骼，然后附加点就可随着骨骼移动，网格则随之自动发生变形，而这种方式就可让用户利用骨骼动作来控制角色的图片进行弯曲变形。

功能区翻译

PS:由于是全英文，所以这里简单的翻译和解释下主界面的相应功能

一、装配模式功能区

1.主菜单：点击这里会弹出Spine的主菜单，按地球文明的习惯，一般：打开、保存、新建、导出、导入、系统设置，之类的功能都放在这里

2.项目名称：当前项目的文件名显示在这

3.当前模式：【ctrl + tab】在Spine的装配模式、动画模式间切换

4.层级树窗口按钮：【ctrl + T】点击展开和关闭层级窗口，拖拽调整窗口大小

5.层级树窗口：以树型结构显示的大纲目录，项目中所有的对象都在这里，相当于Windows资源管理器左边的导航窗格

6.功能区：它是层级窗口底部的扩展面板，类似于PS上方的选项栏，会根据所选内容变化。节点的：新建、删除、复制、重命名、更改层级、修改属性等大多数操作都在这里。自已分别选择一下各种节点，看看效果吧。

7.试用版：这个只有在试用版显示，意思就是告诉你这是试用版。如果你看到这个就不要再问，为什么我不能导出，为什么我不能保存这一类的问题

8.当前对象：当前选中对象的名称。如果选中多个对象就只显示数量。

9.视图缩放控制：【ctrl + F, ctrl + shift + F, ctrl + shift + alt + F】就是放大缩小场景中的对象，以方便显示嘛，那几个图标都点一下，看看效果吧

10.工具：这个面板就叫工具，从上到下分别是IK【B】，权重【G】，创建骨骼【N】。(要说明的是这个Pose和右边层级目录中的Constraints别搞混了，其实在别的软件中，这两个东西是合在一起的叫作IK，在这给拆成两半了)

11.变换工具：这里就是旋转、位移、缩放了，右边的小钥匙就是K帧按钮。绿色表示值无变化，黄色表示改变了值，但未创建关键帧，红色表示已经改变了值并创建了关键帧

12.坐标系：当前，父级，世界。这个就不解释了，不明白的就google吧

13.抵消变换：主要的用途就是旋转、位移、缩放父对象时，保持它的子对象不动

14.选项：这里是分别针对骨骼、图片、边界框的是否可选、是否显示的控制开关

二、动画模式功能区

1.摄影表(时间轴)：【ctrl + D】按住Dopesheet按钮拖拽可以调整窗口大小。这里就是动画师的主要战场了。所有关键帧数据都显示在这里。摄影表的数据也是按层级显示的。未选中任何对象时，摄影表默认显示整个角色的关键帧数据，第一行是当前动作名称，等同于：层级树(Tree) > 动画节点(Animations)下当前显示的那个动作。(小眼睛那一列是显示开关)

2.当前帧：可以输入数字，实现跳转。

3.循环起始点：点击设置当前帧为起始点，再次点击消除。开启循环，并设置了结束点时，才有用。

4.循环结束点：点击设置当前帧为结束点，再次点击消除。开启循环，并设置了起始点时，才有用。

5.自动关键帧：这个就不解释了吧。

6.幻影：(其实就是FLASH里的洋葱皮，没有用过FLASH也没关系，GOOGLE一下，就知道了)它只是用于辅助调动画的预览效果，不能输出。

7.播放控制

8.折叠展开：折叠和展开摄影表中的层级对象。

9.锁定显示：锁定摄影中显示的对象，当你改选别的对象时，摄影表里不变。

10.刷新摄影表：锁定摄影表的情况下，通过它来更新摄影表以显示当前选中的对象。

11.选择摄影表中对象：锁定摄影表的情况下，通过它可以快捷的选中摄影表中显示的对象。

12.复制剪切删除粘贴：这几个东西就不说了吧。

13.整体平移关键帧：就是按住Alt移动关键帧的功能。

14.同时在多帧上修改对象：比如把角色，在所有帧统一向前移动N个单位。

15.翻转动画：框选关键帧缩放时，如果越过另一边界，能实现翻转效果。（好像默认就是如此，开不开这个都一样）

16.播放按钮：地球通用，不多说了。

17.循环开关：【Ctrl + R】开启和关闭循环播放。

18.曲线编辑器：本来这里才应该是动画师的主战场。不过Spine中，曲线编辑器只算是个配角了。只能显示两帧之间的过度。

19.过度方式：支持线性，贝塞尔，步进式三种。

20.匹配曲线：Match可以实现复制曲线的效果。先选中你要复制的帧，然后选择一个或多个目标帧。源帧的曲线是亮的，目标的曲线是灰的。点一下贝塞尔手柄，目标就自动匹配了。（鼠标靠近塞尔手柄会有反应。）换句话说，其实就是不开这个功能，你调曲线就只影响第一个选择的帧，如果开了，就同时影响所有选择的帧

三、层级树窗口功能区

1.显示过滤开关：骨骼、资源夹(Slot)、附件(attachments)。打开的就显示，关掉就不显示了。

2.聚焦到选择：在场景中选择了对象，层级树中自动跳转以显示它。

3.文本替换

4.层级树主体：分三列，第一列：显示开关，第二列：关键帧按钮（只有动画模式才显示），第三列：层级节点。

5.节点介绍：

a)角色骨架：顶级小人图标。一个项目中可以创建多个角色骨架。骨架下是一些主要的类型子节点。与其它节点的创建方式稍有不同，角色骨架的创建按钮，在主菜单里。

b)骨骼：角色的骨骼层级关系都记录在这里。

c)显示层级：显示层和骨骼层级是两个概念。图片前后遮挡关系，在这里调整。

d)图片路径：这里显示硬盘上的图片资源。Spine只是从路径引用图片，并没有把文件导进项目。只是原封不动的显示硬盘上文件夹的内容。

e)皮肤：这个是换皮功能，是改变角色外观用的，比如官方例子的哥布林，男女切换。它和蒙皮是两个东西。可以为角色创建多套皮肤方案，它们都将存放在此节点下

f)动画：一个角色可以创建多个动作，都存放在此节点下。

g)事件：这个主要是在运行时，给程序发送参数用的。创建一个事件对象节点，然后按程序需求在指定帧上K上指定的参数。其实不要看到事件，就觉得高深艰涩。在编辑器中，你就把它看成是一个骨骼，Interger,Float,String三个属性其实和旋转位置缩放本质上一样，你只要像平时那样，按需求在相应的时间K帧，就行了。

h)约束：用于锁定IK，实现踩踏关键帧效果，也就是角色动画中常说的“定脚”

6.节点名称：节点的名称。右边三个按钮是复制，改名，删除。

7.骨骼长度：骨骼长度为0时，会显示成十字图标。只是看上去不一样，与其它骨骼没有什么不同。

8.继承变换：默认子物体会继承父级的变换属性。缩放、旋转，按需求勾选或取消吧。

9.骨骼颜色：加上颜色好辨认嘛。

10.创建：可以在骨骼下创建骨骼、资源夹(Slot)、皮肤占位符(Skin Placeholder)、边界框(Bounding Box)。不要问为什么不能创建图片这么2的问题了吧。都说了图片是从图片(Images)拖到进来的。

11.设置父级：【P】，选中对象，按P，再点选父级。选中的对象就飞过去给人家当儿子了。其实直接在层级树里用鼠标拖拽也很方便。

12.激活边界：点上它就相当于一个边界框了，可以用来做碰撞了

13.图片的路径：前面说了Spine的图片只是引用自硬盘上的。那它是怎么来确认图片路径的呢？项目所在路径 + Images的Path属性 + 图片的路径。这就是一个最终用于显示的图片路径。如果图片显示有问题，那你把这三段，拼起来看看，所指向的位置是否是正确的

14.激活网格：勾上它图片就变成网格对象了。

15.参考背影：勾上它图片就变成参考图了，在场景中不可选，只在编辑动画时显示，不会输出到最终的动画数据里。

16.颜色叠加：叠加颜色，调整透明度什么的。（这个只能在装配模式设置，动画中不能更改）。要做颜色和透明度的动画，请操作资源夹(Slot)上的相应属性

17.显示层级：图片的前后显示关系在这里调整，可以直接鼠标拖动，也可以选中后，用小键盘的【+ -】号调整（可以配合Shfit）。不一定要在层级树中选，直接在场景中选中图片也可以按小键盘的【+ -】号调整。（补充说明动画模式下不能选图片，因为图片上没有可动画属性，但是图片找到网格就可以选了，因为网络有动画可以做）

18.图片文件夹：将硬盘内容显示在这里。硬盘路径就是，项目文件所在目录 + Path值。改动了Path没有反应可以按Refresh刷新。

19.皮肤：只有一个创建按钮，就不多说了。

20.动画：这里也只有一个创建。

21.事件：这个也只有一个创建。

22.约束：这个也只有一个创建。

使用技巧

1.单帧全选(关键帧)：点击第一行(动作名称这行)上的关键帧图标，就能选择此帧上的所有的关键帧。同理选中任何一个父级，它下面的属性的关键帧就会被选中。比如骨骼。

2.多帧框选(关键帧)：当然也可以框选这一行，那么场景中所有的关键帧就都选中了。

3.关键帧的颜色：关键帧标记的颜色与其相关的属性对应，白色表示此父级下多个属性都创建了关键帧。

4.框选关键帧：按住Ctrl的同时拖拽，可以框选关键帧。这个主要是方便在鼠标所在处有关键帧的时候，如果直接按下就变成点选了。比如从第0帧开始向右框选，这种情况相信很多朋友都纠结过吧。

5.移动非整数帧：按住Shift 的同时拖关键帧，就可以移动半帧了。（少用为妙）

6.整体平移(关键帧)：按住Alt 的同时拖关键帧，就可以整体平移右侧所有的关键帧

7.复制关键帧：在要复制的关键帧上，按住【 Ctrl + Shift + 鼠标左键】。松开【Ctr + Shift】，鼠标左键不放，移动到你想要的位置

8.复制曲线：查看功能区说明匹配曲线

9.开启循环播放：【Ctrl + R】,开关切换

10.开启循环播放：【Ctrl + R】,开关切换

11.单帧全选(关键帧)：点击第一行(动作名称这行)上的关键帧图标，就能选择此帧上的所有的关键帧。同理选中任何一个父级，它下面的属性的关键帧就会被选中。比如骨骼。

12.多帧框选(关键帧)：当然也可以框选这一行，那么场景中所有的关键帧就都选中了。

13.关键帧的颜色：关键帧标记的颜色与其相关的属性对应，白色表示此父级下多个属性都创建了关键帧。

14.框选关键帧：按住Ctrl的同时拖拽，可以框选关键帧。这个主要是方便在鼠标所在处有关键帧的时候，如果直接按下就变成点选了。比如从第0帧开始向右框选，这种情况相信很多朋友都纠结过吧。

15.移动非整数帧：按住Shift 的同时拖关键帧，就可以移动半帧了。（少用为妙）

16.整体平移(关键帧)：按住Alt 的同时拖关键帧，就可以整体平移右侧所有的关键帧。

17.复制关键帧：在要复制的关键帧上，按住【 Ctrl + Shift + 鼠标左键】。松开【Ctr + Shift】，鼠标左键不放，移动到你想要的位置。

18.复制曲线：查看功能区说明匹配曲线。

功能

1、摄影表

在动画制作过程中摄影表是最核心的地方。这里包含了所有重要的细节，通过它可以创建动画以及对时间轴进行微调

2、曲线编辑器

在曲线编辑器中可以通过调整贝赛尔曲线来控制两帧之间的差值，以实现栩栩如生的动画效果

3、反向动力学工具

姿势工具可以利用反向动力学便捷的调整姿势

4、皮肤

皮肤可以为做好的动画切换图片素材。通过改变附加在骨骼上的图片来实现动画的重用。

5、边界框

边界框可以附加在骨骼上，并且随着骨骼移动。它主要用于碰撞检测和物理集成。

6、网格

允许你在矩形边界内自定义多边形。这将提高最终纹理贴图集的空间使用率，因为在多边形外的像素将被忽略掉，这种优化对移动设备来说特别重要。网格的另外一个功能就是支持自由变形和蒙皮。

7、自由变形

自由变形也称为FFD，是Free-Form Deformation的简写，它允许你通过移动网格点来变形图片。FFD 能实现网格的:拉伸、挤压、弯曲、反弹，等一些矩形图片无法实现的功能。

8、蒙皮

蒙皮允许将网格中指定的点附加给指定骨骼。然后附加点将随着骨骼移动，网格则随之自动发生变形。现在可以用骨骼动作控制角色的图片进行弯曲变形了。

9、输出格式

Spine 能将项目中的动画导出为 JSON 或二进制格式文件，它们能在 Spine 运行时库中完美的再现。 Spine 同时还可以导出 GIF 动画， PNG 或 JPG 序列图，还有 AVI或 QuickTime 的视频文件。

10、导入

Spine 通过路径查找并导入由其它工具生成的数据文件，它能够识别符合要求的JSON 或二进制格式数据。也可以从别的 Spine 项目中导入骨架和动画。

11、纹理打包

Spine能将图片打包成纹理贴图集，这能提高你在游戏中的渲染效率。Spine 的纹理贴图打包工具拥有很多功能比如剥离空白区域，旋转，自动缩放等等…(主要目的是为了充分利用空间)

特点

游戏中人物的走动，跑动，攻击等动作是必不可少，实现它们的方法一般采用帧动画或者骨骼动画。

帧动画与骨骼动画的区别在于：帧动画的每一帧都是角色特定姿势的一个快照，动画的流畅性和平滑效果都取决于帧数的多少。而骨骼动画则是把角色的各部分身体部件图片绑定到一根根互相作用连接的“骨头”上，通过控制这些骨骼的位置、旋转方向和放大缩小而生成的动画。

骨骼动画比传统的逐帧动画要求更高的处理器性能，但同时它也具有更多的优势，比如:

1、更少的美术资源

骨骼动画的资源是一块块小的角色部件（比如：头、手、胳膊、腰等等），美术再也不用提供每一帧完整的图片了，这无疑节省了资源大小，能为您节省出更多的人力物力更好的投入到游戏开发中去

2、更小的体积

帧动画需要提供每一帧图片。而骨骼动画只需要少量的图片资源，并把骨骼的动画数据保存在一个 json 文件里面（后文会提到），它所占用的空间非常小，并能为你的游戏提供独一无二的动画

3、更好的流畅性

骨骼动画使用差值算法计算中间帧，这能让你的动画总是保持流畅的效果

4、装备附件

图片绑定在骨骼上来实现动画。如果你需要可以方便的更换角色的装备满足不同的需求。甚至改变角色的样貌来达到动画重用的效果

5、不同动画可混合使用

Spine中不同的骨骼动画可以被结合到一起，比如一个角色可以转动头部、射击并且同时也在走路

6、程序动画

Spine可以通过代码控制骨骼，比如可以实现跟随鼠标的射击，注视敌人或者上坡时的身体前倾等效果

常见问题解答

1、怎样以最简单的方式把脊柱插入到我的角色里？

虽然您可以将图像导入Spine并手动排列，但使用脚本自动执行此工作最为有效。 Photoshop脚本是最常见的，但也有Gimp，Illustrator和其他脚本

2、我可以将数据从Spine导出到其他程序吗？

可以，Spine将数据导出为自己的JSON或二进制格式，您可将需要将Spine数据从其中一种格式转换为其他程序可以理解的内容

3、我可以从其他程序导入数据到脊柱？

可以，Spine可以导出与其导出的相同的JSON和二进制格式的数据。 您将需要将您的数据从其他程序转换为这些格式之一

4、多个人可以在同一个Spine项目文件中工作吗？

可以，但有些限制，脊柱支持从一个项目导入动画到另一个。 一个项目的副本可以分发给动画师来创建新的动画。之后，这些动画可以导入到项目的主副本中。 但是，为了使此导入工作，动画师应该坚持使用动画模式，他们不能创建新的骨骼，插槽或其他骨架信息

5、为什么我的导出的GIF以与Spine不同的速度播放？

GIF通过显示帧之间的延迟来工作，但大多数浏览器不支持小于0.02秒的延迟。 同样最好的延迟是1/100秒的增量。 使用50 FPS（0.02s）进行最平滑的GIF播放，否则尝试33（〜0.03s），25（0.04s），20（0.05s），17（〜0.06s），14（〜0.07s），11 〜0.09s），或10（0.1s）。

更新日志

v4.3.39版本

改进了在项目加载时修复具有无效顶点的网格。

改进网格编辑，不允许顶点外的船体。

JSON浮点数不再是四舍五入的。

修复了一些CLI导出。

PSD导入：固定删除vs覆盖在Windows上，删除空文件夹，如果所有的图像都被删除.