設計實戰(zhàn)！網易嚴選APP的品牌設計過程全揭秘

網易UEDC – 董俊豪 ：品牌設計，是品牌之間形成差異化的根本緣故原由。它可以讓用戶明確、清晰地記住并識別品牌的個性，是驅動用戶認同、喜好乃至愛上一個品牌的重要力量。拿保時捷汽車前車燈的設計為例，這種特別的表面設計被嚴酷地應用到所有保時捷的汽車產品當中，就算遮住品牌也能一眼分辨出該品牌，這就是品牌的力量。

回歸到我們視覺設計，我們在接需求的時候，經常會聽到運營及產品對網頁設計的要求是品牌感，那么怎么樣設計才有品牌感？下面就談談網易嚴選App，在品牌設計方面的嘗試，在這之前我們先來了解下網易嚴選。

品牌分析

網易嚴選，是網易自營類家居生活品牌App，秉承嚴謹?shù)膽B(tài)度甄選天下優(yōu)品。嚴透露表現(xiàn)嚴謹?shù)膽B(tài)度，選是甄選，甄選天下好物。

設計原則

網易嚴選的品牌理念是「好的生活，沒那么貴」?？梢韵胂笠粤司志?，躺在懶人沙發(fā)上清閑的看著書，坐在窗邊滿意的喝著茶，抑或是靠在陽臺上享受午后的陽光。他們不緊不慢，尋求品質，享受寧靜，所以品牌關鍵字是品質、生活、寧靜。從品牌關鍵字提取到的設計語言是細節(jié)化、場景化、簡約化。

細節(jié)感是指細膩，比如商品的光影，產品中的對齊法則等。場景化講究的是天然協(xié)調同一；簡約化是去除統(tǒng)統(tǒng)多余的元素，只留下素材或者產品自己。

品牌設計

了解了品牌性格，品牌關鍵字及品牌設計語言，我們將這些應用到詳細的設計中，包括品牌logo、版式、圖標、動效、圖片等。

1.Logo設計

品牌Logo以形象、直觀的情勢向消耗者傳達品牌信息，以創(chuàng)造品牌認知、品牌聯(lián)想和消耗者的品牌依靠，從而給品牌帶來更多價值。

嚴選Logo設計結合了小楷的輕重協(xié)衡，淳厚平淡及刻本的一絲不茍，精雕細琢，體現(xiàn)出對產品的選擇保持嚴謹?shù)膽B(tài)度，對產品服務保持無窮的尋求。因為網易logo品牌色是紅色，且從色彩生理學角度出發(fā)，紅色更容易刺激購物。所以顏色繼續(xù)了網易品牌的基因。

從品牌色延長出來一些其它顏色，以便適用在不同的場景中，如活動色，成功色，會員色以及不同程度的灰色。

輔助圖形是品牌不可或缺的一部分。它能更好地配合品牌logo，傳遞品牌價值，從設計上也起到調和的作用。當然也可以單獨作為背景底紋、輔助元素等場景運用，既雄厚團體內容，又起到強化品牌的作用。如圖所示就是將品牌Logo進行拆分重組而成的輔助圖案及應用場景。

在App小我中間中運用的輔助圖形。

2.版式設計

嚴選App首頁版面采用兩欄布局進行設計，在內容的顯現(xiàn)上做到適度脅制，從而簡化了內容，再配以淺色背景或者大面積的白色，把核心展示都留給了商品自己，團體給人簡約，寧靜的感受，不強制，不給人克制感，相比其他電商App的四欄乃至更多的內容呈現(xiàn)，從視覺上做到了較強的辨識度。

3.圖標設計

在界面中，icon圖標是不可輕視一個品牌設計環(huán)節(jié)，也是作育品牌感較直接的體例。

底欄icon

嚴選底欄icon的圖標設計均以家居物品為原型衍化而來，給人以場景感，真實且生活化的感受，傳達了品牌價值。

為空設計

嚴選為空設計以生活中日常的元素為原型，并采用手繪線條斷開的樣式，加上塊狀的陰影及修飾等元素，營造場景化及畫面感，為品牌設計帶來了一絲情感。

4.動效設計

在App中做動效設計的上風在于生動性地傳達品牌個性。

登錄頁動效設計

在登錄頁及明星商品頁大面積留白空間的商品圖上都加入了天然的投影，給人營造簡約中帶著場景感，細節(jié)感，無形之中吐露著品質，生活，寧靜。

Loading設計

Loading的設計創(chuàng)意來源于打開包裹時，商品呈如今面前的驚喜感以及生活的儀式感。所以設計的思路是隨動手向下拉，箱子徐徐打開，松開手的時候彈出「好的生活，沒那么貴」。這里寓意嚴選有你想要的商品，且品質及服務給用戶帶來驚喜，從而達到了品牌價值的傳達。

5.圖片設計

生理學研究證實，圖片比筆墨更直觀地、更優(yōu)先地傳達，所以在App中圖片的品質直接傳遞著品牌的感受。

單品設計

在產品設計中，既要表現(xiàn)品牌的氣質，表現(xiàn)品牌的品質，又要保證網頁不平，所以在登錄頁及明星商品頁大面積留白空間的商品圖上都加入了天然的光影結果，給人營造簡約中帶著的場景感及細節(jié)感，無形之中吐露著品質，生活，寧靜。

這是運用在登錄頁及單品詳情頁的詳細設計網頁。

SKU規(guī)范

電商里面最難部分就是商品圖的控制，必要對每個商品圖拍攝，角度，色彩都控制的很好，除此之外對商品在網頁的呈現(xiàn)也做了規(guī)范處理：

• 所有產品放置在米字格園內，分為大圓、小圓、迷你圓，分別對應偏大、常規(guī)、偏小尺寸。
• 產品角度以15度為基礎變量單位。如15、30、45等。

下面是一些詳細運用實例：

結束語

App視覺設計中還有許多可以進行品牌設計的地方，這里就說到這里。以上大部分案例均來自網易嚴選App設計項目經驗，望共勉。

最后盼望這次總結能對大家有所幫助，做出本身有品牌感的好作品，如有不當之處，迎接大家來一路交流。

迎接關注作者「網易UEDC」的微信公眾號：