編輯導(dǎo)讀：在產(chǎn)品的迭代升級過程中，改版設(shè)計是常常會遇到的問題，而商業(yè)產(chǎn)品的購買頁則是其中的重中之重。文章對58APP商業(yè)產(chǎn)品購買頁的升級改版進行了詳細的梳理，對遇到的一些問題進行了分析總結(jié)，供大家參考學(xué)習(xí)。

01 設(shè)計背景商業(yè)推廣在58業(yè)務(wù)方面承接著很大的流量，也承載著較高的業(yè)務(wù)收入。

但由于商業(yè)產(chǎn)品購買頁改版面向的用戶群體不僅僅是用戶更是58的客戶，與收入掛鉤的改動往往牽一發(fā)而動全身。所以在改版優(yōu)化開始前我們首先拆解了收入數(shù)據(jù)的公式與收入路徑的對應(yīng)關(guān)系，購買前的入口的UV提升由業(yè)務(wù)方負責(zé)，我們主要優(yōu)化的是「購買轉(zhuǎn)化率」&「復(fù)購率」的提升。

在「購買中」的節(jié)點上，我們推動了「購買頁」的改版，以提升購買轉(zhuǎn)化率。在「購買后」，復(fù)購率提升上在未來我們也準備做一些小小的推動和嘗試。

由于追溯至上次商業(yè)購買頁的改版還在3年前，導(dǎo)致整體頁面稍顯老舊，與58App整體改版后的主視覺格格不入，缺乏品質(zhì)感。再細看流程層級、信息架構(gòu)以及細節(jié)體驗上也存在一些問題。

基于購買頁面收入高，體量大的商業(yè)特性。我們首先意識到：貿(mào)然打破客戶原有的操作習(xí)慣，做過多的創(chuàng)新改革，只會徒增客戶的學(xué)習(xí)成本。所以如何在不破壞客戶對頁面原有認知的基礎(chǔ)上，在細微處提升客戶購買體驗，從而提升商業(yè)收入是我們本次改版的要點。

02 改版思路在改版之前，我們以用戶訪談的形式去挖掘了客戶對于購買產(chǎn)品流程中遇到的痛點，最后發(fā)現(xiàn)80%以上的非會員客戶的問題都可以歸為以下3個點：

這3個問題看似簡單，卻是決定了客戶是否順利下單的關(guān)鍵。在訪談中我們察覺當客戶出現(xiàn)“覺得購買不順暢”、“看不懂怎么用”、“覺得不值那么多錢”等傾向的想法時基本上都最終會選擇終止購買。

由此本次改版優(yōu)化從以上3個問題切入。

1. 如何讓客戶更順暢的下單讓流程符合行為模型：當我們梳理了客戶購買流程發(fā)現(xiàn)，現(xiàn)有頁面的購買流程與客戶的行為模型是不相符的?？蛻舻男袨槟Ｐ蛻?yīng)該是：

「了解效果」-「信息確認」-「選擇套餐」-「優(yōu)惠確認」-「費用明細」-「勾選協(xié)議」-「最終付款」。但是現(xiàn)有流程并非如此，所以我們補全了缺失的「了解效果」部分。

功能調(diào)整加減法：同時調(diào)整了優(yōu)惠信息的展示方式，將「優(yōu)惠劵」+「費用明細」 整合至「折扣明細」，同時將賬戶明細細化，讓客戶付費安心，不必返回前頁核對余額。

以「功能調(diào)整加減法」的形式讓客戶更加清晰的知道自己的優(yōu)惠明細，從而讓客戶購買流程更加順暢。

2. 如何讓客戶看得懂新老客差異展示：調(diào)查發(fā)現(xiàn)，現(xiàn)如今多數(shù)互聯(lián)網(wǎng)的商業(yè)產(chǎn)品購買頁其實往往不但要承接購買支付的功能，同時也承載著讓用戶了解「產(chǎn)品是什么」的責(zé)任。

58的商業(yè)產(chǎn)品也不例外，但由于改版前頁面與前置頁面并無產(chǎn)品介紹的模塊，新客進入后很大程度上完全不了解產(chǎn)品玩法與規(guī)則，而老客雖有過購買行為，但對效果的感知也存在一知半解的情況。

所以本次改版我們新增了產(chǎn)品介紹模塊，同時對新老客做了區(qū)別展示。對新客放大展示，文字與示意圖的結(jié)合讓效果更加直觀。而老客則收起圖片集中展示，這樣既不會打破原有信息架構(gòu)，又能讓二者都對使用規(guī)則和效果能有足夠的清晰了解。

3. 如何讓客戶覺得買的很值得調(diào)研中我們發(fā)現(xiàn)很多客戶在初次購買過程中，由于購買前是感知不到使用效果的，滿眼高昂價格的套餐讓他們不免心有疑惑，“這么貴的東西到底值不值？”

購買頁應(yīng)該承擔(dān)起告知客戶“值得”的責(zé)任。那么該如何讓客戶感知到“值得”并提升信任感呢？

真實的購買評價+滾動氣泡提示：首先在產(chǎn)品介紹頁的彈窗中， 我們嘗試著引入「購買評價」去分享更多類似“買家秀”的評論。真實的評價會讓客戶增加對產(chǎn)品的信任，也會觸發(fā)客戶“我收獲的會比付出的更多”的感受。

與此同時我們還增加了氣泡提示的效果，滾動的氣泡動效可以給客戶心理暗示即“大家都在購買的產(chǎn)品的確是值得購買的好產(chǎn)品” ，利用從眾心理去刺激客戶下單。

橫縱展示AB測試：在套餐選擇方面，我們進行了一個小小的AB測試，探索套餐橫縱展示方式對客戶價格感知的影響。

市面上以這兩種展示形式有很多，為了探究商業(yè)產(chǎn)品購買套餐展示形式對于客戶的感知所造成的差異，我們在同期進行了橫縱兩種展示方式的對比。在測試前期，二者差距并不明顯，但在持續(xù)跟蹤對比數(shù)據(jù)5周后，我們發(fā)現(xiàn)無論從點擊率還是轉(zhuǎn)化率上豎版效果明顯要優(yōu)于橫版，并最終選擇全線推全豎版。

通過這種小小的策略改進，我們了解客戶在不同展示形式下對價值感知的差異，并調(diào)整策略，同時利用真實評價和氣泡提示此類心理策略給客戶以信任感，讓客戶覺得買的值得。

03 設(shè)計驗證改版后的購買頁面視覺上更具品質(zhì)感，購買流程更加符合客戶的行為模型，產(chǎn)品效果與使用規(guī)則更加清晰地展示。上線后我們持續(xù)跟蹤的數(shù)據(jù)效果，在訂單均金額，收入貢獻均有明顯增長。

另外除跟蹤數(shù)據(jù)外，我們對上線之后的滿意度也做了調(diào)研跟蹤。我們分別從支付方式滿意度，展示滿意度，套餐展示滿意度入手發(fā)放問卷調(diào)研，經(jīng)過清洗未完成和重復(fù)填寫的部分，實際回收了了四千余份用戶的反饋結(jié)果：三項滿意度均有提升。

以上結(jié)論均可驗證讓用戶「買的更順暢」、「買的更明白」、「買的更值得」的商業(yè)產(chǎn)品優(yōu)化思路是有效的，所以我們將該思路進行了復(fù)用在「刷新簡歷」，「黃金展位」和「優(yōu)選投遞」等商業(yè)產(chǎn)品購買頁的優(yōu)化改版上，也同樣取得了反響不錯的成果。

04 總結(jié)規(guī)劃購買頁優(yōu)化只是中臺商業(yè)小小的一步，但是推動整個58招聘與黃頁業(yè)務(wù)更好的商業(yè)購買體驗是我們未來要跨出的一大步。

在完成購買中的購買轉(zhuǎn)化率提升后，我們將目光放在了在購買完成后提升復(fù)購率上，搭建了數(shù)據(jù)效果展示中心，讓客戶對購買效果的感知可視化，亦可有針對性的對投放貼進行管理與配置。未來我們也會持續(xù)針對客戶在「購買中」「購買后」流程中所對應(yīng)的關(guān)鍵節(jié)點進行優(yōu)化，持續(xù)優(yōu)化和完善功能，為客戶更好的服務(wù)及體驗。

作者：文雅，交互設(shè)計師

本文來源于人人都是產(chǎn)品經(jīng)理合作媒體@58用戶體驗設(shè)計中心（微信公眾號@58UXD），作者@文雅

題圖來自Unsplash，基于CC0協(xié)議