09.19 盤點:3大主流電商平臺那些亮眼的交互細節

主流電商平臺有哪些亮眼的交互細節,筆者結合個人的思考對電商平臺新細節新功能進行了較為深入的分析,一起來看看~

盘点:3大主流电商平台那些亮眼的交互细节

相信大家手機裡肯定都至少有2~3個電商App(資深剁手黨可能一個九宮格裝不下……沒錯,那就是筆者本人了),淘寶、天貓、京東、唯品會等等這些綜合電商大頭你們一定不陌生。

日常我們買買買的時候,主要就是兩種場景,一是已經有明確的目標商品趕緊去付款剁手,二是在App裡閒逛,殺殺碎片時間,然後看看有沒有看中想買的商品……

但無論哪種場景都繞不開“購買”這個中心,而平時我們更多地集中於買買買,卻很少留意到背後蘊含強邏輯但在表現層上比較細微的交互設計。

其他類型平臺的交互細節設計可能更多偏向於讓用戶使用的時候更爽,使其情緒或情感上產生共鳴,讓用戶對App的好感度提升。

但電商平臺的設計出發點多少有些差異,這是由於電商平臺在戰略層面上的核心目的是讓用戶更好更快更開心地剁手(這個筆者已深有體會了……),因此交互細節的設計更多偏向於引導購物決策。

下面我們就來看看,平臺是如何不知不覺中讓我們一步步加快自己剁手的節奏的,或在剁手的過程中感覺更愉悅的。

一、京東

1. 深化個性化推薦的購物場景,錨點至推薦區的懸浮窗,且突出展示

京東App中原本只有下滑超過一定距離時會展示的錨點至頂部的懸浮窗(灰色展示)如下圖1,這個設計在電商平臺中已經是很常見的。

後來發現當下滑一小段距離且未到達個性化推薦區時,該懸浮窗顯示錨點至推薦區,且使用亮眼的紅色底色,突出展示,如下圖2。

暫時未在其他電商平臺發現錨點至推薦區的交互,從這裡可以看出京東是非常重視個性化推薦的。

  1. 由此追溯回京東的個性化推薦演變的歷史,個性化推薦起步於2012年,至2015年的時候已經有公開數據表明個性化推薦的訂單貢獻率達到了平臺總量的10%(可惜暫時沒有找到最新的個性化推薦的訂單貢獻率的公開數據),可見個性化推薦在京東平臺的重要地位。
  2. 該推薦錨點的設計也恰恰反映出了平臺力推個性化推薦的用意,同時通過讓用戶更多地瀏覽推薦區商品,反過來完善推薦引擎中用戶的數據,豐富用戶的購物特徵,使其推薦能夠更加精準地觸達用戶,促使其購買。
盘点:3大主流电商平台那些亮眼的交互细节

2. 一鍵便捷修改促銷的應用場景,提示並一鍵修改促銷

選擇商品之後,若商品同時參與多個促銷,而其中某多款商品命中同一個促銷但是促銷上並沒有選擇同一個,則勾選該多款商品之後會出現懸浮按鈕提示“立省¥14”,點擊按鈕後彈出對應解釋“已選商品有更優惠促銷,修改後立省¥14”,點擊右方按鈕“修改促銷”即可一鍵修改相應促銷至滿足當前立省的金額。

這個交互細節可以達到以下目的:

(1)價格和優惠始終是用戶購物時候首先且重點關注的點,這個懸浮按鈕先通過醒目的紅色“立減¥xx”瞬間吸引用戶的注意,促使用戶去點擊查看到底存在個什麼樣的優惠。

這裡考慮到了用戶的實際購買場景,用戶可能不會為了達到促銷門檻去湊單,或湊單裡沒有合適的商品,或用戶可能僅僅需要買已勾選的商品,而未命中的促銷也很可能導致用戶因為拿不到優惠而放棄結算,這樣就相當於流失掉了用戶,因此設置懸浮按鈕提醒用戶已滿足另外的促銷,就大大提高了用戶結算的可能性了

(2)點擊懸浮窗之後展開命中的促銷的說明,能夠讓用戶清楚自己命中的促銷情況,這樣一來也明確告訴用戶優惠的來源,而不是暗藏了其他的坑去讓用戶踩,起到讓用戶安心的作用

另外,適當且簡潔的說明也能起到促使用戶點擊右方“修改促銷”的作用,達到讓用戶修改促銷並去結算的目的。

(3)點擊“修改促銷”之後就是提交訂單頁,整一個從提示優惠→優惠說明→修改促銷→結算的流程一氣呵成,體驗良好,完全沒有“中間環節”打斷用戶去支付的操作,可謂給了用戶極強的剁手助攻!(筆者就是這樣刷刷刷完成了剁手滴……)

盘点:3大主流电商平台那些亮眼的交互细节

3. 常購清單功能提升復購率

京東的搜索框頁中包含了“常購清單”的功能入口,清單會展示存在的促銷及3個對應促銷商品的圖片,而清單頁裡包含了平臺記錄的用戶常購的商品、曾購買的次數和加購功能。

(1)高頻購買的商品的復購可能性非常高。該功能就非常方便用戶能夠在自己常購的商品中繼續復購,而無需重新去搜索商品或者在訂單中翻出曾購買的目標商品訂單然後再加購。

(2)在用戶購買時的心理層面上分析該功能,既是自己常購的商品又剛好有促銷,大部分用戶都會點擊去查看促銷,並且有很大可能性會因此有優惠而囤貨(雙11其實也是抓住了用戶類似的心理,有促銷,寧願囤貨也千萬不能放過),所以這裡的細節是緊緊抓住了用戶的購買心理來設計的,筆者也會關注後續是否有官方公開數據去說明該功能的實際效果。

盘点:3大主流电商平台那些亮眼的交互细节

二、淘寶

1. 加強直播購物的引導,訂單詳情頁增加“直播入口”

訂單詳情頁商品上方增加與商品相關的直播入口,點擊“立即觀看”按鈕可直接進入直播頁面。

這裡的入口設置強關聯了直播,結合淘寶直播的數據就很清楚這裡設置的目的,就是要加強引導用戶去直播購物。

(1)目前根據公開數據可知,淘寶直播入口創造的GMV佔比大幅度上升,而今年的618主推淘寶直播後,618大促直播引導成交額為130億元,618期間的開播商家數同比增長近120%,開播場次增長150%。

淘寶直播間現在已成為商家標配,通過淘寶直播,利用明星和網紅的帶貨能力導購,從內容上打開流量入口。

因此在範圍層上配合戰略層力推直播購貨的消費場景,在訂單詳情頁新增該直播入口,達到多方位引導用戶觀看直播甚至培養用戶養成邊看邊買的習慣。

(2)在訂單詳情頁設置該直播入口是

從用戶的購物需求以及購物行為出發考慮的,該用戶已經購買了店鋪的商品,對店鋪的商品感興趣或有一定程度的瞭解且有購買需求,因此在訂單詳情中觸達用戶是存在極大的刺激復購可能性的

而一般用戶購買了商品之後有很大可能性會查看訂單詳情頁,出於如再次查看商品/商品價格或查詢物流等等目的,所以利用該頁面的高進入頻次來引導用戶進入店鋪的直播間,可以預想轉化率相對會比較高。

盘点:3大主流电商平台那些亮眼的交互细节

2. 更快捷領券結算

若用戶存在未領券就準備進入結算階段,則“去結算”按鈕自動變更為“領券結算”,點擊後系統自動幫用戶領取適用的優惠券並進入提交訂單頁面。

(1)這一操作流程可以節省用戶領券的操作時間,直接點擊就領券進入結算頁面,話不多說系統直接就“催”你趕緊付款,從領券結算到支付完成一氣呵成,很好地秉承了“絕對不打斷用戶支付流程”的核心要旨。

(2)很貼心地幫可能沒注意到優惠的用戶領取到優惠,能提升用戶購物時的體驗愉悅度。試想一下,當你已有消費金額的心理預期時,突然系統告訴你有優惠,打個小折省點小錢,是不是心裡突然就欣喜了?這不有優惠嘛,趕緊下單,買了買了!(當然,不在乎打折的土豪請隨意……)

(3)小結一下,這個“領券結算”的交互不僅僅能從操作上給用戶帶來良好體驗,還能在情感層面上給予用戶驚喜,促進購買決策,所謂是一舉兩得。

盘点:3大主流电商平台那些亮眼的交互细节

3. 圖片比文字更吸引眼球

淘寶的熱搜板塊從單純的“#文字話題”轉變成圖片加文字及熱榜指數,點擊進去是熱榜相關的內容及商品,且熱搜榜會根據熱度實時更新。

其實這裡更偏向於視覺細節層面的雕琢,而非交互層面的。

個人感覺這個細節所起的作用還是比較大的,因為圖片永遠比文字更能夠吸引用戶的眼球。

單純是文字的話題可能大部分用戶都不會去點擊,但是有了圖片之後,用戶很大可能會被有趣的圖片所吸引,然後點擊進去熱榜查看,從而增加了熱榜頁面的點擊率,也有可能帶動了熱榜相關聯的商品的曝光率、點擊率和轉化率。

所以,筆者個人認為這個細節上的轉變雖細微,但有很大可能性能夠帶動一系列的商品相關數據的增長。

後來看到億邦動力網9.18的推文介紹,原來筆者在發現“全網熱搜”的功能至本文介紹到該功能的這段時間,該功能是處於A/BTest灰度測試的狀態,因此全網只有50%的用戶可以看到並且試用該功能(筆者很榮幸成為可以試用的那一半的用戶,可能筆者近年來為淘寶貢獻了不少GMV),等待該功能正式全量上線後,筆者會繼續關注該熱搜功能是否會在數據上為淘寶帶來增量。

盘点:3大主流电商平台那些亮眼的交互细节

三、淘寶/京東

滲透在邊角細微處的公益,提升平臺形象

在淘寶和京東的搜索框中搜索瀕危動物的非法商品的相關字眼,會出現以下的保護瀕危動物的公益頁面,其中包含了瀕危動物相關的知識科普及相關法律法規的知識。

(1)搜索框原本的設計是為了承載用戶搜索商品,查找信息的功能屬性,但是如果能夠好好被利用起來,該功能也是有很強的延展性的

比如這裡提到的公益性質的搜索結果頁,就能夠很好地將保護瀕危動物的相關知識科普到給用戶,讓公益滲透到了邊角的細微處,更能夠很好地展示和提升平臺的公益形象,是一個有效且充分利用閒置資源的栗子。

(2)雖然兩者都是保護瀕危動物的公益界面,其實也能看出側重點稍微有些不同,淘寶更傾向於給用戶科普瀕危動物的相關知識和鼓勵用戶去舉報非法商品,而京東則更偏向於教育用戶拒絕非法商品和鼓勵用戶去傳播分享。

傳播公益知識固然重要,但筆者認為站在電商平臺的層面,淘寶的引導用戶舉報非法商品的設計更為合適,這是考慮到了電商平臺的核心屬性——商品買賣。

所謂“沒有買賣就沒有傷害”,作為商品買賣的大平臺,平臺的職責更多的是杜絕非法商品的售賣,而不僅僅在於讓用戶去分享這個信息內容。只有杜絕了非法商品的買賣,才能夠很好地從源頭需求上去減少這種非法買賣的現象,從而更好地實現作為電商平臺保護瀕危動物的職責。

所以,筆者覺得站在電商平臺的層面,淘寶的設計背後所蘊含的邏輯更符合電商平臺的屬性,也是能更好地從根本去解決非法商品買賣問題的有效方法。

盘点:3大主流电商平台那些亮眼的交互细节

四、雲集

1. 給予用戶可滑動距離的心理預期

這個小交互細節在筆者的上一篇文章也略微提到了,這裡單獨在交互細節的梳理裡面再詳細分析一下。

在雲集首頁,當下滑到特賣區時,用戶在觸碰屏幕往下滑動時,右下方會懸浮提示當前是第幾個商品及整個特賣商品列表一共有多少個(就是下圖的“7/98”),當用戶的手指離開屏幕時,該懸浮提示轉變為置頂懸浮按鈕。

(1)這個交互細節的設計能夠給到用戶對下拉滑動的最大距離的一個心理預期以及當前瀏覽是第幾個商品的提示。

因為這裡是一個有固定數值的商品列表(而非個性化推薦列表那樣是無限下拉更新的),用戶在滑動時通過這個懸浮提示就可以知道大概還有多長的滑動距離就到底了,而不是突然列表就結束或者不知道自己在瀏覽的位置是在列表的哪個位置。

(2)另外,這個交互細節也是對應到了平臺特賣區的宣傳核心。

因為特賣區是每日上新99個商品,其中一個是熱賣置頂商品,因此下方熱賣商品一共為98個,因此這個懸浮提示也無形中告訴了用戶98個商品上新是真實存在的,從而增加了平臺的可信度,也給用戶傳達了隱形的“安全感”

盘点:3大主流电商平台那些亮眼的交互细节

2. 始終保留置頂入口

導航欄中【首頁】icon會隨著頁面往下滑動而改變,當下劃超過一定距離時,首頁的icon自動從“房子形狀”轉變為“↑”,符號與交互與懸浮窗置頂的一致(同樣為“↑”,提示用戶該按鈕的功能與懸浮窗置頂的一致)。

(1)該功能設置的目的是,當用戶在熱賣欄中進入了二級類目,懸浮框不再顯示時,則【首頁】icon的轉換保留了置頂功能的入口,用戶依然可以通過單擊首頁icon返回頁面頂部,方便了用戶的操作,極大提升了用戶的使用體驗。

(2)這個交互細節的設置是緊緊圍繞著用戶的使用習慣來設計的,因為無論是首頁的熱賣商品區還是二級類目的商品列表,都相對是比較長的,因此返回頂部的這個操作的使用頻次相對比較高,如果缺失了這個功能入口可能極大地損害了用戶的使用體驗。

其他主流平臺如淘寶,也有類似的設置,只是交互設計不一樣,淘寶是單擊頂部區域(接近頁面標題的位置,熱區較窄)可返回頂部。

個人認為雲集的設計會相對優勝些,因為icon的變化是用戶稍加觀察是可以感知的,但淘寶的設計相對更加隱蔽,如果不是無意中發現這個熱區操作可能都不知道會觸發返回頂部的交互,而且熱區的範圍較窄,容易誤操作到別的區域。

盘点:3大主流电商平台那些亮眼的交互细节

3. 推薦缺貨商品的相似商品,緊抓購買需求

點擊熱賣區中顯示“搶光了”的商品,跳轉至詳情頁前會出現缺貨浮窗,浮窗除了可以設置補貨提醒之外,還增加了缺貨商品的相似商品推薦區,滑動展示10個相似商品。

(1)這裡設置的相似商品推薦區是從用戶實際購買需求出發考慮的,因為用戶在首頁已看到缺貨的狀態仍點擊進入詳情頁,說明用戶的購買需求很強烈,而推薦相似好貨會有很大可能性刺激該用戶購買,帶動轉化率。

(2)這個設計可以看出來平臺不想放過任何一個可以促成轉化的機會,只要洞察到用戶有購買需求,就不放過這一個空隙,站在電商平臺的角度,這個設計是很符合電商中“促成用戶購買決策”的這一核心的。

盘点:3大主流电商平台那些亮眼的交互细节

以上就是筆者近段時間觀察並收集的電商平臺最近更新的新交互細節和新功能,也結合個人的思考對這些新細節新功能進行一個較為深入的分析。

在這“觀察→收集→思考分析設計邏輯→內容梳理輸出”整個過程中感受最深的是,當不經意發現了平臺中別出心裁的交互細節設計,然後去思考“為什麼”,經過思考之後得出相對合理的解釋的那個瞬間,有種和設計該功能細節的PM“心靈互通”的感覺——“Oh, I got you!”,也深深感受到了設計人考慮的細心周全和思維邏輯的緊密。

筆者會繼續更廣泛去留心和捕捉這些交互細節,希望以上內容能夠拋磚引玉,也歡迎大家將自己觀察到的交互細節分享出來,引發更多的討論和思考。

本文由 @修煉中的小vc 原創發佈於人人都是產品經理,未經作者許可,禁止轉載。

題圖來自Unsplash,基於CC0協議。


分享到:


相關文章: