目錄

一、應(yīng)用圖標(biāo)設(shè)計(jì)

二、金剛區(qū)圖標(biāo)設(shè)計(jì)

三、底部標(biāo)簽欄設(shè)計(jì)

四、導(dǎo)航欄設(shè)計(jì)區(qū)域

五、頂部視覺(jué)區(qū)域

六、背景氛圍強(qiáng)化

七、模塊分類強(qiáng)化

八、閃屏氛圍營(yíng)造

九、功能區(qū)域置換

十、運(yùn)營(yíng)設(shè)計(jì)營(yíng)造

一、應(yīng)用圖標(biāo)設(shè)計(jì)

應(yīng)用圖標(biāo)是用戶接觸產(chǎn)品的第一個(gè)環(huán)節(jié)，也是視覺(jué)差異化體現(xiàn)的重要部分。在春節(jié)主題氛圍中也是表現(xiàn)豐富多樣，從不同的方向體現(xiàn)出春節(jié)的濃厚氛圍。

主要的處理形式會(huì)圍繞春節(jié)主題文案、生肖卡通形象、主題皮膚、春節(jié)元素和顏色等。以春節(jié)主題文案舉例，通常是春節(jié)祝福語(yǔ)和營(yíng)銷結(jié)合的文案為主，設(shè)計(jì)在應(yīng)用圖標(biāo)底部居多，將圖形適當(dāng)向上位移進(jìn)行視覺(jué)平衡。也有一些產(chǎn)品結(jié)合自身圖標(biāo)因素，將文案設(shè)計(jì)在頂部位置，也是為了保持整體結(jié)構(gòu)的穩(wěn)定性。

除了文案表達(dá)以外，配合生肖卡通形象也是較為常見(jiàn)的手法，可以是局部元素的裝飾，也有是作為皮膚使用的。比如今年是虎年，利用老虎的形象或者局部元素表達(dá)也是層出不窮。

無(wú)論是文字表達(dá)還是圖形結(jié)合，應(yīng)用圖標(biāo)上的表現(xiàn)都是在主題活動(dòng)中優(yōu)先考慮的場(chǎng)景，這是被用戶在眾多產(chǎn)品中發(fā)現(xiàn)的第一眼。

二、金剛區(qū)圖標(biāo)設(shè)計(jì)

金剛區(qū)就像百變金剛一樣，將各種功能和業(yè)務(wù)聚集在一個(gè)區(qū)域，便于用戶進(jìn)行快捷操作。在金剛區(qū)圖標(biāo)上面進(jìn)行設(shè)計(jì)發(fā)揮是最為普及的，春節(jié)期間眾多產(chǎn)品都在各種形式上面進(jìn)行發(fā)揮，呈現(xiàn)出很多優(yōu)秀的設(shè)計(jì)案例。

最為簡(jiǎn)單的做法就是將帶有春節(jié)主題的文案融入到圖標(biāo)設(shè)計(jì)中，這個(gè)形式適用于各類節(jié)假日和活動(dòng)主題中。表現(xiàn)手法也是非常簡(jiǎn)單的，配合元素點(diǎn)綴和色彩渲染，很容易體現(xiàn)出主題氛圍。

保持圖標(biāo)造型不變，在外形輪廓背景中融入春節(jié)元素也是一個(gè)可行的方向。比如將燈籠作為圖標(biāo)背景，配合元素裝飾和色彩搭配，呈現(xiàn)出的春節(jié)氛圍也是非常濃厚的。

也有結(jié)合春節(jié)元素對(duì)金剛區(qū)圖標(biāo)進(jìn)行設(shè)計(jì)重構(gòu)，帶來(lái)的感官體驗(yàn)也是非常不錯(cuò)的。運(yùn)用到的元素涉及鞭炮、福字、元寶、紅包、糖葫蘆等等，結(jié)合中國(guó)紅營(yíng)造出濃厚的春節(jié)氛圍。

將春節(jié)元素點(diǎn)綴到圖標(biāo)中也是一種不錯(cuò)的選擇，或者配合春節(jié)主題顏色進(jìn)行搭配，也能夠營(yíng)造出濃厚的新春氛圍。

金剛區(qū)圖標(biāo)設(shè)計(jì)是營(yíng)造氛圍的最佳區(qū)域，不會(huì)對(duì)業(yè)務(wù)布局和產(chǎn)品結(jié)構(gòu)造成影響，能夠根據(jù)氛圍的要求作出靈活的調(diào)整。

三、底部標(biāo)簽欄設(shè)計(jì)

底部標(biāo)簽欄是用戶進(jìn)行功能模塊切換最頻繁的區(qū)域，通常營(yíng)造氛圍和金剛區(qū)一樣，都是非常直觀和效果顯著的區(qū)域。

將春節(jié)元素融入到底部標(biāo)簽欄圖標(biāo)設(shè)計(jì)中，帶來(lái)的感官體驗(yàn)是非常不錯(cuò)的。可以是單個(gè)的春節(jié)元素，也可以是元素的局部裝飾，都可以非常直觀的傳達(dá)給用戶，突出春節(jié)活動(dòng)氛圍。

也有將春節(jié)主題文字融入到圖標(biāo)設(shè)計(jì)中，一種是直接結(jié)合字體設(shè)計(jì)和春節(jié)元素表達(dá)；一種是結(jié)合外輪廓背景，字體作為圖標(biāo)部分鑲嵌入背景中。文字的識(shí)別性有助于用戶更快理解，傳達(dá)氛圍也是非常直觀高效的。

如果不想改變太多，也有一些產(chǎn)品只是在中間凸起模塊圖標(biāo)上面進(jìn)行氛圍設(shè)計(jì)，也能傳遞春節(jié)的氛圍。這樣的設(shè)計(jì)解決方案最大限度的保留了原本的設(shè)計(jì)內(nèi)容，屬于弱氛圍營(yíng)造，也能達(dá)到一定的氛圍營(yíng)造目的。

除了在圖標(biāo)設(shè)計(jì)上面營(yíng)造以外，也能在底部標(biāo)簽欄背景上面營(yíng)造，配合中國(guó)紅營(yíng)造出來(lái)的氛圍也是非常濃厚的。也可以是配合顏色和元素進(jìn)行營(yíng)造，比如煙花效果也是不錯(cuò)的選擇。

底部標(biāo)簽欄設(shè)計(jì)區(qū)域的氛圍營(yíng)造效果非常顯著，無(wú)論是背景層面的營(yíng)造還是圖標(biāo)設(shè)計(jì)上的創(chuàng)新，都能帶給用戶非常直觀的體驗(yàn)。

四、導(dǎo)航欄設(shè)計(jì)區(qū)域

導(dǎo)航欄+狀態(tài)欄通常是品牌色或者白色居多，也有少數(shù)產(chǎn)品會(huì)使用其他顏色進(jìn)行設(shè)計(jì)。在春節(jié)期間這個(gè)區(qū)域也是作為氛圍營(yíng)造的不錯(cuò)選擇，除了利用中國(guó)紅作為顏色層面的選擇以外，也有結(jié)合春節(jié)元素進(jìn)行設(shè)計(jì)表達(dá)的。

除了靜態(tài)的設(shè)計(jì)表達(dá)以外，也有結(jié)合動(dòng)效的表達(dá)提高吸引力，突出春節(jié)濃厚的氛圍。（比如：途牛旅游）

五、頂部視覺(jué)區(qū)域

頂部視覺(jué)區(qū)域和導(dǎo)航欄區(qū)域比較類似，不過(guò)頂部的范圍更大一些，運(yùn)用的場(chǎng)景更多一些。除了首頁(yè)以外，在其他主界面也可以使用這個(gè)區(qū)域，帶來(lái)春節(jié)氛圍的營(yíng)造。

首頁(yè) Banner 區(qū)域是頂部視覺(jué)區(qū)域面積較大的板塊，結(jié)合 Banner 進(jìn)行背景營(yíng)造，帶來(lái)的視覺(jué)效果也是非常突出的。

除了根據(jù) Banner 效果營(yíng)造以外，也有只是營(yíng)造背景層面的形式，將背景顏色營(yíng)造出春節(jié)的氛圍，效果也是一目了然。

在其他的主界面中頂部視覺(jué)區(qū)域也可以進(jìn)行營(yíng)造，比如個(gè)人中心的視覺(jué)營(yíng)造，帶給用戶的感官體驗(yàn)也是非常的直觀。

六、背景氛圍強(qiáng)化

除了在局部的區(qū)域進(jìn)行背景的氛圍強(qiáng)化以外，也有將大面積背景進(jìn)行春節(jié)強(qiáng)化的。通常是通過(guò)顏色來(lái)強(qiáng)化，比如通過(guò)中國(guó)紅來(lái)烘托春節(jié)氛圍，也會(huì)在背景中裝飾一些春節(jié)元素，進(jìn)而增強(qiáng)氛圍感。

背景強(qiáng)化適合卡片式布局，更能襯托出空間感，強(qiáng)化視覺(jué)效果。

七、模塊分類強(qiáng)化

在大視覺(jué)模塊區(qū)域強(qiáng)化表現(xiàn)是較為突出的，為了體現(xiàn)精細(xì)化的表達(dá)，在細(xì)節(jié)的設(shè)計(jì)中也會(huì)加以注重。

細(xì)分模塊的設(shè)計(jì)嵌入可以弱化視覺(jué)比重，也能達(dá)到融入春節(jié)主題的目的。比如在模塊分類的設(shè)計(jì)中，將春節(jié)主題字體替換到類別中，作為活動(dòng)欄目的表達(dá)，也是非常不錯(cuò)的設(shè)計(jì)表達(dá)。

八、閃屏氛圍營(yíng)造

閃屏和啟動(dòng)頁(yè)本身屬于相同的表達(dá)，都是為了緩解用戶啟動(dòng)應(yīng)用時(shí)，等待過(guò)程中所產(chǎn)生的焦慮感。不過(guò)隨著閃屏廣告的概念，被區(qū)分呈現(xiàn)出來(lái)了。

體驗(yàn)了很多產(chǎn)品，發(fā)現(xiàn)還是閃屏廣告居多，以營(yíng)銷活動(dòng)為主的案例較多。單純突出春節(jié)主題表達(dá)的很少，以春節(jié)主題配合營(yíng)銷活動(dòng)設(shè)計(jì)比較多些。

不過(guò)啟動(dòng)頁(yè)的位置作為主題氛圍營(yíng)造是值得考慮的方向，作為品牌情感化的延伸是非常不錯(cuò)的選擇。

九、功能區(qū)域置換

功能區(qū)域在這個(gè)環(huán)節(jié)我是作為整合而存在，指的是下拉刷新、空狀態(tài)、加載、主按鈕等等。在一些重點(diǎn)區(qū)域強(qiáng)化春節(jié)氛圍是很多設(shè)計(jì)師的首選，也有一些會(huì)在細(xì)微之處深入挖掘。

下拉刷新對(duì)于一些內(nèi)容更新頻繁的產(chǎn)品來(lái)說(shuō)，是用戶操作非常頻繁的功能。通常情況下，是結(jié)合文案提示、默認(rèn)動(dòng)效、品牌元素、吉祥物動(dòng)效等進(jìn)行表達(dá)，而春節(jié)期間很多產(chǎn)品也嵌入了春節(jié)活動(dòng)，將功能區(qū)域進(jìn)行置換。不僅可以達(dá)到刷新的目的，也能帶給用戶春節(jié)的氛圍感。

在一些主按鈕比較突出的產(chǎn)品中，也會(huì)在按鈕的設(shè)計(jì)上面融入春節(jié)的元素，在細(xì)微之處帶給用戶氛圍感。

以上案例僅為列舉，功能區(qū)域置換是一個(gè)可以探索的方向，不僅可以達(dá)到突出主題的目的，也不會(huì)影響功能的操作。

十、運(yùn)營(yíng)設(shè)計(jì)營(yíng)造

運(yùn)營(yíng)設(shè)計(jì)通常都是最活躍的，不會(huì)放過(guò)任何一個(gè)主題的參與，春節(jié)這樣的大節(jié)日更是重點(diǎn)參與的對(duì)象。

在春節(jié)期間通過(guò)各類活動(dòng)的設(shè)計(jì)突出春節(jié)氛圍，讓用戶在感受氛圍的同時(shí)促進(jìn)消費(fèi)。除了在視覺(jué)效果上呈現(xiàn)出豐富多樣的表達(dá)，在互動(dòng)玩法上面也是費(fèi)盡了心思，帶給用戶更多趣味和年味。

運(yùn)營(yíng)設(shè)計(jì)的營(yíng)造主要是在專題活動(dòng)的表達(dá)上呈現(xiàn)，也會(huì)配合 Banner 設(shè)計(jì)或者其他插入式廣告，還有彈窗廣告的結(jié)合也是較為普遍。

小結(jié)

春節(jié)隨著時(shí)間的推移已經(jīng)過(guò)去，本文梳理了在春節(jié)期間觀察到的移動(dòng)端 UI 層面的變化，總結(jié)案例是為了探索大家的設(shè)計(jì)解決方案，積累更多不一樣的設(shè)計(jì)思路。案例主要以感官層面的為主，希望這些視覺(jué)表達(dá)層面的思路，可以帶給你更多靈感。

本文主要是個(gè)人觀察所感，不足之處望大家自行補(bǔ)充，我們互相進(jìn)步。