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

01?設計背景

商業(yè)推廣在58業(yè)務方面承接著很大的流量，也承載著較高的業(yè)務收入。

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

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

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

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

02?改版思路

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

1. 我買的不順暢；
2. 我看不懂怎么用；
3. 我覺得買的不值。

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

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

1. 如何讓客戶更順暢的下單

讓流程符合行為模型：當我們梳理了客戶購買流程發(fā)現，現有頁面的購買流程與客戶的行為模型是不相符的?？蛻舻男袨槟Ｐ蛻撌牵?/p>

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

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

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

2. 如何讓客戶看得懂

新老客差異展示：調查發(fā)現，現如今多數互聯網的商業(yè)產品購買頁其實往往不但要承接購買支付的功能，同時也承載著讓用戶了解「產品是什么」的責任。

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

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

3. 如何讓客戶覺得買的很值得

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

購買頁應該承擔起告知客戶“值得”的責任。那么該如何讓客戶感知到“值得”并提升信任感呢？

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

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

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

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

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

03?設計驗證

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

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

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

04?總結規(guī)劃

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

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

作者：文雅，交互設計師

本文來源于人人都是產品經理合作媒體@58用戶體驗設計中心（微信公眾號@58UXD），作者@文雅

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