目錄
一、應用圖標設計
二、金剛區圖標設計
三、底部標簽欄設計
四、導航欄設計區域
五、頂部視覺區域
六、背景氛圍強化
七、模塊分類強化
八、閃屏氛圍營造
九、功能區域置換
十、運營設計營造
一、應用圖標設計
應用圖標是用戶接觸產品的第一個環節,也是視覺差異化體現的重要部分。在春節主題氛圍中也是表現豐富多樣,從不同的方向體現出春節的濃厚氛圍。
主要的處理形式會圍繞春節主題文案、生肖卡通形象、主題皮膚、春節元素和顏色等。以春節主題文案舉例,通常是春節祝福語和營銷結合的文案為主,設計在應用圖標底部居多,將圖形適當向上位移進行視覺平衡。也有一些產品結合自身圖標因素,將文案設計在頂部位置,也是為了保持整體結構的穩定性。
除了文案表達以外,配合生肖卡通形象也是較為常見的手法,可以是局部元素的裝飾,也有是作為皮膚使用的。比如今年是虎年,利用老虎的形象或者局部元素表達也是層出不窮。
無論是文字表達還是圖形結合,應用圖標上的表現都是在主題活動中優先考慮的場景,這是被用戶在眾多產品中發現的第一眼。
二、金剛區圖標設計
金剛區就像百變金剛一樣,將各種功能和業務聚集在一個區域,便于用戶進行快捷操作。在金剛區圖標上面進行設計發揮是最為普及的,春節期間眾多產品都在各種形式上面進行發揮,呈現出很多優秀的設計案例。
最為簡單的做法就是將帶有春節主題的文案融入到圖標設計中,這個形式適用于各類節假日和活動主題中。表現手法也是非常簡單的,配合元素點綴和色彩渲染,很容易體現出主題氛圍。
保持圖標造型不變,在外形輪廓背景中融入春節元素也是一個可行的方向。比如將燈籠作為圖標背景,配合元素裝飾和色彩搭配,呈現出的春節氛圍也是非常濃厚的。
也有結合春節元素對金剛區圖標進行設計重構,帶來的感官體驗也是非常不錯的。運用到的元素涉及鞭炮、福字、元寶、紅包、糖葫蘆等等,結合中國紅營造出濃厚的春節氛圍。
將春節元素點綴到圖標中也是一種不錯的選擇,或者配合春節主題顏色進行搭配,也能夠營造出濃厚的新春氛圍。
金剛區圖標設計是營造氛圍的最佳區域,不會對業務布局和產品結構造成影響,能夠根據氛圍的要求作出靈活的調整。
三、底部標簽欄設計
底部標簽欄是用戶進行功能模塊切換最頻繁的區域,通常營造氛圍和金剛區一樣,都是非常直觀和效果顯著的區域。
將春節元素融入到底部標簽欄圖標設計中,帶來的感官體驗是非常不錯的。可以是單個的春節元素,也可以是元素的局部裝飾,都可以非常直觀的傳達給用戶,突出春節活動氛圍。
也有將春節主題文字融入到圖標設計中,一種是直接結合字體設計和春節元素表達;一種是結合外輪廓背景,字體作為圖標部分鑲嵌入背景中。文字的識別性有助于用戶更快理解,傳達氛圍也是非常直觀高效的。
如果不想改變太多,也有一些產品只是在中間凸起模塊圖標上面進行氛圍設計,也能傳遞春節的氛圍。這樣的設計解決方案最大限度的保留了原本的設計內容,屬于弱氛圍營造,也能達到一定的氛圍營造目的。
除了在圖標設計上面營造以外,也能在底部標簽欄背景上面營造,配合中國紅營造出來的氛圍也是非常濃厚的。也可以是配合顏色和元素進行營造,比如煙花效果也是不錯的選擇。
底部標簽欄設計區域的氛圍營造效果非常顯著,無論是背景層面的營造還是圖標設計上的創新,都能帶給用戶非常直觀的體驗。
四、導航欄設計區域
導航欄+狀態欄通常是品牌色或者白色居多,也有少數產品會使用其他顏色進行設計。在春節期間這個區域也是作為氛圍營造的不錯選擇,除了利用中國紅作為顏色層面的選擇以外,也有結合春節元素進行設計表達的。
除了靜態的設計表達以外,也有結合動效的表達提高吸引力,突出春節濃厚的氛圍。(比如:途牛旅游)
五、頂部視覺區域
頂部視覺區域和導航欄區域比較類似,不過頂部的范圍更大一些,運用的場景更多一些。除了首頁以外,在其他主界面也可以使用這個區域,帶來春節氛圍的營造。
首頁 Banner 區域是頂部視覺區域面積較大的板塊,結合 Banner 進行背景營造,帶來的視覺效果也是非常突出的。
除了根據 Banner 效果營造以外,也有只是營造背景層面的形式,將背景顏色營造出春節的氛圍,效果也是一目了然。
在其他的主界面中頂部視覺區域也可以進行營造,比如個人中心的視覺營造,帶給用戶的感官體驗也是非常的直觀。
六、背景氛圍強化
除了在局部的區域進行背景的氛圍強化以外,也有將大面積背景進行春節強化的。通常是通過顏色來強化,比如通過中國紅來烘托春節氛圍,也會在背景中裝飾一些春節元素,進而增強氛圍感。
背景強化適合卡片式布局,更能襯托出空間感,強化視覺效果。
七、模塊分類強化
在大視覺模塊區域強化表現是較為突出的,為了體現精細化的表達,在細節的設計中也會加以注重。
細分模塊的設計嵌入可以弱化視覺比重,也能達到融入春節主題的目的。比如在模塊分類的設計中,將春節主題字體替換到類別中,作為活動欄目的表達,也是非常不錯的設計表達。
八、閃屏氛圍營造
閃屏和啟動頁本身屬于相同的表達,都是為了緩解用戶啟動應用時,等待過程中所產生的焦慮感。不過隨著閃屏廣告的概念,被區分呈現出來了。
體驗了很多產品,發現還是閃屏廣告居多,以營銷活動為主的案例較多。單純突出春節主題表達的很少,以春節主題配合營銷活動設計比較多些。
不過啟動頁的位置作為主題氛圍營造是值得考慮的方向,作為品牌情感化的延伸是非常不錯的選擇。
九、功能區域置換
功能區域在這個環節我是作為整合而存在,指的是下拉刷新、空狀態、加載、主按鈕等等。在一些重點區域強化春節氛圍是很多設計師的首選,也有一些會在細微之處深入挖掘。
下拉刷新對于一些內容更新頻繁的產品來說,是用戶操作非常頻繁的功能。通常情況下,是結合文案提示、默認動效、品牌元素、吉祥物動效等進行表達,而春節期間很多產品也嵌入了春節活動,將功能區域進行置換。不僅可以達到刷新的目的,也能帶給用戶春節的氛圍感。
在一些主按鈕比較突出的產品中,也會在按鈕的設計上面融入春節的元素,在細微之處帶給用戶氛圍感。
以上案例僅為列舉,功能區域置換是一個可以探索的方向,不僅可以達到突出主題的目的,也不會影響功能的操作。
十、運營設計營造
運營設計通常都是最活躍的,不會放過任何一個主題的參與,春節這樣的大節日更是重點參與的對象。
在春節期間通過各類活動的設計突出春節氛圍,讓用戶在感受氛圍的同時促進消費。除了在視覺效果上呈現出豐富多樣的表達,在互動玩法上面也是費盡了心思,帶給用戶更多趣味和年味。
運營設計的營造主要是在專題活動的表達上呈現,也會配合 Banner 設計或者其他插入式廣告,還有彈窗廣告的結合也是較為普遍。
小結
春節隨著時間的推移已經過去,本文梳理了在春節期間觀察到的移動端 UI 層面的變化,總結案例是為了探索大家的設計解決方案,積累更多不一樣的設計思路。案例主要以感官層面的為主,希望這些視覺表達層面的思路,可以帶給你更多靈感。
本文主要是個人觀察所感,不足之處望大家自行補充,我們互相進步。
分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。
藍藍設計( m.axecq.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務、
UI設計公司、界面設計公司、UI設計服務公司、數據可視化設計公司、UI交互設計公司、高端網站設計公司、UI咨詢、用戶體驗公司、軟件界面設計公司