域名預(yù)訂/競(jìng)價(jià)，好“米”不錯(cuò)過(guò)

導(dǎo)語(yǔ)

動(dòng)效設(shè)計(jì)是UI設(shè)計(jì)中不可或缺的一環(huán)。隨著硬件性能的發(fā)展和動(dòng)效輸出方式的優(yōu)化，大家對(duì)動(dòng)效的認(rèn)知也從最初的認(rèn)為動(dòng)效只是為了美觀酷炫，到逐漸認(rèn)識(shí)到動(dòng)效對(duì)于提升用戶(hù)體驗(yàn)和產(chǎn)品需求的重要作用。

但設(shè)計(jì)師在做動(dòng)效設(shè)計(jì)的時(shí)候靈感噴涌，兢兢業(yè)業(yè)做出炫酷的效果，結(jié)果一和開(kāi)發(fā)工程師對(duì)接就懵了——要么無(wú)法實(shí)現(xiàn)，要么極其復(fù)雜。特別是AE里有很多復(fù)雜動(dòng)效，使用純代碼還原起來(lái)非常困難，導(dǎo)致最后設(shè)計(jì)師只能不斷簡(jiǎn)化效果以達(dá)到跟開(kāi)發(fā)成本的平衡。

一、傳統(tǒng)AE設(shè)計(jì)難點(diǎn)及解決方案

傳統(tǒng)的AE設(shè)計(jì)，總結(jié)下來(lái)有以下三個(gè)核心痛點(diǎn)：

• 研發(fā)成本高：每個(gè)動(dòng)效都需要研發(fā)通過(guò)代碼來(lái)還原，單獨(dú)排期的特效以及手工配置還原的過(guò)程，包括后續(xù)復(fù)用及改動(dòng)都需要大量的研發(fā)人力持續(xù)投入。

• 生產(chǎn)周期長(zhǎng)：設(shè)計(jì)師和研發(fā)人員需要反復(fù)確認(rèn)效果還原度。這樣很難跟上運(yùn)營(yíng)節(jié)奏，容易錯(cuò)過(guò)時(shí)事熱點(diǎn)。

• 視覺(jué)動(dòng)效弱：AE里有很多復(fù)雜動(dòng)效，使用純代碼還原成本高、維護(hù)難度大，設(shè)計(jì)師只能簡(jiǎn)化特效來(lái)推進(jìn)實(shí)現(xiàn)開(kāi)發(fā)。

就這些問(wèn)題，騰訊PCG發(fā)布器中臺(tái)主導(dǎo)研發(fā)了一款動(dòng)畫(huà)開(kāi)發(fā)“神器”—PAG。為設(shè)計(jì)師提供 AE 導(dǎo)出插件和桌面預(yù)覽工具，支持 AE 一切特效。

PAG作為一套完整的動(dòng)畫(huà)工作流，誕生之初就是為了降低或消除動(dòng)畫(huà)相關(guān)的研發(fā)成本，打通設(shè)計(jì)師創(chuàng)作到素材交付上線的極速流程，不斷輸出運(yùn)行時(shí)可編輯的高質(zhì)量動(dòng)畫(huà)內(nèi)容。

PAG提供從AE導(dǎo)出插件，到桌面預(yù)覽工具，再到iOS和Android端的渲染SDK。AE設(shè)計(jì)師運(yùn)用PAG實(shí)現(xiàn)批量化制作動(dòng)畫(huà)素材，再通過(guò)導(dǎo)出PAG插件，到桌面預(yù)覽工具進(jìn)行微量調(diào)整，從而提高了動(dòng)畫(huà)的制作效率以及精度。

二、PAG亮點(diǎn)介紹

PAG 方案有完善的工具鏈支持，AE插件支持混合導(dǎo)出能力，無(wú)論是表達(dá)式、粒子動(dòng)畫(huà)還是 3D插件，只要 AE做的出，PAG 都可以導(dǎo)出。另外導(dǎo)出相同的動(dòng)畫(huà)內(nèi)容，PAG動(dòng)畫(huà)文件的體積會(huì)顯著小于其他方案，并且在解碼速度和渲染性能上都更高。

以下為幾點(diǎn)核心優(yōu)勢(shì)：

1、動(dòng)畫(huà)文件?。菏紫热魏嗡夭奈募际窃叫≡胶?。在素材下發(fā)的使用場(chǎng)景里，更小的文件能夠節(jié)省用戶(hù)的下載流量和時(shí)長(zhǎng)。而如果內(nèi)置到App里的，這時(shí)候包體大小就直接影響增長(zhǎng)拉新的數(shù)據(jù)了，所以動(dòng)畫(huà)壓縮率非常關(guān)鍵。PAG在同樣動(dòng)畫(huà)內(nèi)容導(dǎo)出方面比其他方案平均可以小50%。

并且由于采用了二進(jìn)制的數(shù)據(jù)結(jié)構(gòu)，能單文件集成所有相關(guān)動(dòng)畫(huà)資源，讓設(shè)計(jì)師交付素材時(shí)候只需發(fā)送一個(gè)文件，不在需再要外掛圖片音頻等資源，這樣能夠提高工作流文件傳遞的效率。

2、全AE特性支持：

①完整還原AE渲染系統(tǒng)：針對(duì)AE很多復(fù)雜動(dòng)效，使用純代碼還原起來(lái)非常困難。設(shè)計(jì)師只能不斷簡(jiǎn)化效果以達(dá)到跟開(kāi)發(fā)成本的平衡，導(dǎo)致最終上線的視覺(jué)效果都是打過(guò)折扣的，不達(dá)設(shè)計(jì)預(yù)期。而PAG的SDK已經(jīng)完全還原了AE整個(gè)動(dòng)畫(huà)的渲染系統(tǒng)，能夠支持所有AE特性，設(shè)計(jì)師可以充分利用AE動(dòng)畫(huà)的原子能力，組合出無(wú)限的視覺(jué)動(dòng)效，不用因?yàn)榇a還原成本的問(wèn)題而打折扣。

②支持矢量和序列幀的混合導(dǎo)出：PAG除了在矢量導(dǎo)出上比同類(lèi)型方案支持更加完善外，還創(chuàng)新性地實(shí)現(xiàn)了矢量和序列幀的混合導(dǎo)出能力，設(shè)計(jì)計(jì)可以主動(dòng)標(biāo)記哪些圖層使用序列幀導(dǎo)出，例如不需要編輯并且有復(fù)雜的動(dòng)效，而需要編輯的圖層繼續(xù)用簡(jiǎn)單的矢量方式導(dǎo)出。從而實(shí)現(xiàn)支持所有的AE特性又能保持運(yùn)行時(shí)的編輯性。

3、 完善便捷的編輯工具，支持實(shí)時(shí)預(yù)覽以及性能可視化：往往AE設(shè)計(jì)師跟研發(fā)聯(lián)調(diào)非常費(fèi)勁，例如設(shè)計(jì)圖需要給到研發(fā)同學(xué)上架素材才能看到最終效果，效果反復(fù)確認(rèn)耗時(shí)久;或者不知道如何優(yōu)化性能，一直改都無(wú)法滿足開(kāi)發(fā)需求，需要不斷與研發(fā)同學(xué)溝通。

但如果通過(guò)PAG的自助工具，就能做到所見(jiàn)即所得地生產(chǎn)動(dòng)畫(huà)內(nèi)容。首先，桌面預(yù)覽工具確保了在所有端上渲染效果的一致性，設(shè)計(jì)師無(wú)需把素材提交上線就能看到最終準(zhǔn)確的動(dòng)畫(huà)效果。

其次PAG 的導(dǎo)出插件內(nèi)置了40多種自動(dòng)優(yōu)化和提醒的策略，這樣可以在導(dǎo)出的環(huán)節(jié)就幫助設(shè)計(jì)師進(jìn)行性能把關(guān)。并且還在預(yù)覽工具里提供性能可視化面板，能夠直觀地看到每個(gè)素材量化的性能指標(biāo)，并配套說(shuō)明了各種指標(biāo)的優(yōu)化方向。

讓設(shè)計(jì)師可以獨(dú)立完成動(dòng)畫(huà)內(nèi)容交付，高效輔助設(shè)計(jì)師制作出性能和效果俱佳的動(dòng)畫(huà)內(nèi)容，避免來(lái)回返工。

三、總結(jié)

作為騰訊PCG發(fā)布器中臺(tái)下三大組件之一，PAG已經(jīng)在騰訊微視，手機(jī)QQ，王者榮耀等數(shù)十款產(chǎn)品中落地使用。包含微信在內(nèi)的多個(gè)團(tuán)隊(duì)，也都積極參與該項(xiàng)目的協(xié)同共建，齊心協(xié)力，不斷打磨這款動(dòng)畫(huà)開(kāi)發(fā)利器。相信隨著PAG的不斷迭代，將持續(xù)為動(dòng)畫(huà)設(shè)計(jì)師及開(kāi)發(fā)工程師們技術(shù)賦能，實(shí)現(xiàn)更多天馬行空的動(dòng)畫(huà)效果，助力動(dòng)畫(huà)產(chǎn)業(yè)進(jìn)一步發(fā)展。

說(shuō)了這么多關(guān)于PAG的介紹，大家是不是迫不及待地想體驗(yàn)一把PAG的神奇應(yīng)用呢?別著急，同學(xué)們現(xiàn)在可以通過(guò)官網(wǎng)下載插件體驗(yàn)啦!下載地址：https://PAG.io

申請(qǐng)創(chuàng)業(yè)報(bào)道，分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處，共同探討創(chuàng)業(yè)新機(jī)遇！