設(shè)計(jì)實(shí)戰(zhàn):談?wù)劸W(wǎng)易嚴(yán)選企業(yè)購(gòu)的交互設(shè)計(jì)
TO B設(shè)計(jì)怎么做?看看文章就知道。
企業(yè)采購(gòu)是現(xiàn)今市場(chǎng)經(jīng)濟(jì)下一種最主要最主流的采購(gòu)形式,其特點(diǎn)是大批量采購(gòu)商品。傳統(tǒng)的企業(yè)采購(gòu)方式不可避免地會(huì)帶來(lái)如回扣、效率低、采購(gòu)過(guò)程不透明等諸多問(wèn)題。
現(xiàn)今的主流電商網(wǎng)站或品牌在滿足廣大消費(fèi)者的同時(shí),都細(xì)分出企業(yè)采購(gòu)的特殊場(chǎng)景——設(shè)立企業(yè)采購(gòu)網(wǎng)站,如天貓、京東、小米等。由于各家電商的定位不同,在網(wǎng)站設(shè)計(jì)的表現(xiàn)與邏輯架構(gòu)也不盡相同。
建立企業(yè)采購(gòu)網(wǎng)站這種細(xì)分運(yùn)營(yíng),正是“信息傳遞要準(zhǔn)確”的表現(xiàn),能為C端和B端的用戶都帶來(lái)最友好的體驗(yàn)。需要注意的是企業(yè)采購(gòu)并不是面向廣大普通用戶的,因?yàn)樗男枨笈c使用場(chǎng)景比較特殊,例如企業(yè)采購(gòu)的商品數(shù)量大、訂單金額大,還有會(huì)涉及到一些梯度折扣、分期付款、代下單等等的采購(gòu)的業(yè)務(wù)流程。
那么,如何設(shè)計(jì)網(wǎng)易嚴(yán)選企業(yè)購(gòu)的網(wǎng)站呢?可以與網(wǎng)易嚴(yán)選主站設(shè)計(jì)的一樣嗎?還是有所區(qū)別呢?
讓我們回到原點(diǎn)去看這個(gè)問(wèn)題。
解析使用場(chǎng)景
用戶是誰(shuí)?使用環(huán)境如何?
企業(yè)采購(gòu)人員(背后是他們的老板)。
正是因?yàn)槲覀兊挠脩魰?huì)在上班時(shí)間,在辦公室使用電腦來(lái)完成他們的采購(gòu)工作,所以網(wǎng)易嚴(yán)選企業(yè)購(gòu)優(yōu)先做了網(wǎng)站,而不是APP。
用戶的目標(biāo)是什么?他們希望如何?
我們通過(guò)訪談了解到企業(yè)采購(gòu)人員希望可以高效地買(mǎi)到性價(jià)比高的商品。這些商品可能是給企業(yè)員工發(fā)的獎(jiǎng)品福利,可能是贈(zèng)送給客戶禮品,也可能是采購(gòu)給企業(yè)員工日常使用的辦公用品等等。
特別是企業(yè)采購(gòu)這樣的大宗訂單,若是能用較少的成本,獲得員工的滿意、客戶的認(rèn)可、老板的贊賞,還提高了采購(gòu)人員的工作效率,同時(shí)避免了可能存在的回扣等問(wèn)題,對(duì)于企業(yè)來(lái)說(shuō)是十分有利的。
我們?cè)趺礊橛脩籼峁┧麄兿胍姆?wù)?
企業(yè)采購(gòu)一般商品數(shù)量大、訂單金額大,還有會(huì)涉及到一些梯度折扣、分批付款、代下單等特殊業(yè)務(wù)流程,我們將結(jié)合這些業(yè)務(wù)流程提供流暢購(gòu)物體驗(yàn),使得用戶在采購(gòu)商品的過(guò)程中是愉悅并且高效的。
確立設(shè)計(jì)目標(biāo)
通過(guò)歸納用戶群和我們自身的特性,并與業(yè)務(wù)目標(biāo)相結(jié)合,得出網(wǎng)易嚴(yán)選企業(yè)購(gòu)的設(shè)計(jì)目標(biāo),下文將針對(duì)網(wǎng)易嚴(yán)選企業(yè)購(gòu)主頁(yè)設(shè)計(jì)進(jìn)行探討:
如何確保用戶快速知道如何使用網(wǎng)站?
即看一眼就能明白這個(gè)網(wǎng)站有什么商品、怎么去購(gòu)買(mǎi),也可以快速找到他們想去的地方,比如瀏覽某一類商品、搜索某個(gè)商品、或者去申請(qǐng)企業(yè)認(rèn)證。就像iPhone老用戶換iPhone8的時(shí)候,不再需要閱讀它的說(shuō)明書(shū)就可以下載APP并使用它們。
所以網(wǎng)易嚴(yán)選企業(yè)購(gòu)的網(wǎng)站在設(shè)計(jì)上需要符合用戶習(xí)慣與認(rèn)知:與網(wǎng)易嚴(yán)選及其他主流電商網(wǎng)站,有相似的地方,但也存在一些差異(將在下文細(xì)述)。
如何向用戶傳遞品牌特色:“好的生活,沒(méi)那么貴”?
通過(guò)網(wǎng)站清晰的信息架構(gòu)、使用高質(zhì)量的商品圖片、UI設(shè)計(jì)突出品質(zhì)感、頁(yè)面的通透留白、來(lái)體現(xiàn)這種精致、實(shí)用的感覺(jué)。同時(shí)在主頁(yè)的每個(gè)商品下突出制造商信息或是商品描述,作為賣(mài)點(diǎn)露出,再次強(qiáng)調(diào)了商品的高質(zhì)量。
列表商品坑位
怎樣提高轉(zhuǎn)化率?
轉(zhuǎn)化率主要有兩個(gè)指標(biāo),一是申請(qǐng)企業(yè)認(rèn)證;二是下單采購(gòu)。
企業(yè)認(rèn)證是企業(yè)采購(gòu)必不可少的一個(gè)重要環(huán)節(jié),由于企業(yè)認(rèn)證需要填寫(xiě)較多的信息,諸如企業(yè)營(yíng)業(yè)執(zhí)照號(hào)等一系列企業(yè)相關(guān)信息,門(mén)檻相對(duì)較高,那么如何促進(jìn)用戶去主動(dòng)完成申請(qǐng)認(rèn)證呢?
此處在設(shè)計(jì)上通過(guò)利益點(diǎn)去吸引用戶一步步完成資料提交與購(gòu)買(mǎi):
1.在用戶未登錄時(shí),會(huì)在首頁(yè)的商品坑位下方展示“登陸查看企業(yè)折扣 ” 來(lái)吸引用戶登錄;在用戶登陸后,若未申請(qǐng)企業(yè)認(rèn)證的,會(huì)顯示 “認(rèn)證后查看企業(yè)折扣?” ;在通過(guò)企業(yè)認(rèn)證后,則顯示 “企業(yè)專享X折起?” 。
首頁(yè)商品坑位
2.在版頭右側(cè)的輔助信息模塊上的黃色按鈕文案:”提交企業(yè)信息”也會(huì)隨著認(rèn)證狀態(tài)的改變而變化,而且它與企業(yè)購(gòu)的業(yè)務(wù)特色介紹放在一起,更能刺激用戶去申請(qǐng)認(rèn)證。
導(dǎo)航-輔助信息模塊
在用戶通過(guò)企業(yè)認(rèn)證后,通過(guò)高質(zhì)量的商品和較高的性價(jià)比吸引用戶實(shí)際下單,就頁(yè)面的引導(dǎo)來(lái)說(shuō),從商品詳情的設(shè)計(jì)、首頁(yè)的場(chǎng)景分類的運(yùn)營(yíng)、精選熱賣(mài)的引導(dǎo)去增加轉(zhuǎn)化率。
體現(xiàn)交互設(shè)計(jì)的價(jià)值
主頁(yè)的設(shè)計(jì)對(duì)于網(wǎng)站來(lái)說(shuō)至關(guān)重要,因?yàn)樗粌H僅是一個(gè)入口,它更是讓用戶看到自己正在尋找的東西。在主頁(yè)設(shè)計(jì)之中,首屏的設(shè)計(jì)尤為重要,而導(dǎo)航又是首屏里的重要元素之一。
信息架構(gòu)
在主頁(yè)的信息架構(gòu)上來(lái)說(shuō),網(wǎng)站主頁(yè)信息架構(gòu)簡(jiǎn)潔清晰:網(wǎng)頁(yè)的頭部是導(dǎo)航,其中包括搜索、采購(gòu)清單、一級(jí)類目+經(jīng)典商品、場(chǎng)景分類。頁(yè)面中央是banner廣告位,往下是各類商品推薦:如精選熱賣(mài)、場(chǎng)景分類、類目分類;底部是合作企業(yè)的露出與嚴(yán)選企業(yè)采購(gòu)網(wǎng)站的相關(guān)介紹。
信息架構(gòu)示意圖
網(wǎng)易嚴(yán)選企業(yè)購(gòu)主頁(yè)頭部的導(dǎo)航設(shè)計(jì)充分展示了網(wǎng)站的結(jié)構(gòu);中部的banner廣告位與各類分類入口,則為業(yè)務(wù)方保留了較大的擴(kuò)展性,方便對(duì)某些商品進(jìn)行露出、營(yíng)銷;底部用詳細(xì)的網(wǎng)易嚴(yán)選業(yè)務(wù)相關(guān)介紹來(lái)結(jié)束頁(yè)面,再次強(qiáng)調(diào)了品牌性,營(yíng)造可信賴的安全感。
導(dǎo)航設(shè)計(jì)
把導(dǎo)航放在標(biāo)準(zhǔn)的位置—頁(yè)面頂部,可以讓我們快速定位、不必費(fèi)力,標(biāo)準(zhǔn)化的外觀讓我們更容易把它們與別的東西區(qū)分開(kāi)來(lái)。網(wǎng)站導(dǎo)航通過(guò)具體化網(wǎng)站的層次結(jié)構(gòu)補(bǔ)償了這種缺失的空間感,營(yíng)造出某種位置的感覺(jué)。
網(wǎng)易嚴(yán)選企業(yè)購(gòu)的導(dǎo)航條構(gòu)成為:網(wǎng)站LOGO、類目、和實(shí)用工具(搜索、采購(gòu)清單、在線留言)、分類快速入口、網(wǎng)站特色露出。
導(dǎo)航結(jié)構(gòu)示意圖
縱向?qū)Ш綄⒁患?jí)類目和該類目下的典型商品一起展示在最外層,使企業(yè)采購(gòu)人員可以掃一眼就知道這里大致有哪些商品。
橫向?qū)Ш秸故緢?chǎng)景分類的快捷入口,相當(dāng)于是為用戶提前創(chuàng)建好了適用于不同場(chǎng)景的購(gòu)物清單,以此引導(dǎo)用戶、幫助他們快速找到某些用途的商品。
另外,在頭部的搜索入口可以幫助用戶快速找到想要尋找的商品,而將一般的購(gòu)物車命名為采購(gòu)清單也更貼近業(yè)務(wù)。其次,輔助信息的模塊中露出用戶信息與網(wǎng)站特色可以再次強(qiáng)調(diào)品牌性。
上圖:網(wǎng)易嚴(yán)選企業(yè)購(gòu) ? ?下圖:網(wǎng)易嚴(yán)選
網(wǎng)易嚴(yán)選企業(yè)購(gòu)在導(dǎo)航的設(shè)計(jì)上嚴(yán)選主站略有不同,企業(yè)采購(gòu)站需要注重效率,但嚴(yán)選主站的用戶是廣大消費(fèi)者,逛的特性更強(qiáng)一些、商品也更多。因此在導(dǎo)航上只展示一級(jí)類目,需要hover去觸發(fā)二級(jí)類目的展示,這種漸進(jìn)式地引導(dǎo),更能吸引用戶去逛網(wǎng)站,去到處看看有什么驚喜,以此增加更多的商品露出與轉(zhuǎn)化。
網(wǎng)易嚴(yán)選的商品主要分為居家、餐廚、配件、服裝、洗護(hù)、嬰童、雜貨、飲食、志趣這九大類目,共包含1000余種商品。其中適合企業(yè)采購(gòu)的商品種類相對(duì)較少,也是嚴(yán)選企業(yè)購(gòu)的類目導(dǎo)航設(shè)計(jì)得比較淺的原因之一。
作者:柴蒙,網(wǎng)易嚴(yán)選交互設(shè)計(jì)師,主要負(fù)責(zé)網(wǎng)易嚴(yán)選主站,APP,小程序,企業(yè)采購(gòu)的交互設(shè)計(jì)。
本文來(lái)源于人人都是產(chǎn)品經(jīng)理合作媒體@網(wǎng)易UEDC,作者@柴蒙
題圖來(lái)自 Pexels,基于 CC0 協(xié)議
想請(qǐng)問(wèn)一下 企業(yè)認(rèn)證是否是一個(gè)必要項(xiàng)
我進(jìn)入企業(yè)購(gòu)后,自動(dòng)登錄的是我本人的嚴(yán)選賬號(hào)。
用戶會(huì)不會(huì)覺(jué)得自己企業(yè)購(gòu)的訂單,會(huì)與私人的嚴(yán)選訂單關(guān)聯(lián),從而影響轉(zhuǎn)化呀?
呵呵 下一個(gè)考拉