江苏龙网

  1. 首页 > 人文 > >

微信|王者QQ微信都在用的动画神器要开源了：交付时间缩短90%( 三 )


另一方面，相比于JSON，二进制数据结构具有更高的压缩率 。
JSON文件导出的冗余信息较多，而二进制的数据结构则能跳过大量默认值存储，并使用动态比特位来紧凑存储 。因此相同的动画内容，PAG文件比同类型方案压缩文件小50%左右 。
此外，采用二进制数据结构还有一个额外的好处，在导出动画文件时不用再搭配“图片包”（外挂图片），一个文件就能搞定，包括音频也能够内置 。

微信|王者QQ微信都在用的动画神器要开源了：交付时间缩短90%
文章图片

全AE特性支持
说完文件格式，再来看看PAG文件是如何做到支持所有AE效果的 。
这个特性使得PAG文件既能实时预览复杂特效，又能确保动画的可编辑性，但在之前，它们并不能同时被实现 。
这是因为传统的动画的导出模式有两种，即矢量导出和序列帧导出 。
矢量导出的动画文件具有可编辑性，但缺点是一些复杂特效无法在移动端实时预览，因此无法做到全AE特性支持 。
序列帧导出基于截图的原理解决了这个问题，也就是将复杂的视觉动效全部截成图片，再实现导出 。但这就导致文件大小可能高达几十上百兆，对移动端而言“又大，又没法编辑” 。
为了让文件既可以编辑，又能保证精彩动态效果的实现，PAG的研发人员们想到了混合导出的方法 。
简单来说，就是给不需要可编辑性的图层打标记 。这样在导出时，需要保留编辑性的图层就会以纯矢量形式被导出，而打了标记的图层，则以序列帧的方式导出 。

微信|王者QQ微信都在用的动画神器要开源了：交付时间缩短90%
文章图片

值得一提的是，为了尽可能压缩导出文件的大小，PAG团队还自己设计了bmp预合成的格式，充分利用了视频的极限帧间压缩能力，并在此基础上扩展了对透明通道的支持 。
再加上渲染方面的优化，最终，相比于传统图片序列帧，视频序列帧格式的文件大小可以降低到原来的1.24%左右 。

微信|王者QQ微信都在用的动画神器要开源了：交付时间缩短90%
文章图片

但从基础功能的实现，到如今成为一整套完整的工具流，PAG并非“一蹴而就” 。
与之相反，虽然SDK去年才开始对外开放，但早在2016年，PAG的第一行代码就已经写下 。
从最初的1.0版本迭代到如今的形态，PAG已经走过了4个版本 。
“被battle出来的产品”
“从写下第1行代码，到第1次跑通，团队就用了6个月时间 。”
至于为何要选择坚持打磨这样一款工具产品，Dom提到了一个“回忆杀”的词语Flash：
在Flash时代，动效开发有一套非常完善的工作流：设计师把动画制作出来，导出一个SWF文件，开发人员无需手敲代码还原效果，直接导入就能使用 。并且动效里面的细节是可以调整的 。
但到了现在的H5、移动应用开发里，很少有工具能够完整还原这套完善的动画工作流 。
他希望PAG能在视频编辑这样一个场景里，把这套工作流带到移动端动画制作上，降低或者消除动画相关的研发成本 。
这个想法在市场上也很快有了案例验证——
PAG项目开始的同一年，支持将矢量动画导出到各个平台的AE插件Lottie问世 。这款插件的成功问世，证明了还原Flash这套设计到研发之间的流畅工作流“跑得通” 。
和PAG团队一样，Lottie背后的开发者同样有着深厚的Flash相关经验，只是Lottie主要面向UI动画设计，不太适用于短视频场景 。
为了能够满足短视频贴纸动画以及模板的开发需求，PAG团队选择了继续自研 。
6个月之后，PAG 1.0版本出炉 。
腾讯的设计师们试用后，PAG团队得到的反馈是“存在不少问题”，核心概括起来就是：
1.0版本虽然支持了带动画的文本编辑，但仅覆盖了AE的纯矢量导出能力，很多复杂动画效果无法被完整还原 。
为此，PAG继续迭代出了2.0版本：通过混合导出实现AE全特性支持，同时解决了特效和可编辑性的问题 。开发团队还在 2.0版本引入了占位图的能力，为照片模板和视频模板的生产带来了工业化量产的能力 。
到3.0版本时，PAG在编辑性上进一步探索突破，强化了图层级别的原子编辑组合能力，支持了从原子特效组件动态构建模板，很好地支撑了游戏战报和一键出片等动态模板的需求……


推荐阅读


上一篇：无人驾驶|广州首条L4级无人驾驶公交线路上线：可免费试乘

下一篇：仙剑奇侠传|同人游戏《新仙剑奇侠传二》预热：还原剧情 升级为半回合制