騰訊案例復盤:如何從零開始打造一個動態節日閃屏? - 優設網 - UISDC

騰訊案例復盤:如何從零開始打造一個動態節日閃屏?

2019/08/28 13158評論 5

項目配景

云南体彩网閃屏作為打開 APP 產品時首要展現的部分,品牌的「門面」頃刻盡顯,在眾多節日閃屏中如何凸顯產品特征、體現品牌的文化性是節日閃屏的重要目的。19 年新的設計趨勢賡續更替,動態視頻浪潮發展迅猛,我們在節日閃屏的設計上,也進行了新風格的探索和挖掘。節日閃屏不僅僅只是片面的給用戶傳遞關懷,更需要深條理的情感交流,賡續尋求立異點與共鳴點增加用戶粘性。

1. 設計目標

  • 用戶關懷:轉達節日氛圍
  • 品牌建設:加深品牌文化認知
  • 價值觀轉達:凸顯產品態度

2. 產品目標

云南体彩网提升產品情懷,基于品牌流傳以及用戶情感鏈接的價值,通過情感共鳴拉近 QB 與用戶之間的距離。

3. 閃屏調研

云南体彩网縱觀市面上各類 app 節日閃屏,大多使用單頁插畫的設計,且多采取手繪的表示手法。雖然畫面美觀,但通過「移花接木」的方式你會發現,它好像適用于所有同類型 app 的節日閃屏,具有「通用性」。從視覺表示力和講述故事的方式來看較為傳統,缺乏自身品牌的個性與印記。

創意過程

1. 創意方式

前期方案階段,我們思考如何將一年里的所有節日用一套邏輯進行創意激發,達到高效以及系統化的效果,并總結出一套推導方式。

云南体彩网節日種類分為傳統節日&國際性節日。傳統節日(春節、元宵節、清明節、端午節、中秋節等)大多宣揚中國的傳統文化價值觀;國際性節日(元旦、愚人節、勞動節、兒童節等)則具有中西方的文化差別而稍有區分。

首先,明確節日主題,根據節日特點發散關鍵詞,這個階段可以開放思維不受太多限制。把關鍵詞與任意屬性進行組合,選擇最范例的部分進行方案的塑造,這樣更有利于引起用戶共鳴。

以兒童節為例,它屬于國際性節日,在文化轉達上采取最為民眾認知的內容(通俗文化)比較能引起情感共鳴。「筑夢童年」正好融合了關鍵詞的精華,讓人聯想到童年愛玩的游戲以及蘊藏的少時夢想。在價值觀上,體現了對于小孩無限的發明力與想象力的鼓勵。

2. 故事設定

故事主題確定之后,我們將針對閃屏結構進行設定。分歧于傳統的靜態啟動樣式,我們將閃屏比方成一部 6s 的舞臺劇,演員(人物)、布景(場景搭建)、劇本(故事內容、動作情節)則是弗成或缺的部分。通過對各個分支的設定,組合構建出閃屏故事的整體。

設計過程

1. 故事場景立體化

3D Videos + 2D Illustrations表示手法

當下短視頻風靡于網絡平臺,民眾對于動態視頻消費的成本越來越低,這對我們來說正好是突破口,動態設計更好地讓用戶以生動有趣的方式感受內容流傳的魅力,在主流插畫閃屏的大環境下跳脫出來,作出差別化的設計。

3D 擬物化風格在 2019 年再度盛行,應用于各類設計場景。因此,我們將故事元素進行立體化塑造,logo 場景元素使用 C4D 建模刻畫突出,人物&部分場景則用 2D 插畫表示,二者的搭配效果可以讓閃屏更加奇特和突出,發明出紛歧樣的視覺感受。在競品采取單一插畫表示形式下,3D 風格的應用一定水平上拉開了與競品的差別,增加品牌記憶點。

版式

云南体彩网版式的設定上,以品牌 logo 為舞臺視覺中心進行延展設計,輔助元素則服務于它,具有完整體系化的視覺品牌調性,使用戶對產品有固定的品牌認知。

構圖

云南体彩网品牌調性是貫穿所有節日的,在設計前明確 QB 的品牌調性,這樣更有利于品牌認知的轉達。一年里的節日繁多,如果紕謬畫面進行有效的規范,會涌現出雜亂的感受,一方面影響閃屏整體的系列感知,另一方面對品牌的認知轉達也會有一定影響。

因此,總結出兩套構圖邏輯,品牌 logo 位置、巨細不變的情況下,透視構圖使畫面更有空間延伸感,適合垂直空間的設計;包抄式構圖則圍繞 logo 為視覺中心,周圍適當添加輔助元素,適用于俯視鏡頭的設計。

配色

色彩作為渲染故事氛圍的重要一環,是能引起民眾審美愉悅的、最為敏感的形式要素,是具有強表示力的要素之一。它的性質直接影響人們的心理。而最直觀易理解的色彩體系來源于生活的感知,閃屏的配色體系也從中進行提取,通過圖像情緒板的收集,獲得大致的色板基調。

2. 動態情節設計

鏡頭語言

傳統 2D 插畫被限制于XY軸的平面空間內,我們試圖打破這樣的格局,將 6s 時長發揮到最大化,拓展到Z軸的維度,將用戶視角帶入預先設定好的故事場景中。

充分發揮 3D 的優勢,在攝像機沿著Z軸運動的過程中,使用簡練的推、拉、升、降等手法,增加畫面的生動性。前 3s 引人入勝,后 3s 展現品牌,為 6s 的閃屏制造出視覺沖擊力和記憶點。

人物動態設計

作為 6s 閃屏的主角人物,在制作動畫時需要和場景進行動作情節設計,增加畫面的生動性。2D 自己不具備 3D 的Z軸要素,但在動畫設計時,通過人物的簡單位移、縮放、旋轉設置,可以達到Z軸的縱深效果,模擬 3D 空間的視覺感受。

由于人物與場景的質感差別,在進行 2D 與 3D 的視覺融合時,動作匹配就顯得格外重要。人物需要遵循整體場景的運鏡軌跡,并與其有所互動才會獲得流暢的視覺效果。人物的進場方式也需要結合物理運動邏輯進行設定,可采取畫外飛入、掉落、旋轉劃入等方式。

快速運動時的路徑追蹤,需要進行 2D 人物與 3D 場景的Z軸配合,這部分需要花費較多的時間進行單幀調試,最終達到自然的視覺效果。

3. 構建人物角色世界觀

云南体彩网故事要素少不了「人」這一關鍵,為了更好的轉達故事內容,將人物設定應用到閃屏設計中,具有更好的故事帶入感以及閃屏系列感知。一方面要考慮 QB 的產品定位和用戶屬性,另一方面也要考慮流行的設計趨勢風格。

人物設定

結合 QB 品牌特性,以探索興趣世界為主線,提煉出角色自由愛玩,熱愛生活的人格特征。從故事劇本出發,以生活中的人物作為角色原型,采取情感化設計的方法,根據角色屬性進行人物設定。

外形設計

云南体彩网分歧的閃屏故事其造型各不相同。在造型設計上,結合時下人物設計趨勢的特征強化手法,將頭身比進行夸張處理,視覺上突出人物輪廓的曲直對比,增加視覺的生動性與設計感。

特征提煉

云南体彩网兒童節在孩子的基礎上加入多啦A夢飛行器的意向,將竹蜻蜓元素融入到人物設計,只需把它戴在頭上就可以通過大腦意念隨意控制飛行,正好契合兒童無限想象力這一主題。在人物設準時,可以考慮結合相關的意向。

繪制筆刷

云南体彩网統一人物插畫表示風格,使用一致的筆刷庫進行繪制。「干油墨」繪制的優勢在于,在大色塊鋪設時,除了保存邊沿的筆觸,也能堅持色彩自己的透氣感,整體簡潔不乏細節;而「噴濺」相似于目前應用較多的噪點,可以增加繪制物的光感細節。

2018-2019部分閃屏

2018圣誕

2018大年節

2019春分

2019五一

2019六一

2019夏至

流傳方式

1. 線上

節日當天除了啟動閃屏的動態露出之外,我們買通了首頁頭圖、天氣專區、壁紙專區等渠道,讓用戶充分感知到節日的關懷同時,增加品牌曝光率。

2. 線下

恰逢 QQ 瀏覽器 20 周年紀念,閃屏隨同時間流逝的瞬間,像極了產品賡續探索前進的縮影。因此,制作的一整套明信片用以團隊關懷也是極好的。

設計總結

云南体彩网節日閃屏是品牌運營的一部分,通過動態節日閃屏的情感化運營,給用戶轉達節日關懷的同時,也賡續地強化了 QB 的品牌認知。QB 探索用現代的表示手法轉達節日感知和人文關懷,賦予傳統文化以更鮮明的時代特征,傳統中有新意,進而加強用戶對閃屏及 QB 品牌的深刻印象。

在后續的規劃中,我們希望節日閃屏不僅局限于視覺技法的優化,可以更多的發掘深條理情感交流的創意點,發明出形式豐富而且更符合用戶體驗的節日閃屏。QQ 瀏覽器會繼續給人人帶來節日的祝福,也賡續探索新的閃屏設計思路。

歡迎關注「騰訊FXD」公眾號:

非特殊說明,本文版權歸原作者所有,轉載請注明出處
本文地址:http://www.7daer.cn/tencent-festival-flash-screen-design

發表評論 加載中....

評論加載中....

uisdc

評論區都快餓癟了,看看我期盼的小眼神...

您還沒有登錄

優設啟用更平安省心的 微信掃碼登錄

微信掃碼

300萬設計師聚集地!優設網是極具人氣的設計師平臺
2012年成立至今,一直專注于設計師的學習成長交流

把好文章收藏到微信

打開微信,掃碼分享
學設計 優設網 在這里