近期“天天P圖”合作迪士尼公主系列IP，推出“為自己加冕”的主題營銷推廣，從創(chuàng)意劇情出發(fā)，配合精致細膩的動畫特效，搭建了效果華麗的自拍AR素材，受到眾多用戶的喜愛。本文將從劇情創(chuàng)意與動畫設計等層面切入，與大家分享此次與迪士尼合作的案例。

一、項目背景

此次合作營銷的主題為“為自己加冕”，側(cè)重表達迪士尼智慧勇敢獨立的現(xiàn)代精神公主。與以往純粹重美顏、美妝、裝飾表達的案例不同，我們嘗試通過觸發(fā)劇情與閃亮的變身特效，來突出呈現(xiàn)用戶加冕為公主時的變身感與自信美。

從眾多迪士尼公主中，我們挑選了中國觀眾最熟悉的5位公主角色，推出了3款以劇情為亮點，具有互動性，適合用戶表演的自拍AR素材，及共4款側(cè)重妝容與頭戴小飾品的妝容自拍AR素材。

下文將主要講述3款劇情AR素材的創(chuàng)意與設計過程~

二、劇情創(chuàng)意與元素設定

首先針對5個合作公主分別分析，挑選出相對適合劇情表達，能表現(xiàn)出公主美好品格，與新穎的相機素材特征的3個公主。

（1）艾莎公主：冰雪女王，擁有與生俱來的冰雪魔力。關鍵角色是妹妹安娜，雪寶。關鍵劇情是拋下使用魔力的恐懼，解放內(nèi)心對的自我束縛釋放自我，施展冰雪魔法，唱起《隨他吧》。關鍵人物是妹妹安娜，摯友雪寶。

相機劇情創(chuàng)意點：讓用戶隨著冰雪魔法特效與原版音樂氛圍體驗一次艾莎釋放自我的美

（2）白雪公主：善良美麗，深受動物喜愛。關鍵劇情道具是魔鏡與毒蘋果。關鍵角色是壞皇后，七個小矮人與王子。

相機劇情創(chuàng)意點：通過魔鏡道具，讓壞皇后黑暗的畫面鏡頭反轉(zhuǎn)到白雪公主所在的場景，突出用戶變身白雪公主的美好。

（3）貝兒公主：愛好看書，善解人意，能看到野獸善良的一面。關鍵劇情道具是魔法玫瑰。關鍵角色是野獸，茶杯母子，燭臺，鐘管家等。

相機劇情創(chuàng)意點：看書的用戶無意中打開一本童話書，成為了打破玫瑰魔法的貝兒公主

最后選擇白雪公主，艾莎和貝兒作為此次趣味劇情相機素材的主角。根據(jù)每個迪士尼公主獨有的性格愛好，篩選角色最有記憶點的特征，定制相應劇情。

整體設定不止于讓用戶變美，更賦予用戶個性化演繹空間。新增托舉手勢相機新能力，支持艾莎公主和貝兒公主的動作觸發(fā)，動作結(jié)合更具角色代入感。

1. 白雪公主劇情設定

張嘴觸發(fā)劇情反轉(zhuǎn)——背景音樂壞皇后問魔鏡“誰最美”，反轉(zhuǎn)戴白雪公主頭飾，變公主。

壞皇后設計流程細節(jié)：

根據(jù)收集到的皇后圖片資料和壞皇后與魔鏡的黑暗魔法屬性，賦予皇后暗色系配色與帶有魔法特征的質(zhì)感表現(xiàn)。

在素材設計的過程中，先從基礎元素起步，在保證素材精致感的同時，最大的還原原版迪士尼造型，后帶入使用場景之中，考慮劇情走向，添加背景元素與魔法火焰細節(jié)，烘托黑暗魔法氛圍。最后再隨著劇情漸入高潮，魔鏡顯靈魔法四射，為后面反轉(zhuǎn)白雪公主轉(zhuǎn)變氛圍的預備。

白雪公主設計流程細節(jié)：

白雪公主的配色非常明確，直接選取迪士尼提供的白雪公主視覺規(guī)范配色?？焖偈掷L前景草圖，利用3D建模渲染還原森林場景空間，后期優(yōu)化光影，植物質(zhì)感細節(jié)。動畫前段考慮與魔鏡的銜接過渡。

2. 艾莎劇情設定

手勢觸發(fā)——用戶伸手，掀起魔法雪花吹到屏幕上，屏幕凍住，前景氛圍飄雪，用戶帶上皇冠。

設計流程細節(jié)：

艾莎以動效為主視覺，前期需考慮好動效元素，靜態(tài)稿只是動態(tài)效果的參考，后期動效再根據(jù)具體實現(xiàn)的效果靈活調(diào)整。

3. 貝兒劇情設定

手勢觸發(fā)——用戶攤開手，出現(xiàn)一本書攤開法力四射，飛出玫瑰花瓣全景飄落。

設計流程細節(jié)：

貝兒素材在基礎元素設計時，直接通過3D輸出動畫，再利用AE做特效后期補全魔法光效。在玫瑰花盛開的一瞬間，增添魔法爆破的粒子特效效果，為劇情高潮部分。

三、引入3D增強原畫與動畫視覺表現(xiàn)

1. 材質(zhì)渲染

相比于傳統(tǒng)2D手法的兩種優(yōu)勢：

1. 可快速產(chǎn)出較復雜材質(zhì)，如金屬，玻璃等真實基礎質(zhì)感。如下圖的皇冠；以及最右邊的雪花材質(zhì)，由中心點實心收攏，向外變更透明折射率更高，讓雪花充滿細節(jié)的同時不會零碎。
2. 可通過不同的打光方式，快速調(diào)整和營造想要的素材氛圍。如魔鏡從下方打光營造一種陰森沉重感。

2. 光影層次

初步獲得配色體積層次后，運用PS增添細膩光感，陰影與質(zhì)感細節(jié)，快速獲得光影立體感的視覺效果。

3. 立體動效

3D方法快速輸出復雜透視的動畫，比傳統(tǒng)2D手法更高效。

4. 動畫后期

添加動態(tài)粒子，發(fā)光等動畫特效，使元素層次更富的同時，更貼近迪士尼的夢幻視覺風格。

四、多維度多層次動效氛圍

1. 時間維度

起步態(tài)，中間態(tài)，結(jié)束態(tài)不同時間維度的動效邏輯。（以艾莎手勢魔法觸發(fā)動畫為例）

2. 質(zhì)感搭配

固態(tài)，氣態(tài)，光效，粒子不同質(zhì)感動效氛圍搭配。（以艾莎手勢魔法觸發(fā)動畫為例）

3. 3D粒子

AE粒子畫中，單個粒子使用3D渲染的視頻粒子，使整體粒子動效更有空間感和精致感。

4. 多層音效動效

配音根據(jù)動畫分為3個階段，觸發(fā)前，觸發(fā)過渡階段，以及觸發(fā)后。前后場景選取對應的動畫電影原聲，并配合相應特效質(zhì)感的音效，觸發(fā)用戶聽覺記憶，提高場景代入感。

五、成果展示

此次合作艾莎公主劇情版與白雪公主劇情版自上線之后使用量穩(wěn)定TOP3，保存率同類型最高。截止6月25日下午，微博熱門話題#迪士尼公主魔法妝#，話題閱讀數(shù)達到了1323萬，討論數(shù)8千多。

項目心得

1. IP形象合作

在保證素材創(chuàng)意、質(zhì)量，考慮用戶喜好的同時，更要充分調(diào)查了解合作IP的形象背景，提前收集一些對方歷史合作項目中的線上設計作品；保證IP形象的完整展示，準確還原IP形象標志性特征點，在此基礎上再對設計進行深入優(yōu)化。

2. 資源整合優(yōu)化心得

劇情類相機AR素材，通常會因為需要特定的相機觸發(fā)能力以及較長的序列幀時長，會占用更多的相機資源。為了保證用戶在使用過程中體驗流暢效果好，后期合理優(yōu)化輸出資源非常重要，這也考驗到設計師對技術的理解與問題解決能力。

解決方案:

（1）壓縮圖片尺寸大小

日常輸出中常見，如將長為1024px尺寸等比壓縮到長為512px。

（2）減少幀速率

如2秒動畫共60幀（幀速率30），減少到24幀（幀速率12）動畫時長不變，整體序列幀圖片數(shù)減少，包變小。

（3）減少圖片層級

如減少疊加模式，多層次效果的素材可能會用到add，screen等等疊加模式，盡量只使用1～2種疊加模式。并盡量多的合并圖層輸出，使整體序列幀數(shù)量減少，相機渲染速度更快。

目前的壓縮方法會使得圖片精度減少很多，但是P圖這邊在魔法摳圖模塊和趣動視頻模塊已經(jīng)使用了新的視頻壓縮方式，使得長視頻相機素材也可以在保留高精度的同時，保持穩(wěn)定的相機性能與較小的文件大小。后期我們P圖團隊也將繼續(xù)推動技術來進行相機模塊資源的優(yōu)化與壓縮。

3. 設計技巧心得

此次迪士尼系列趣味劇情素材，是第一次嘗試大量使用3D的方法，結(jié)合后期，實現(xiàn)2D素材展示的一次嘗試，也取得了理想的效果和數(shù)據(jù)結(jié)果。

隨著3D的普及，技術的提升，3D能力已經(jīng)成為設計師的延展視覺發(fā)揮空間的重要技能。我們在嘗試用不同的視覺呈現(xiàn)方式為用戶帶來視覺上的新鮮感的同時，也是一個不斷挑戰(zhàn)自我，推動專業(yè)成長的機會。

作者：阿文，公眾號：騰訊ISUX（ID：tencent_isux）

來源：https://mp.weixin.qq.com/s/sr6obaqQreyNfiEeLWUE3w

題圖來自Unsplash，基于CC0協(xié)議