2022年1月14日,騰訊宣布 PAG(Portable Animated Graphics)動畫組件正式開源。
PAG 是騰訊 AVGenerator OTeam 自主研發的一套完整的動畫工作流解決方案,助力于將 AE (Adobe After Effects)動畫方便快捷的應用于各平臺終端。和業界常用的動畫工作流解決方案相比,支持的 AE 特性更多,支持的平臺更廣(增加了 macOS、Windows 和 Linux),性能方面也做了深層次的優化,支持文本和占位圖編輯替換,可以與視頻編輯場景緊密結合。目前已經廣泛應用于公司內外幾十款 APP,包含微信、手機 QQ、王者榮耀等頭部 App。
1、解決的痛點
當前最好的動畫設計軟件是 Adobe After Effects(簡稱AE),從 AE 動畫制作到終端 APP 呈現,傳統的實現方式如上圖所示,有三大痛點:實現成本高、溝通成本高和性能難以保證。
PAG的流程圖如下圖所示,設計師使用AE設計好動畫以后,通過 PAGExporter 插件導出 PAG 動畫文件,在桌面端預覽效果確認無誤后,部署上線,各平臺端接入渲染SDK后可以直接加載pag文件實現動畫渲染。
相對傳統研發還原的方式,PAG 方案顯著提升了動畫素材上線的效率:設計師設計完成可以直接輸出動畫文件,研發不需要再參與代碼還原,只需要接入一次SDK即可做到素材自助上線,也避免了反復進行效果確認的聯調時間成本,并且還能夠批量化生產素材,從流程上直接取代傳統小工作坊形式,利用工業化生產方式大幅提升設計和研發效率。
2、PAG的特色優勢
文件體積小
導出相同的 AE 動畫內容,在文件解碼速度和壓縮率上均大幅領先于同類型方案。采用可擴展的二進制文件格式,可單文件集成包含圖片、音頻等任意設計資源。
全AE特性支持
支持純矢量導出方式的同時,還引入了BMP預合成結合矢量的混合導出能力,實現支持所有 AE 特性的同時又能保持動畫運行時的可編輯性。
運行時可編輯
在保留設計預設動畫效果的前提下,可以在運行時輕松替換文本和占位圖的內容,能夠大幅降低類似照片模板和視頻模板的研發成本。PAG 支持的編輯特性不僅限于占位資源的替換,還支持圖層級別的自由組合。能夠對每個動畫的圖層樹進行任意的增刪改位移,也能夠根據編程規則動態組合多個原子 PAG 特效素材合成一個運行時的定制化模板,能夠完美適配類似一鍵出片、游戲戰報等智能模板的需求。
便捷的導出插件
針對設計師設計動畫的痛點,導出插件增加了使用了不支持 AE 特性提醒功能,支持一鍵設置BMP 預合成、設置占位圖的填充模式、設置 PAG 動畫的伸縮模式等。另外導出插件內置了數十種自動優化素材的策略,讓設計師輕松制作出效果和性能俱佳的動畫素材。
完善的桌面預覽工具
效果預覽
桌面預覽工具不僅支持桌面端預覽動畫效果,還支持設計師本地填充素材,實時預覽填充效果,無需等待上線后才能確認真實效果,避免了大量來回返工的成本。
性能檢測
性能檢測可以讓設計師很方便的看到pag動畫的基本信息,還有量化的性能指標,定量的評估pag文件的性能,方便設計師進行針對性的優化,而不需要等到上線前才會暴露性能問題。
3、PAG的應用場景
總結下來,PAG 目前主要使用在以下幾大場景:
UI動畫
設計師設計出動畫文件后,研發只需要替換預設的文本內容即可,并且文件體積非常小。
貼紙動畫
PAG 的動畫文件可以在任意子線程渲染,可以合成到視頻畫面,作為貼紙、字幕、特效、轉場動畫使用,且支持保留動畫效果前提下讓用戶自己修改文本內容。
照片/視頻模板
PAG 支持將內置的圖片作為占位圖替換,并保留所有動畫效果。因此可以將整個 PAG 動畫設計成一個模板,把預設的占位圖替換成用戶選取的照片,自動套用效果生成視頻。全程可以讓設計師自由批量生產模板,無需研發介入。仍然基于圖片替換原理,PAG 也支持將占位圖替換為視頻,實現視頻模板功能。
智能剪輯
智能剪輯是圍繞用戶上傳的視頻內容,生成定制化的模板,模板本身是不固定的,由多個 PAG 文件組合而成,類似活字印刷。設計師可以利用這個特性,構建自己的特效組件庫,然后對接AI的識別能力,根據一定規則組合得到無限數量的模板效果,可以做到一鍵出片。這塊目前的典型應用場景是王者榮耀的周戰報功能,隨機生成游戲高光時刻視頻。
PAG 目前已正式對外開源,開發人員如對改進 PAG 項目有任何的想法或建議,也可以通過在GitHub搜索“libpag”,訪問 PAG 的 Github 主頁,留下觀點及改進意見。