weekly icon indicating copy to clipboard operation
weekly copied to clipboard

【开源自荐】不再为了动效还原而加班:腾讯 PAG 动效组件

Open domchen opened this issue 1 year ago • 1 comments

如今,动效在互联网中随处可见:UI场景中的Loading、APP开屏特效,直播场景的礼物和点赞特效,以及用户拍摄场景的魔法道具特效等等。而优质的动效不仅可以使用户更容易地理解产品功能和操作方式,减少用户使用难度,还能增加用户与产品的互动性,提升产品的打开率。但动效素材的生产流程却一直是个很大的行业痛点,主要因为在传统的工作流下,依赖代码手工还原动效的方式存在巨大的生产瓶颈

PAG(Portable Animated Graphics)动效方案很好地解决了行业在动效需求上线这块的大量痛点。开源一年时间,已经接入了上千的互联网业务,其中不乏微信、小红书、QQ、知乎等很多头部应用,稳定性经过了海量用户的持续验证

业务方

PAG 介绍

PAG 是一套完整的动效工作流,提供从 AE (Adobe After Effects) 导出插件 ,到桌面预览工具,再到各平台的渲染 SDK,能够一键将设计师在 AE 中制作的动效内容导出成素材文件,并快速渲染到 iOS,Android,macOS,Windows,Linux 和 Web 等几乎所有的主流平台上。PAG 的目标是降低或消除动效相关的研发成本,打通设计师创作到素材交付上线的极简流程。

1

PAG 的技术优势

在技术方案方面,相比行业内其他的同类型方案如 Lottie 和 SVGA,PAG 的技术优势主要体现在以下几个方面:

1、文件格式压缩率极高,相同动效内容导出 PAG 方案平均比其他方案的文件小 50%:PAG 采用针对 AE 时间轴属性设计的二进制文件编码器,整个框架体积小,解码速度快,文件体积小,并支持单文件集成图片和音频等外部资源。

2、能够支持所有 AE 特性的导出,不限制设计师的创意发挥:相比于其他同类方案,PAG 支持所有 AE 特性的导出和渲染,使用 BMP 预合成的解决方案,支持将特定图层截图导出成透明视频,实现了对于所有 AE 特性导出的支持。

3、性能优秀,全平台开启硬件加速,平均渲染耗时少 50%。

4、完整的运行时可编辑性,保留动效的前提下快速套用动效到用户图片或文本上。

5、SDK 支持所有主流平台,包括服务端渲染能力,可以完美覆盖云服务场景。

6、丰富完善的工具链支持,每个素材都可以实现精确的性能分析和优化提醒。

2

PAG 业务价值

1、 App 动效场景

PAG 方案目前在移动端 App 中的应用最为广泛,其中不乏直播、短视频场景(如微信视频号的直播的线上是采用 PAG 实现互动及礼物动效,而手 Q 小世界的贴纸花字以及视频模板也依赖 PAG 制作。),以及 UI 场景和活动运营场景(如微信红包皮,腾讯视频年终总结 H5)。

3 4 5

2、服务端视频生成

在视频广告的场景下,腾讯 AMS 业务在全面切换到 PAG 的方案后,视频模板的月产量直线提升了 50 倍,在接入 PAG 的在线视频生成服务后,相比原方案的渲染性能提升了8 倍,显著降低了机器成本。

6

而在游戏战报的场景下,借助 PAG 提供的原子组合的能力,可以从多个 PAG 素材文件动态组合出一个自适应的模板,完美地满足了游戏战报这类动态化模板的生产需求,支撑了包括王者荣耀,和平精英以及英雄联盟手游在内的千万级战报视频的生成需求。

7

总结

总体来说,PAG 动效组件项目拥有全面的能力、完善的工具链和不错的上手体验,通过桌面工具和 AE 插件一键将设计师的动效创意导出成 PAG 文件,并能快速渲染到市面上几乎所有主流平台上。有了它不管是研发还是设计,都能在面对动效上线时轻松许多。 欢迎大家进访问我们的 github 和官网进一步了解: GitHub:https://github.com/Tencent/libpag 官网:https://pag.art/

domchen avatar May 25 '23 12:05 domchen

dom 哥厉害了

nshen avatar May 26 '23 03:05 nshen

他这个开源的linux 没有出视频占位符,企业版也没有,当时费了好大劲,自己开发,图片占位符导出、视频占位符导出、文字占位符导出,后来开发出来公司也不用这块了 ,哎

upseem avatar Feb 01 '24 10:02 upseem