超全面的社交電商App 詳情頁揭秘!

2018-10-31    資深UI設(shè)計(jì)者

如果您想訂閱本博客內(nèi)容,每天自動(dòng)發(fā)到您的郵箱中, 請(qǐng)點(diǎn)這里

社交電商在2018年可謂風(fēng)起云涌,拼多多、云集、有贊都在18年陸續(xù)宣布融資,并且融資金額都過億。然而社交電商本身就是個(gè)偽命題,雖然人口紅利大不如前,而且社交說白了就是一直被人所反感的微商,刷屏、商品質(zhì)量差,傳銷即視感。

但是有需求就有市場,想一想為什么你討厭拼多多,是假貨、是山寨、還是其他什么,究其原因是飽漢不知餓漢饑。而飽漢只是很少一部分人群而已,我們自然不是他的目標(biāo)用戶,隨你拉黑也無所謂,所以社交電商的崛起是必然,并且有他獨(dú)特的優(yōu)勢:

  • 在移動(dòng)場景下的購物場景更加豐富,勢必為社交電商打下了更好的基礎(chǔ);
  • 社交電商在發(fā)展政策上逐步完善,將是一片潛力巨大的市場;
  • 獲客成本低,下線城市發(fā)展空間大;
  • 電商巨頭排兵布陣,準(zhǔn)備構(gòu)建社交電商生態(tài)。

目前社交電商的形式主要分為兩種,一種是拼團(tuán),如拼多多,這種模式通常發(fā)起者是不收益的,只是所有拼團(tuán)者可以享受更低的價(jià)格購買商品,算是一種利人利己,裂變質(zhì)量更好的一種行為。另一種是微商,這種模式的裂變范圍更廣,但是裂變質(zhì)量較差。微商被冠以惡名刷屏大家都明白,而經(jīng)我們研究發(fā)現(xiàn),其實(shí)發(fā)圈的推薦購物是效率的分銷行為。還有這樣的熟人賣貨邏輯是否可行?

社交是最好做的,也是最難做的。購物從本質(zhì)上來說都是發(fā)現(xiàn)有需求才購物,但逐漸的變成了逛/別人推薦想起來自己有需求,再購物的變化。前者我們可以通過廣告、營銷、產(chǎn)品的優(yōu)化來讓用戶轉(zhuǎn)化,而后者正是現(xiàn)階段我們需要考慮的事情,如何讓用戶買單那些可能有需求的東西,滿足用戶其他更深層次的需求。

2017年艾瑞咨詢的移動(dòng)社交用戶在應(yīng)用內(nèi)購物驅(qū)動(dòng)因素分析,我們能發(fā)現(xiàn)社交關(guān)系鏈的價(jià)值還是非常值得挖掘的呢。

俗話說的好,詳情頁乃兵家必爭之地,得詳情頁者得天下。首先我們來看看詳情頁的首屏??芍^是百花齊放了,業(yè)務(wù)、用戶、場景決定了功能與信息架構(gòu)。電商詳情之所以復(fù)雜就是因?yàn)樗枰休d很多復(fù)雜的場景,所以很多時(shí)候并不是所有的信息都是有用而你又無法簡化。這顯然不僅僅是普通的電商所呈現(xiàn)出來的商詳,而是擁有「社交背景的商詳頁。」

那么下面我們分別從功能結(jié)構(gòu)、以及細(xì)節(jié)來剖析這四款電商產(chǎn)品的商詳。

一、拼多多

1. 功能結(jié)構(gòu)

從信息結(jié)構(gòu)上看頁面信息層級(jí)還是比較清晰的,也確實(shí)很像3,4線城市大賣場的感覺,各種活動(dòng)優(yōu)惠的標(biāo)簽也是很排斥奧卡姆的剃刀了。但是各種活動(dòng)標(biāo)簽依然讓人有些眼花繚亂,視覺上頁面缺少一些品牌特征。

其實(shí)我之前有做過物流的產(chǎn)品,當(dāng)時(shí)也很糾結(jié)好用和好看的平衡點(diǎn)到底在哪里,后來我發(fā)現(xiàn)了如果為了要用而要舍棄好看,請(qǐng)不要猶豫,一定要選擇好用。而你一旦絞盡腦汁想辦法折中,對(duì)不起,那會(huì)變的既不好看又不好用。所以拼多多的視覺、圖片風(fēng)格我還是很能理解的。

然后首屏的上半部分依然是幫助用戶建立認(rèn)知的信息介紹區(qū)域,同樣也是大圖置頂?shù)姆绞?,但是?xì)心的小伙伴在對(duì)比的時(shí)候能發(fā)現(xiàn)拼多多其實(shí)把全場包郵、假一賠十等特色信息放在了第一梯隊(duì)的板塊,很明顯,它想告訴大家我們的服務(wù)是一流的,不會(huì)有假貨,因?yàn)槿巧秸?

2. 細(xì)節(jié)

比較特殊的地方是,在左下角有一個(gè)更多的按鈕,收納了歷史瀏覽、回到首頁和幫助3個(gè)功能,通?!父唷沟陌粹o會(huì)放置在右上角,這里的設(shè)計(jì)和大部分用戶的認(rèn)知可能不太一致。還有一個(gè)比較有意思的是,價(jià)格最右側(cè)顯示的是已拼而不是已售,所以從細(xì)節(jié)能看出來拼多多是有多么強(qiáng)調(diào)拼團(tuán)這個(gè)屬性了。

然后我們熟悉的購物車功能沒有,因?yàn)槠炊喽嘁彩窍迺r(shí)拼團(tuán)電商,要拼團(tuán)先支付,所以沒有購物車的場景。而大家看到的單獨(dú)購買這個(gè)錨定效應(yīng)也是運(yùn)用的很直接了,應(yīng)該沒有人會(huì)用更高的價(jià)格還死命的加購物車吧?

錨定效應(yīng)(Anchoring effect)是指當(dāng)人們需要對(duì)某個(gè)事件做定量估測時(shí),會(huì)將某些特定數(shù)值作為起始值,起始值像錨一樣制約著估測值。在做決策的時(shí)候,會(huì)不自覺地給予最初獲得的信息過多的重視。

二、云集

1. 功能結(jié)構(gòu)

云集首先是一家會(huì)員制電商,其次才以社交的手段來進(jìn)行分銷的電商。大部分以微商形式存在的電商都會(huì)面臨店主同時(shí)可以買或者賣的場景。然而很有趣的是,這樣的 s2b2c的模式,商詳究竟要如何做呢?其實(shí)你能發(fā)現(xiàn),優(yōu)秀的電商產(chǎn)品總有自己的核心關(guān)鍵詞,比如拼多多是拼團(tuán),云集是批發(fā)價(jià)。所以當(dāng)我們要滿足買的場景時(shí)告訴用戶自購可以享受批發(fā)價(jià),而賣的場景則可以賺利潤。雖然買的場景多,但是為了業(yè)務(wù)考慮,我們依然要把賣的場景做足。

在商品詳情中,和其他產(chǎn)品不同的是多了這幾個(gè)功能:

  • 任務(wù)獎(jiǎng)勵(lì),通過完成銷售筆數(shù)和金額達(dá)成任務(wù)。
  • 品牌授權(quán),對(duì)擁有被授權(quán)資格的商品透出品牌授權(quán)背書入口,增加用戶的品牌信任度。
  • 發(fā)圈素材,不是自用推薦的商品,一般很難賣,別人的發(fā)圈素材能夠幫助店主更快的賣貨。
  • 大家都在賣,賣也要賣好賣賺得多的商品。

以上的功能都是刺激以及幫助這些小b去推薦及銷售商品。從而整個(gè)商詳頁都是為了形成一種賣的氛圍同時(shí)兼顧著買的功能。

其實(shí)我們都知道,社交電商(微商)都是有組織有紀(jì)律的,只有散戶才會(huì)自己挑商品找素材去賣貨,而擁有社群的店主只需要一個(gè)商品的二維碼即可。

2. 細(xì)節(jié)

用過云集的買家都知道,云集和環(huán)球捕手一樣是沒有和其他電商一樣的評(píng)價(jià)功能的,會(huì)有人問為什么那么重要的評(píng)價(jià)功能不放呢,別人如何建立信任呢?其實(shí)我們有在收集評(píng)論但并沒有公開,而且我們側(cè)重的是推薦購買,別人推薦你之后其實(shí)評(píng)論的意義就不大了。所以既然我們?cè)谑占u(píng)論那在供應(yīng)商的選擇上也會(huì)一直更新。

另一個(gè)原因就是評(píng)論這個(gè)功能在去中心化的小b店主為中心的產(chǎn)品中并不合適,可以想一想,社交電商和傳統(tǒng)電商不同,傳統(tǒng)電商會(huì)有商家入駐,商家和小b店主的區(qū)別在于商家除了需要銷售商品時(shí),還需要維持店鋪的信譽(yù)和好評(píng)率,所以評(píng)論對(duì)于商家來說特別重要。但是以平臺(tái)為背景的店主只需要分享商品賣貨就行,評(píng)論的好壞并不是特別重要。

所以說到這里大家就會(huì)覺得社交電商真的是一個(gè)偽命題,你到底是為了別人好還是純粹想賺錢。所以大家發(fā)現(xiàn)在這樣的場景下,評(píng)論好那么都OK,如果出現(xiàn)大批量的差評(píng),這個(gè)差評(píng)給的是商品,并不是某一個(gè)小b店主,在這里商品和服務(wù)就不像傳統(tǒng)電商那樣捆綁在一起而是區(qū)分開了。

三、環(huán)球捕手

1. 功能結(jié)構(gòu)

信息整體強(qiáng)調(diào)了價(jià)格和限時(shí)特賣,弱化了標(biāo)題和介紹。再早些時(shí)候所有 app 都還把標(biāo)題放在價(jià)格的上面,并以大字體風(fēng)格為驕傲。現(xiàn)在反而都把價(jià)格放在了標(biāo)題上面,而環(huán)捕把價(jià)格元素做的更加明顯。

2. 細(xì)節(jié)

標(biāo)題和介紹字號(hào)變小我認(rèn)為可以理解,在同樣以推薦消費(fèi)的背景下,我已經(jīng)知道是什么商品了,不管是從別人推薦而來還是自己從列表點(diǎn)進(jìn)來都已經(jīng)對(duì)該物品有詳細(xì)的了解,商品標(biāo)題和介紹并不是特別重要。不過既然如此,介紹放一行也應(yīng)該足夠了,既要弱化為什么又要放多行。排名和最近銷量筆數(shù)的視覺呈現(xiàn)有待改進(jìn),一個(gè)直角一個(gè)圓角不太和諧,最近銷量不可點(diǎn)擊卻做成按鈕的形狀。

四、洋蔥海外倉

1. 功能結(jié)構(gòu)

大家可能對(duì)洋蔥跨境電商比較陌生。它同樣也是一個(gè)線上的分銷平臺(tái)。它的模式和其他兩個(gè)稍有區(qū)別,用戶如果想賣貨可以選擇兩種方式,一種是成為代理商,代理商可以招募店主,同時(shí)可以獲得下面店主銷售利潤的30%。而店主不可以招募店主。而另一種就是直接成為店主,可以獲得銷售額利潤的70%。

說完模式,我們來看看它商詳?shù)男畔⒄故尽J紫任覀儠?huì)發(fā)現(xiàn)在商品大圖上方展示的是相關(guān)的8件好貨,那么我們能想到的是:

  • 為了提高客單價(jià),
  • 跨境電商的郵費(fèi)國際物流和清關(guān)費(fèi)較貴。

所以能一次性買足夠的商品自然是比較劃算,所以在這里更明顯的位置放置了相關(guān)的商品供買家和賣家挑選。

你會(huì)發(fā)現(xiàn)洋蔥在詳情中加入了評(píng)價(jià)功能,但這里的評(píng)價(jià)并不是所有的用戶的評(píng)價(jià)都能夠被顯示出來,而是經(jīng)過官方審核以及店主上傳的評(píng)價(jià)才能夠被顯示的。

2. 細(xì)節(jié)

洋蔥將利益點(diǎn)和賣點(diǎn)放在了圖片中沉底,這也能夠讓商品與文案的關(guān)聯(lián)性更強(qiáng),缺點(diǎn)是容易被忽略。

產(chǎn)品介紹上方會(huì)出現(xiàn)一個(gè)頭像,但是新手用戶會(huì)很疑惑這個(gè)頭像到底是誰?官方還是店主不得而知。而該產(chǎn)品的介紹文案過多也會(huì)影響首屏的展示效率。

洋蔥將返回首頁、以及底部標(biāo)簽導(dǎo)航的功能集合在了一個(gè) fab上,令人不太理解的是懸浮按鈕中和底部均有購物車功能,然而二級(jí)頁面也沒有存在這個(gè) fab,所以懸浮按鈕中的購物車功能有點(diǎn)雞肋。

所有的「社交電商」在應(yīng)用內(nèi)放置互動(dòng)聊天的功能都特別雞肋。店主與買家的社交紐帶依然是微信,而平臺(tái)對(duì)于買家來說只有在逛和買的時(shí)候才會(huì)使用,即使做了IM也無法在應(yīng)用中植入社交場景,更不用說讓用戶養(yǎng)成習(xí)慣了。所以做社交要有背景。

底部只有加入購物車,沒有立即購買按鈕。一個(gè)是希望提高客單價(jià),同時(shí)幫助用戶節(jié)省物流費(fèi)。另一個(gè)是 b2c電商的產(chǎn)品都由平臺(tái)物流統(tǒng)一發(fā)貨,他和 c2c 的淘寶不同的是淘寶購物都是根據(jù)不同的商家進(jìn)行物流運(yùn)輸,所以不同的業(yè)務(wù)模式形成的功能也是不同的。

總結(jié)

廣告營銷的電商模式未必能滿足喜歡個(gè)性化需求的用戶,我們購物或許會(huì)逐漸的變成你覺得我適合買什么而不是我看看你有什么。徐志斌老師在《社交紅利》中提出社交紅利能夠從人與人之間的關(guān)系,互動(dòng)中產(chǎn)出更多的價(jià)值,那么基于電商背景是否可以將電商價(jià)值最大化。

而我們今天討論的社交電商商詳,它能夠幫助小b用戶與c端用戶更的鏈接,不同業(yè)務(wù)模式下的商詳所呈現(xiàn)出來的功能、框架、視覺表現(xiàn)都是有很大區(qū)別的,而我們要做的是讓買賣雙方的關(guān)系鏈更結(jié)實(shí)。

藍(lán)藍(lán)設(shè)計(jì)sillybuy.com )是一家專注而深入的界面設(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ù)。

分享本文至:

日歷

鏈接

個(gè)人資料

存檔