2019-4-9 濤濤
如果您想訂閱本博客內(nèi)容，每天自動(dòng)發(fā)到您的郵箱中， 請點(diǎn)這里
情感化設(shè)計(jì)已經(jīng)不是一個(gè)新概念，唐納德·諾曼在《情感化設(shè)計(jì)》一書中，清晰地闡述了情感化設(shè)計(jì)的重要地位與作用?，F(xiàn)階段，同類型的產(chǎn)品在功能、服務(wù)、內(nèi)容上日益趨同，差異越來越小，想讓產(chǎn)品觸及用戶的內(nèi)心，除了功能滿足需求之外，也需要進(jìn)行情感化運(yùn)營。微云在不斷完善基礎(chǔ)功能的同時(shí)，還基于用戶行為，增加了許多情感化的體驗(yàn)，比如往年今日、人臉相冊等。在情感化運(yùn)營上，微云在2018年開始了較為完整的節(jié)日閃屏設(shè)計(jì)，希望向用戶傳達(dá)節(jié)日的祝福，拉近產(chǎn)品與用戶的距離。
節(jié)日閃屏是指在特定的節(jié)日進(jìn)行情感化設(shè)計(jì)，傳遞品牌關(guān)懷的閃屏。優(yōu)秀的節(jié)日閃屏，在內(nèi)容上不僅能夠觸達(dá)用戶的記憶點(diǎn)，也能夠與品牌相融合，這樣既拉近了用戶與產(chǎn)品的距離，也強(qiáng)化了品牌的認(rèn)知和記憶。
在開始設(shè)計(jì)之前，我們期望節(jié)日閃屏能夠達(dá)到以下兩個(gè)目標(biāo)：
不同的節(jié)日有不同的文化背景和風(fēng)俗習(xí)慣，節(jié)日祝?？梢越Y(jié)合最典型的特征，這樣更有利于喚起用戶回憶，后文會結(jié)合案例進(jìn)行分析。然而，品牌調(diào)性是貫穿所有節(jié)日的，在設(shè)計(jì)之初，我們明確微云的品牌調(diào)性，這樣更有利于品牌的傳達(dá)。
1. 品牌調(diào)性研究
Alan Cooper在《About face 4》中提到，在傳達(dá)品牌調(diào)性時(shí)，可以用一組形容詞來描述產(chǎn)品及體驗(yàn)，這些詞可以組成詞云，用來指導(dǎo)視覺設(shè)計(jì)。如何創(chuàng)建這組詞云呢？Allan Cooper 提供了四個(gè)方法：從品牌大綱提煉關(guān)鍵詞、分析現(xiàn)有產(chǎn)品的界面和服務(wù)、分析競品的界面和服務(wù)、收集用戶反饋。
結(jié)合微云的特征，我們從現(xiàn)有產(chǎn)品的界面和用戶反饋兩個(gè)角度進(jìn)行分析，提煉符合微云調(diào)性的詞云。
2. 分析現(xiàn)有產(chǎn)品界面
微云的平臺較多，包括WEB端、PC端、移動(dòng)端、小程序等，其中WEB端和移動(dòng)端的用戶最多，就從這兩個(gè)端入手，分析產(chǎn)品界面的品牌特征。從結(jié)構(gòu)布局和色彩比例上，可以歸納兩端的共同點(diǎn)：結(jié)構(gòu)清晰、留白較多、簡約干凈。
3. 分析用戶反饋
微云用戶在職業(yè)分布上，白領(lǐng)用戶占最大。結(jié)合使用場景分析，用戶反饋?zhàn)疃嗟脑~是：輕量、方便、下載快速。
4. 提煉微云品牌詞云
結(jié)合產(chǎn)品界面「結(jié)構(gòu)清晰、留白較多、簡約干凈」的特征和「輕量、方便、下載快速」的用戶反饋，我們提煉出適合描述微云品牌的詞云：簡約、干凈、留白。
接下來就以勞動(dòng)節(jié)閃屏為例，從節(jié)日特征和品牌調(diào)性兩個(gè)維度來闡述節(jié)日閃屏的設(shè)計(jì)過程。
利用窮舉法，篩選最典型的節(jié)日特征。
微云是一個(gè)工具化的產(chǎn)品，旅行/度假更適合旅行類產(chǎn)品，勞動(dòng)/休息與微云更契合。結(jié)合產(chǎn)品功能，定了兩個(gè)方向，第一個(gè)是「五一不勞你動(dòng)，微云幫你整理」，與備份照片功能結(jié)合；第二個(gè)是「勞動(dòng)光榮」，凸顯節(jié)日氣氛。以下是一些草圖方案：
前面三個(gè)方案重點(diǎn)在于功能的表達(dá)，把用戶目光吸引到場景上，內(nèi)容豐富，但可能造成用戶在3秒內(nèi)無法明白畫面主題。方案四重點(diǎn)在于氣氛的表達(dá)，關(guān)注人物故事，角色正在辛勤的勞動(dòng)，直接點(diǎn)題，場景只起烘托作用。結(jié)合「簡約、干凈、留白」的品牌調(diào)性和「喚起美好回憶」的品牌期望，我們選擇了氛圍方向進(jìn)行深入設(shè)計(jì)。
主題確定之后，就開始進(jìn)行優(yōu)化設(shè)計(jì)了。圍繞著關(guān)鍵詞，采用扁平化的設(shè)計(jì)手法，在色彩搭配上，由于勞動(dòng)節(jié)沒有明顯的色彩傾向，故以品牌藍(lán)為主色調(diào)，橙色來源于產(chǎn)品的圖標(biāo)，作為輔助色提亮整體畫面；在頁面排版上，保持大面積的留白，簡約清爽。
勞動(dòng)節(jié)閃屏上線后，我們進(jìn)行了復(fù)盤，我們希望微云的節(jié)日閃屏給用戶傳達(dá)的是「你的珍貴回憶微云幫你記錄」這樣的小心思，而不是「我們有xx功能」之類的廣告，所以在以后的節(jié)日閃屏中，我們會更加傾向節(jié)日故事性的表達(dá)。視覺風(fēng)格則采用簡約、干凈、留白的方式，重點(diǎn)突出人物故事，不在場景上過多渲染。
按照上面的思路，我們完善了其他的節(jié)日閃屏設(shè)計(jì)。
母親節(jié)閃屏
母親節(jié)是一個(gè)西方的節(jié)日，在這一天，孩子給母親送康乃馨，來表達(dá)自己的愛意。在節(jié)日故事上選擇了最具代表性的孩子給母親送花的場景。
端午節(jié)閃屏
一提到端午節(jié)，就會想起粽子的「甜咸之戰(zhàn)」，可見粽子在端午節(jié)的重要地位，所以端午節(jié)的節(jié)日故事就圍繞粽子開展，三個(gè)好友齊心協(xié)力包粽子。
七夕閃屏
牛郎織女，鵲橋相會，是七夕節(jié)的美麗傳說，這一天情侶相聚，相互表達(dá)愛意。七夕故事定格在情侶相會的瞬間，女生飛奔向男生，在銀河上翩翩起舞，表達(dá)久別重逢的喜悅。
中秋閃屏&圣誕節(jié)閃屏
中秋節(jié)故事主題是合家團(tuán)圓、賞月吃餅。圣誕節(jié)故事則以父女二人齊心協(xié)力裝飾圣誕樹為主題。
△ 備注：圣誕節(jié)最終效果圖由另一同事繪制
所有節(jié)日閃屏合集
節(jié)日閃屏除了故事性的表達(dá)之外，在設(shè)計(jì)上我們也輸出了一部分規(guī)范，用來把控風(fēng)格的統(tǒng)一。
1. 配色規(guī)范
色彩作為用戶最容易感知的部分，使用時(shí)與品牌相呼應(yīng)，主色與輔助色均來源于產(chǎn)品圖標(biāo)。有明顯色彩屬性的節(jié)日，以節(jié)日固有色為主，比如春節(jié)紅色，中秋黃色等等。無明顯色彩屬性的節(jié)日，可以以品牌藍(lán)為主，強(qiáng)化品牌印記。
2. 角色規(guī)范
我們希望重點(diǎn)展示的是人物的珍貴回憶，基于此，我們設(shè)計(jì)了一批角色，講述角色的故事，讓用戶產(chǎn)生代入感。為了保證統(tǒng)一性，我們制定了人物的細(xì)節(jié)規(guī)范，包括角色頭身比=1 : 9、服裝款式以休閑為主、服飾顏色與品牌色呼應(yīng)等。
在設(shè)定好人物細(xì)節(jié)規(guī)范之后，我們也完善了角色資源庫，方便后期在其他場景的應(yīng)用。
3. 場景規(guī)范
在場景設(shè)計(jì)上，我們以簡潔，明確為主，場景主要起烘托人物故事的作用，而不進(jìn)行過多的渲染。
做了一系列閃屏之后，這些插圖和角色并沒有閑置，我們在線下挖掘了一些新的使用場景。這些素材被重新利用起來，變身為辦公室的裝飾掛畫，營造出一個(gè)充滿品牌氣氛的辦公環(huán)境。
2018年微云希望通過節(jié)日閃屏的情感化運(yùn)營，給用戶傳達(dá)節(jié)日關(guān)懷的同時(shí)也強(qiáng)化微云的品牌認(rèn)知。在后續(xù)的規(guī)劃中，我們希望節(jié)日閃屏不僅僅是單方面的給用戶傳遞關(guān)懷，還能夠和用戶互動(dòng)，實(shí)現(xiàn)更深層次的情感交流，比如點(diǎn)擊節(jié)日閃屏，跳轉(zhuǎn)到往年今日，幫助用戶回憶起以往的美好回憶，增加用戶粘性。2019年微云會繼續(xù)給大家傳遞節(jié)日的祝福，也會不斷探索新的閃屏設(shè)計(jì)風(fēng)格，敬請大家期待。
藍(lán)藍(lán)設(shè)計(jì)( m.wowo44.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 、平面設(shè)計(jì)服務(wù)。
藍(lán)藍(lán)設(shè)計(jì)的小編 http://m.wowo44.com