不知道大家有沒(méi)有聽過(guò) Aesop（伊索）這個(gè)澳洲護(hù)膚品牌子？以天然有機(jī)植物草本為賣點(diǎn)，大部分產(chǎn)品在小幾百到大幾百之間。產(chǎn)品的網(wǎng)站上線后連獲三獎(jiǎng)，網(wǎng)站做得好，我覺(jué)得是定位清晰，想清楚產(chǎn)品的戰(zhàn)略層和范圍層定位定位，并運(yùn)用到結(jié)構(gòu)層、框架層、表現(xiàn)層。下面我們從各個(gè)層面分析一下網(wǎng)站的有哪些可以學(xué)習(xí)借鑒的地方。

Aesop 的天貓國(guó)際店截圖

他們本來(lái)是特別注重線下體驗(yàn)店的，除了裝潢考究之外，里面的護(hù)膚顧問(wèn)也都是經(jīng)過(guò)專門培訓(xùn)的。

這樣一家原本挺傳統(tǒng)的中高端護(hù)膚品牌，與知名設(shè)計(jì)公司 Work&Co 合作推出了自己的購(gòu)物網(wǎng)站。

這個(gè)網(wǎng)站確實(shí)做得很有特色，而且把護(hù)膚購(gòu)物的體驗(yàn)細(xì)節(jié)打磨到位，做到了大型網(wǎng)購(gòu)平臺(tái)做不到的事情。

上線后連獲三個(gè)獎(jiǎng)，我們來(lái)看看有什么可以學(xué)習(xí)借鑒的地方。

信息架構(gòu)

由于 Aesop 注重商品在精不在多，所以網(wǎng)站在導(dǎo)航里就直接將商品目錄列出了，當(dāng)然還是根據(jù)用途和膚質(zhì)進(jìn)行了分類。

這種商品名稱列表的展示方式，還真不是什么電商都適用的。

但是 Aesop 的商品不多而且包裝設(shè)計(jì)非常統(tǒng)一幾乎沒(méi)什么可預(yù)覽的，而老顧客大多更需要快速補(bǔ)貨或者找到新品，所以就不需要像普通電商那樣一層一層地靠預(yù)覽圖尋找。

以及購(gòu)物車的設(shè)計(jì)也非常簡(jiǎn)潔，沒(méi)有圖片只有文字，而且換成深色的背景以提醒用戶注意。

內(nèi)容策略

護(hù)膚品這類產(chǎn)品非常特殊，不像服裝或者日用品那樣看著不錯(cuò)就買了，而是需要向用戶提供很多輔助信息才能促使其下單。

一般在門店里，顧問(wèn)都會(huì)詢問(wèn)顧客的膚質(zhì)和需求，向他們推薦合適的商品，并介紹其功效、用法、成分等信息，并打開讓顧客聞一聞、試一試。

網(wǎng)上購(gòu)物時(shí)，雖然聞一聞和試一試提供不了，但其它的部分還是要想辦法提供。

Aesop 的官網(wǎng)的商品詳情頁(yè)里，第一屏圖片旁邊會(huì)提供的基本信息包括：標(biāo)題+功效說(shuō)明+適合膚質(zhì)+皮膚觸感+主要成分+容量+價(jià)格。

第二屏?xí)峁┮粡埵褂蒙唐返囊曨l或者圖片，并提供更多信息：用法+用量+材質(zhì)+氣味。

第三屏?xí)嬖V用戶，做一套完整的護(hù)膚流程是怎樣的，以及還可以購(gòu)買哪些配套的商品。

另外，回頭客會(huì)收到基于購(gòu)買記錄的個(gè)性推薦，內(nèi)容也會(huì)根據(jù)季節(jié)和地域氣候量身定制。

視覺(jué)語(yǔ)言

Aesop 的產(chǎn)品包裝非常簡(jiǎn)潔，深棕色的瓶子上，貼著米黃色的包裝紙，上面印著深灰色的字，除了一些矩形框之外，幾乎毫無(wú)裝飾。

線下門店的也是在結(jié)構(gòu)上規(guī)整干練，但因?yàn)槎嘤媚举|(zhì)材料，所以沒(méi)有工業(yè)風(fēng)格那種冷冰冰的感覺(jué)。

Aesop 的網(wǎng)站設(shè)計(jì)使用了與包裝紙類似的色調(diào)，把白底換成米黃色，上面無(wú)論是線條還是文字，都是統(tǒng)一的深灰色。

而且整個(gè)網(wǎng)站在布局上運(yùn)用了很多大方框和抽拉效果，與線下門店的設(shè)計(jì)風(fēng)格像呼應(yīng)。

對(duì)于商品展示的風(fēng)格，設(shè)計(jì)團(tuán)隊(duì)也是給出了一套與網(wǎng)站設(shè)計(jì)匹配的范例，Aesop 未來(lái)如果要增加新品，也可以在此基礎(chǔ)上進(jìn)行拓展延伸。

另外，配套的活動(dòng)頁(yè)也設(shè)計(jì)也挺有特色的。

思考總結(jié)

雖然國(guó)內(nèi)購(gòu)物都是平臺(tái)的天下，但是很多大品牌還是沒(méi)有放棄做自己的網(wǎng)站。

Aesop 這個(gè)網(wǎng)站，不論是在視覺(jué)風(fēng)格、內(nèi)容策略還是信息架構(gòu)上，都是為這個(gè)品牌量身定制的，在細(xì)致程度上有統(tǒng)一模板的電商平臺(tái)難以企及的地方。

我想未來(lái)哪怕平臺(tái)再?gòu)?qiáng)再大，小而美的電商如果能夠把細(xì)分領(lǐng)域的體驗(yàn)做到極致，還是有自己的生存空間的。

原文地址：體驗(yàn)進(jìn)階（公眾號(hào)）

作者：設(shè)計(jì)師ZoeYZ

轉(zhuǎn)載請(qǐng)注明：學(xué)UI網(wǎng)》做好大平臺(tái)忽略的細(xì)節(jié)，這購(gòu)物網(wǎng)站連獲三大設(shè)計(jì)獎(jiǎng)

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群，每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì)，如果有興趣的話，可以進(jìn)入一起成長(zhǎng)學(xué)習(xí)，請(qǐng)掃碼藍(lán)小助，報(bào)下信息，藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作，也請(qǐng)與我們聯(lián)系。

分享此文一切功德，皆悉回向給文章原作者及眾讀者.
免責(zé)聲明：藍(lán)藍(lán)設(shè)計(jì)尊重原作者，文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題，請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系，我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計(jì)( m.0391cbd.com )是一家專注而深入的界面設(shè)計(jì)公司，為期望卓越的國(guó)內(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ù)