2017-8-14 用心設(shè)計(jì)
如果您想訂閱本博客內(nèi)容，每天自動發(fā)到您的郵箱中， 請點(diǎn)這里
這篇介紹垂直類電商的首頁設(shè)計(jì)。那么首先讓我們了解下什么是垂直類的電商。
淘寶的商品品類（SKU）是以數(shù)十億計(jì)的，天貓和京東也應(yīng)該在數(shù)千萬的級別。海量的商品品類、魚目混雜的商家以及參差不齊的商品為消費(fèi)者的購物帶來了極大的選購時間成本。消費(fèi)者在這樣的購物環(huán)境中找到適合自己的商品有時并不比大海撈針容易多少，而其中假冒偽劣商品的大量存在更是增加了購物的難度。
相對于B2C綜合商城的廣而博，還有一種小而美電商形態(tài)叫做B2C垂直電商，就是只專注售賣一個或者多個相關(guān)品類的電商。鑒定一個電商是否垂直，就是能否找到一個共同屬性的用戶群體。比如女性，文藝青年等。垂直電商的價值就在于其站在獨(dú)立第三方的角度，從海量的商品中為消費(fèi)者做了一次精選，平臺需要為這些商品做信用背書，所以這些商品基產(chǎn)品質(zhì)量也相對有保證，能通過口碑逐漸地在消費(fèi)者中間建立信任感。
模式優(yōu)缺點(diǎn)：
垂直類電商優(yōu)點(diǎn)是：面對的客戶群體有一致的屬性。有了這個大的前提，那么很容易知道客戶在哪里，他們喜歡和關(guān)注什么，可以有針對性的精準(zhǔn)營銷。而且客戶群體的集中和專一，會讓其更有歸屬感。
垂直類電商缺點(diǎn)是：商品品類單一，用戶重復(fù)購買率低。就是用戶想買其他商品你這里沒有的賣，那么用戶可能選擇綜合類B2C電商平臺。所以垂直類電商在發(fā)展到一定程度后，業(yè)績增長會遇到天花板，于是就開始擴(kuò)充品類，走大而全的道路。又會遭到大的B2C商城的競爭。不管是從商品還是價格的角度上來說，淘寶、天貓以及京東這些綜合類的B2C電商，都存在大量的商品可以替代垂直類電商。
常見的垂直電商App
B2C垂直里面，一些應(yīng)用的商品品類比較多。比如母嬰電商這個大的垂直分類，里面有服飾、鞋子、奶粉等多個小的品類。這些應(yīng)用相當(dāng)于垂直電商里的綜合類（圖1-1）。
|
品類 |
名稱 |
|
母嬰 |
貝貝網(wǎng)、蜜芽、孩子王 |
|
化妝品 |
聚美優(yōu)品，樂蜂網(wǎng) |
|
品牌折扣 |
唯品會、聚美優(yōu)品、楚楚街 |
|
女性導(dǎo)購 |
美麗說、蘑菇街 |
|
服飾 |
夢芭莎、優(yōu)衣庫、麥網(wǎng)、有貨 |
|
跨境電商 |
小紅書、網(wǎng)易考拉、洋碼頭、海淘、達(dá)令、美麗說、higo 、云猴全球購 |
|
生鮮 |
每日優(yōu)鮮 |
|
二手交易 |
閑魚 |
圖1-1 綜合類的垂直電商
因?yàn)槠奉惐容^多，所以頁面承載的信息密度比較高。所以頁面設(shè)計(jì)采用類似綜合B2C商城的設(shè)計(jì)（圖1-2）。如果對這塊有興趣，頁面設(shè)計(jì)可以參考我之前的文章《綜合B2C電商首頁設(shè)計(jì)》，就不在本節(jié)文章的討論范圍內(nèi)了。
圖1-2 貝貝和聚美優(yōu)品首頁
垂直電商里還有一些垂直細(xì)分類。例如各種鞋子和襪子、品類、食品類、箱包、水果類、鉆戒和珠寶類、酒、養(yǎng)生保健品類、禮品玩具類、鮮花商城、居家類、汽車用品、藥店等。
這些細(xì)分類隨著時間有的逐漸消逝，如賣鞋子的樂淘。而留下來各種時尚潮品的綜合推薦類、家居類居多。這些垂直細(xì)分的商品品類不是很多，所以頁面設(shè)計(jì)大多采用大的留白簡約型設(shè)計(jì)。本節(jié)文章重點(diǎn)去分析推薦一些垂直細(xì)分類的電商（圖1-3）。
|
品類 |
名稱 |
|
手工藝品 |
東家守藝人 |
|
家居 |
造作、Life、好物、尖叫設(shè)計(jì)、匠物 |
|
綜合導(dǎo)購 |
最美有物、良倉、想去、毒物、野獸派、See |
|
美食 |
Enjoy、二十四季 |
|
男士服飾 |
男衣邦 |
|
女士服飾 |
ICY、ZARA、 H&M |
|
女士內(nèi)衣 |
氧氣 |
1-3 細(xì)分類的垂直電商
垂直電商的用戶，可能購物的目的性不是很明確，一般都會以逛為主，通過逛發(fā)現(xiàn)自己喜歡的一些商品完成購買行為。所以首頁會放置各種形式的商品推薦。推薦形式一般有
1、品類或者品牌中熱門單品的推薦
2、以專題形式的某一類商品的集中推薦，以商品推薦為主。
3、如果有達(dá)人推薦的子頻道，會在首頁有露出，通過一些意見領(lǐng)袖的推薦，
4、知識庫，我的理解還是一種專題的合集，比如什么場合適合穿什么衣服，什么季節(jié)適合吃什么，如何選擇合適的鍋。當(dāng)然這些知識里面少不了各種商品的推薦。
5、其他一些各種小頻道欄目的露出
因?yàn)榫C合類電商平臺模塊多，每個模塊都可能從屬某個部門，需要平衡各種部門事業(yè)部的利益。設(shè)計(jì)師設(shè)計(jì)的頁面體現(xiàn)的是各種協(xié)調(diào)的意志。而垂直類電商的模塊相比就少的多，設(shè)計(jì)師有更多自由去考慮各種模塊的設(shè)計(jì)問題。知道了垂直類電商的首頁的內(nèi)容組成，我們開始看垂直類電商的具體模塊組成。
模塊1：標(biāo)題欄
每個應(yīng)用都有一個標(biāo)題欄，這成了App的標(biāo)準(zhǔn)設(shè)計(jì)了。標(biāo)題欄上一般會有三個重要的元素組成：logo圖形或者文字、搜索頁的入口、購物車的圖標(biāo)。
視覺設(shè)計(jì)1 品牌logo
標(biāo)題欄放置的Logo文字會進(jìn)行字體設(shè)計(jì)，垂直類電商一般會非常重視品牌的露出，所以這里不會使用系統(tǒng)默認(rèn)的字體，而是貼圖使用設(shè)計(jì)好的Logo文字或者Logo圖形（圖1-4）。
圖1-4 造作標(biāo)題欄使用了logo圖形，其他使用了字體設(shè)計(jì)的logo
視覺設(shè)計(jì)2 搜索入口
大多數(shù)垂直類電商，更希望于用戶瀏覽推薦內(nèi)容，購買推薦活動商品。而不是直接通過搜索去找到相應(yīng)商品，去完成購買行為。所以垂直類電商App會有意識的弱化商品搜索。不同于B2C綜合類電商導(dǎo)航欄上醒目的搜索欄，美食電商Enjoy和興趣導(dǎo)購life首頁（圖1-5），直接在導(dǎo)航欄右側(cè)放置了一個搜索圖標(biāo)。
圖1-5美食電商Enjoy和興趣導(dǎo)購life首頁
如果你的商品品類并不是很多，那么用戶通過關(guān)鍵詞搜索很難搜到東西。所以一些應(yīng)用干脆把搜索和商品分類頁進(jìn)行結(jié)合設(shè)計(jì)。例如造作（圖1-6）點(diǎn)擊搜索，進(jìn)入的搜索頁就是商品的分類頁。
圖1-6造作的首頁和分類頁
有的垂直類電商品類并不多，所以干脆直接去掉了搜索入口。在2016年的唯品會的App甚至極端的去掉了搜索功能，希望用戶在頁面可以停留更長的時間。這種想法顯然有點(diǎn)一廂情愿，因?yàn)槲ㄆ窌钠奉惪刹簧?，這樣的設(shè)計(jì)遭到了很多用戶的反對。在版本的唯品會又悄悄的把搜索功能加了回來。所以留不留搜索入口還是要看你的品類是否足夠豐富。
模塊2：分類模塊
由于垂直電商的品類不是那么多。子頻道也有限，所以不需要和綜合類電商一樣，用圖標(biāo)的形式作為模塊快速入口，而是直接設(shè)計(jì)為Tab標(biāo)簽欄的設(shè)計(jì)形式，放置在標(biāo)題欄下面，方便用戶快速瀏覽切換。
視覺設(shè)計(jì)1 底部標(biāo)簽欄
Tab標(biāo)簽欄如果類別比較多的時候采用橫滑的設(shè)計(jì)形式。如果應(yīng)用的頻道比較少，例如造作應(yīng)用（圖1-7），甚至可以直接把標(biāo)簽欄設(shè)計(jì)在底部，相當(dāng)于整個底部標(biāo)簽欄的作用，當(dāng)然底部標(biāo)簽欄重要的“我的”模塊，入口放置在頂部標(biāo)題欄上。
圖1-7造作首頁底部標(biāo)簽欄
視覺設(shè)計(jì)2 滑動隱藏標(biāo)簽欄
一些垂直類電商的首頁設(shè)計(jì)形式單一，完全由banner圖構(gòu)成。用戶向上滑動頁面，標(biāo)題欄會自動隱藏，讓用戶有更大的頁面顯示面積。例如Life應(yīng)用（圖1-8），至于向上滑動多少像素開始隱藏標(biāo)題欄，你需要給程序員定義出高度。
圖1-8Life 滑動隱藏標(biāo)簽欄
良倉的首頁并沒有采用這種滑動隱藏標(biāo)題欄的設(shè)計(jì)（圖1-9），我猜測因?yàn)榱紓}的底部欄目太多，沒有給購物車留下一個單獨(dú)的位置。所以可能為了強(qiáng)調(diào)購物車的全局顯示，所以固定欄頂部標(biāo)簽欄。當(dāng)然我認(rèn)為這種想法可能也說不通，因?yàn)槭醉撌遣惶赡艽俪山灰仔袨?，更多是引流的作用。我認(rèn)為良倉底部的分享是一個很雞肋的功能，本質(zhì)就是一些美圖商品推薦而已，如果把這個頻道降級放進(jìn)其他位置，把這個位置留給購物車。我估計(jì)設(shè)計(jì)師就可以舒心的使用隱藏標(biāo)題欄設(shè)計(jì)。
圖1-9良倉固定的標(biāo)簽欄
模塊3：橫幅廣告
由于垂直類電商的信息密度低，所以有足夠大的空間去放置Banner。Banner的常見比例有16:9和1:1兩種。也就是750*422和750*750。一般Banner圖片設(shè)計(jì)還是以750寬度的iphone6/7為基準(zhǔn)。至于更大尺寸的iphone6/7plus還是使用這個圖片，因?yàn)閺墓?jié)省帶寬的角度完全沒必要那么大的尺寸。2X的Banner圖給3X用也是足夠的。什么是2X、3X？這些移動設(shè)計(jì)知識，請去閱讀我撰寫的UI設(shè)計(jì)書籍《術(shù)與道-移動應(yīng)用設(shè)計(jì)必修課》。那么圖片的比例什么時候使用16:9，什么時候使用1:1了？還是從內(nèi)容的角度進(jìn)行分析。
視覺設(shè)計(jì)1 16:9的Banner圖
如果你的應(yīng)用展示的Banner圖是類似專題性質(zhì)的。圖片只是一個參考作用，用戶是不能從大圖看到更多商品信息，需要更多文字說明來輔助閱讀，圖片比例選擇使用16:9。例如旅游的產(chǎn)品圖片就適合選用16:9。比如首頁你要做一個歐洲的路線，你只放巴黎的埃菲爾鐵塔的圖片，那么提供信息量是遠(yuǎn)遠(yuǎn)不夠的，必須加上德法意深度10日游的文字說明。例如造作（圖1-10）展示的都是家居套裝專題，而不是具體某個家居的單品。所以使用16:9 Banner圖片比例。
圖1-10造作首頁的16:9 Banner圖
視覺設(shè)計(jì)2 1:1的Banner圖
如果你的應(yīng)用展示的Banner圖是類似商品性質(zhì)的。圖片具有重要的參考作用，用戶通過觀看精美的圖片，不用太注重文字內(nèi)容的，就可以吸引點(diǎn)擊。圖片比例選擇使用4:3。例如最美有物的Banner圖是以說明單個商品為主（圖1-11），不需要太多文字，用戶也能看的明白，簡單的說有圖片就夠了，所以圖片比例選擇4:3。
圖1-11 最美有物的1:1 Banner圖
模塊4：卡片化內(nèi)容推薦
垂直類電商，首頁需要放置各種專題推薦，來導(dǎo)購各種商品。各種編輯精選，達(dá)人推薦，熱賣商品。對于用戶來說本質(zhì)就是推薦商品。所以用戶并不在乎你的內(nèi)部各種叫法分類。那么一些電商直接打破了那種綜合B2C電商的豆腐塊做法。而是用了卡片化設(shè)計(jì)。各種推薦內(nèi)容就是一個個卡片設(shè)計(jì)，這種設(shè)計(jì)的優(yōu)點(diǎn)就是足夠精簡，看起來有格調(diào)感。缺點(diǎn)就是信息密度很低，容納不了足夠多的信息。
視覺設(shè)計(jì)1 橫向卡片
想去應(yīng)用采用了橫向大卡片的設(shè)計(jì)。啟動畫面推薦的商品（圖1-12），通過一個動畫切換直接顯示在了首頁的默認(rèn)第一個卡片。通過這種強(qiáng)調(diào)的手法，讓用戶足夠聚焦。這個橫向卡片有一個缺點(diǎn)就是可容納信息量不能太大，所以只適合做單一類型的內(nèi)容卡片。如果試圖在卡片上加上各種復(fù)雜的模塊內(nèi)容。一旦卡片過多，用戶在橫向滑動卡片的時候，容易失去位置感。我在哪個模塊，我剛才看的模塊在哪里，用戶容易產(chǎn)生困惑，這是一個魚與熊掌不可兼得的問題。
圖1-12想去的啟動頁和首頁卡片化設(shè)計(jì)
視覺設(shè)計(jì)2縱向卡片
另外一種大卡片設(shè)計(jì)就是縱向卡片，最美有物的首頁卡片是縱向滑動的（圖1-13）。同橫向滑動相比，滑動的易用性略好于橫向滑動，因?yàn)橛脩粢哺?xí)慣于上下滑動?？v向滑動的信息承載度更低于橫向滑動，因?yàn)樾枰撁嫘枰舫鲎銐虻膮^(qū)域，去放置更多前后卡片，去營造卡片的上下立體感。這樣的立體設(shè)計(jì)可以給予用戶更好的位置感。因?yàn)樵O(shè)計(jì)可用區(qū)域小，所以更多通過精心標(biāo)題設(shè)計(jì)去吸引用戶點(diǎn)擊。
圖1-13 最美有物的首頁卡片化設(shè)計(jì)
模塊5：樓層Banner
之前我們說過垂直細(xì)分類的頻道分類可能沒有那么多，所以不需要像B2C綜合類電商那么復(fù)雜的設(shè)計(jì)形式?？赡苤苯右詥我坏膶ｎ}Banner形式展現(xiàn)，從上到下都是Banner形式的樓層。
視覺設(shè)計(jì)1圖片的比例
因?yàn)锽anner設(shè)計(jì)的形式比較單一，采用圖片+文字的視覺樣式。每個樓層就是一個小模塊，那么模塊與模塊之間的如何通過視覺手段進(jìn)行區(qū)分了？Life應(yīng)用采用了1+N的設(shè)計(jì)形式（圖1-14）。設(shè)計(jì)樣式上，Life上半部分大Banner加半透明黑底，下半部分用白色背景，有一個白色上三角，這樣很清晰讓用戶明白，下半部分的商品是從屬于上半部分的專題。
圖1-14 Life的樓層Banner
Life上半部分Banner采用了750*400PX的分辨率， 與16:9相比扣除了22px，沒有采用16:9的原因是，是因?yàn)樯习氩糠峙c下半部分之前有30px的留白，為了不讓整個Banner太高浪費(fèi)面積，所以取整選了400PX高度。
下半部分Banner采用了176*176PX（1:1）的小圖。這樣圖片比例符合之前分析的專題圖適合16:9，商品圖適合用1:1。這樣的大小比例看起來可以讓版塊之前區(qū)分的很清楚。當(dāng)然如果下半部分圖片一定要使用小圖，否則看起來層次就混亂，。例如男衣邦的首頁（圖1-15），上圖和下圖的比例看起來非常的接近。模塊層次區(qū)分的就不是非常好。
圖1-15 男衣邦的樓層Banner
視覺設(shè)計(jì)2 視覺樣式
同一個界面反復(fù)排布出現(xiàn)Banner，所以設(shè)計(jì)形式感要統(tǒng)一。Life采用的是圖標(biāo)+標(biāo)題+欄目上下排版形式（圖1-16）。這樣的設(shè)計(jì)好處是每個模塊很清晰，且用戶可以很清晰的對應(yīng)分類各種子頻道。所以設(shè)計(jì)樣式不是隨意的選擇，單純的看視覺美學(xué)樣式。而是需要有效的對產(chǎn)品運(yùn)營的需求進(jìn)行支撐。
圖1-16 Life首頁樓層banner與分類頁
模塊6：底部導(dǎo)航欄
底部導(dǎo)航一般分為4到5個模塊。以圖標(biāo)+文字的設(shè)計(jì)形式進(jìn)行展示，電商最常見的底部導(dǎo)航欄設(shè)置是首頁，分類，購物車，社區(qū)，我的。
商品分類
因?yàn)榇怪鳖愲娚痰纳唐菲奉愑邢蕖Ｋ院芏鄷r候用戶甚至不知道可以搜什么關(guān)鍵詞，去尋找他想要的商品。所以垂直類電商必須設(shè)計(jì)商品的分類頁面，對于用戶來說這是一種商品的重要檢索形式。同時也讓用戶知道你的平臺有哪些商品可以購買。氧氣的商品分類有二級，所以采用的是類似B2C綜合平臺的品類設(shè)計(jì)形式，小圖+文字形式（圖1-17）顯得非常的緊湊。這種設(shè)計(jì)的好處是在足夠小的面積內(nèi)，可以查看到盡可能多的信息。
圖1-17氧氣的分類頁
如果產(chǎn)品的分類只有一級，可以采用大圖片+文字的設(shè)計(jì)形式。大圖的設(shè)計(jì)信息密度低，占用更多的頁面面積。例如想去（圖1-18）一屏幕只顯示了4個分類，但好看的圖片總是吸引人的眼球。
圖1-18 去的分類頁
購物車
一些垂直類電商應(yīng)用，是導(dǎo)購的性質(zhì)，類似一個中介。通過收取品牌的廣告或者導(dǎo)購的提成生存。當(dāng)用戶通過某個專題，看上這個商品需要購買的時候，可以跳轉(zhuǎn)天貓或者其他B2C電商完成購買（圖1-19），所以并沒有購買支付的模塊，也就沒有購物車。
圖1-19 Life購買商品轉(zhuǎn)跳天貓
社區(qū)
社區(qū)的核心在于解答“什么值得買”這個問題，也可能是各種專題推薦的頻道集合地。社區(qū)分為3個部分：內(nèi)容曝光單品，達(dá)人輔助決策，購買。這個屬于內(nèi)容電商。我準(zhǔn)備在后面章節(jié)單獨(dú)詳細(xì)去講。
我的
這個模塊和B2C綜合類應(yīng)用設(shè)計(jì)差不多，這是一個個人后臺的作用，管理自己購買商品后的一系列狀態(tài)。例如查看商品物流狀態(tài)，退換商品，商品評價等。
市面上的垂直細(xì)分類的App非常多，我挑選了一些自己非常喜歡的推薦給大家。畢竟我一個人看的有限，如果大家有覺得非常不錯的也可以留言告訴我。我的微信是booui2017,請寫明是站酷來的。
推薦1：東家守藝人（手工藝品）
東家作為匠人聚集的地方，專門售賣各種手藝人的親手制作的各種藝術(shù)品（圖1-20）。電商已經(jīng)發(fā)展很多年了，該有的東西都已經(jīng)有。匠人，手藝，消費(fèi)升級，工匠精神，這些詞雖是剛剛熱起來，但手藝人，還有他們的作品，是一直就存在的，靠線下或者著其他線上平臺，或家傳或兼職，他們一直活著。東家的出現(xiàn)讓他們多了一個選擇。東家不僅僅是電商產(chǎn)品，也包含著對傳統(tǒng)手藝的尊重。
圖1-20東家守藝人啟動頁和首頁
推薦2：造作（家居）
售賣原創(chuàng)設(shè)計(jì)家居品牌的平臺（圖1-21）。不知道有多少人像我一樣，去宜家買東西，只會選擇一些小玩意，大的家具不太會去選擇宜家的。因?yàn)橐思业囊恍┐蠹揖?，材質(zhì)以刨花板和密度板居多，用久了就容易變形。其實(shí)性價比不是太高。一些大的裝飾城里的家具感覺又太普通，缺乏設(shè)計(jì)感。造作上有很多極具設(shè)計(jì)感的家具，適合年輕消費(fèi)者。
圖1-21造作啟動頁和首頁
推薦3： Life（家居）
這個應(yīng)用主要是幫你挑選家居各種物品搭配（圖1-22）。適用于追求生活品質(zhì)，喜歡家居中各種各樣精致小物件搭配的用戶群體。里面的各種專題內(nèi)容質(zhì)量很高，值得翻閱。首頁下banner專題設(shè)計(jì)上的圖標(biāo)設(shè)計(jì)非常精致。與板塊內(nèi)欄目上的圖標(biāo)相對應(yīng)，板塊描述非常清晰。
圖1-22 Life啟動頁和首頁
推薦4：好物（家居）
這是一個推薦新潮、創(chuàng)意、優(yōu)質(zhì)的生活物品的應(yīng)用（圖1-23）。
圖1-23好物啟動頁和首頁
推薦5：良倉（綜合）
一個生活美學(xué)分享社區(qū)（圖1-24），有數(shù)百位意見領(lǐng)袖分享各種生活美學(xué)。良倉雜志報(bào)道最有趣味及品味的人和事，良倉商店精選售賣來自全球最精美的生活產(chǎn)品及禮物。
圖1-24 良倉啟動頁和首頁
推薦6：最美有物（綜合）
為時尚達(dá)人提供一個發(fā)現(xiàn)全球好設(shè)計(jì)和優(yōu)秀設(shè)計(jì)師的平臺（圖1-25）。第一眼看到最美有物的麋鹿圖標(biāo)，就知道這是一個非常有設(shè)計(jì)感的應(yīng)用。滿足了人們對美而小眾的產(chǎn)品的需求，使「不從眾」的審美標(biāo)準(zhǔn)逐漸深入人心。這是我認(rèn)為垂直電商里設(shè)計(jì)質(zhì)量相當(dāng)高的應(yīng)用。
圖1-25最美有物啟動頁和首頁
推薦7：想去（綜合）
是一家突出“好設(shè)計(jì)、純手工”的購物分享平臺（圖1-26）。專為時尚達(dá)人提供前沿的設(shè)計(jì)理念與產(chǎn)品。想去的主導(dǎo)航欄圖標(biāo)和應(yīng)用圖標(biāo)的設(shè)計(jì)語言結(jié)合緊密。運(yùn)用了一個小勾這個圖形元素貫穿了圖標(biāo)的設(shè)計(jì)。其中TA說中的banner圖可以顯示動圖，非常的生動有意思。這張動圖是我學(xué)生幫我錄的，大家有好的錄制動圖的方法也可以告訴我。
圖1-26想去TA說子頻道頁
推薦8：野獸派（綜合）
野獸派是綜合類的時尚類家居相關(guān)售賣平臺（圖1-27）。野獸派本來是一個買花起家的應(yīng)用，她賣的不是花，而是花一般的美好的生活理念。隨著越做越大，品類也擴(kuò)張到各種家居、美妝、香氛、配飾和美食等。這里比較吸引人的是野獸派的首頁交互設(shè)計(jì)。使用一個整張插畫，作為首頁各種子模塊店鋪的入口。這樣的設(shè)計(jì)別具一格，的確第一眼非常的吸引人。
圖1-27野獸派的啟動頁和首頁
推薦9：男衣邦（男性服飾）
這是一個解決男士穿衣打扮的問題的應(yīng)用（圖1-28）。男女消費(fèi)行為和女性有很大的不同，女性享受購買衣服的過程（包括線上線下）愿意花費(fèi)大量時間去逛去看，購買結(jié)果具有隨機(jī)性，感性消費(fèi)。而男士買東西講究速戰(zhàn)速決，購買衣服目的性強(qiáng)，追求效率，結(jié)果導(dǎo)向。所以不愿意花太多時間在逛和挑選上。相信很多男士和我一樣，平時對衣著并沒有太大的要求，但也會有一些場合或者對生活品質(zhì)有所追求的時候。希望有得體或者有品位的衣著。那么非常需要這樣一個平臺我該穿什么比較合適。這個設(shè)計(jì)師應(yīng)該是平面出身，非常喜歡運(yùn)用各種海報(bào)元素，從啟動頁到首頁的各種banner，熟練的運(yùn)用各種點(diǎn)線面元素穿插。
圖1-28男衣邦啟動頁和首頁
推薦10：氧氣（女士內(nèi)衣）
氧氣是一款女性內(nèi)衣推薦的平臺（圖1-29）。以精品雜志的方式每天向用戶推薦買手在世界各地親自探店后發(fā)現(xiàn)的內(nèi)衣。雖然竹子是一個男士，對于選擇女性內(nèi)衣這件事情，不能感同身受。不過聽說女士選擇一款舒服的內(nèi)衣也不是那么容易的事情。氧氣內(nèi)有很多內(nèi)衣體驗(yàn)師提供的圖文體驗(yàn)報(bào)告，這些體驗(yàn)師就是從氧氣的用戶中脫穎而出的“達(dá)人”，氧氣希望把這些達(dá)人打造成為意見領(lǐng)袖，由她們來引導(dǎo)用戶的消費(fèi)。
圖1-29氧氣啟動頁和首頁
推薦11： ENJOY（美食）
一個“懂吃、會選、有格調(diào)”的美食電商平臺（圖1-30）。這個和大眾點(diǎn)評不一樣的是， ENJOY挑選的一些餐廳中，有的具備米其林元素的星級餐廳，有的是精雕細(xì)作的家庭小館，有的則以食材產(chǎn)地或料理手法取勝……和時裝領(lǐng)域的買手店類似，“ENJOY-精選限量美食”的核心競爭力是對餐廳和菜品的有效篩選的能力，既不做大眾化的自助餐，也很少接觸連鎖品牌。所以在這里不是以價格吸引人，更多的是那些精致餐廳的推薦。
圖1-30ENJOY啟動頁和首頁
推薦12：花田小憩（鮮花）
這是一個挑選鮮花的應(yīng)用，送花首選（圖1-31）。在不同場合送不同人，應(yīng)該送不同的花，這些都很有講究的。這個應(yīng)用解決的就是這個問題。但很可惜送花是一個日常使用頻次很低的需求，而且淘寶、京東也有完善的送花服務(wù)，所以這個平臺應(yīng)該很難做下去。我推薦這個應(yīng)用的原因是我覺得設(shè)計(jì)師應(yīng)該很喜歡花這個題材，App的logo設(shè)計(jì)也非常不錯。
圖1-31花田小憩啟動頁和首頁
垂直電商的品牌植入
通過以上App的分析發(fā)現(xiàn)，一些有設(shè)計(jì)感的應(yīng)用都非常喜歡使用黑白色調(diào)。且有自己的獨(dú)特的設(shè)計(jì)語言。
現(xiàn)在打開各種設(shè)計(jì)網(wǎng)站，去找尋找app界面設(shè)計(jì)參考。你會發(fā)現(xiàn)如果去掉圖標(biāo)，僅僅去看界面設(shè)計(jì)，很多app的界面設(shè)計(jì)差異性非常小。App設(shè)計(jì)有一種趨于同質(zhì)化的傾向。那么這對界面設(shè)計(jì)師就是一個挑戰(zhàn)，也是一個機(jī)會。
經(jīng)過這幾年的移動創(chuàng)業(yè)風(fēng)潮，大量App設(shè)計(jì)已經(jīng)存在，現(xiàn)在設(shè)計(jì)師遇到的不是從0如何設(shè)計(jì)一款A(yù)pp的問題了，而是面臨各種改版設(shè)計(jì)的需求。如何設(shè)計(jì)一款和競品有差異化設(shè)計(jì)的界面，這是UI設(shè)計(jì)師越來越迫切的需求。
下一篇我要告訴大家如何使用獨(dú)特的品牌設(shè)計(jì)語言，賦予你的App獨(dú)特的設(shè)計(jì)魅力
藍(lán)藍(lán)設(shè)計(jì)( www.alimai.net )是一家專注而深入的界面設(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://www.alimai.net