重整付款頁面排版，跳出率下降 59%，轉換率提升 8.16%
我的角色
Product Designer
團隊
1 PM · 2 RD · 1 MKT
- 專案背景
- GoFreight Pay 是給貨運業者使用的 B2B 線上收付款平台。主要頁面是付款方第一個進到的頁面，但只有 20% 的人會往下走。
- 做法
- 通過團隊內部集思廣益假設使用者不往下走不是因為頁面太難，是還不認識 GoFreight Pay。所以把主頁重新排過，讓使用者認識平台後再接著付款。
- 結果
- 跳出率 62.5% → 3.47%、轉換率 18.99% → 27.15%
- 觀察期間
- 2022 年 8–11 月，對照改版前同月份
−59%
跳出率
+8.16%
轉換率
4 個月
觀察期間
專案背景
GoFreight Pay 是一個線上付款平台，Payee 透過表單、信件或連結向 Payer 請款。Payer 點擊連結進入主頁後可以開始執行付款，詳細流程如下。
第 1 步
Step 1. 選擇付款方式
第 2 步
Step 2. 輸入付款資訊
第 3 步
Step 3. 確認資訊並付款
例行數據回顧我們發現數據看出，點進主要頁面的使用者只有 20% 願意往下一步走，其中真正完成操作的不到一半。這個流失直接影響到後續完成付款的人數。所以開啟這個專案，目標就是利用設計迭代提升主頁的轉換率。
設計規劃
工作坊，集思廣益
[ 問題 ] 如何讓更多人完成交易？
[ 首要目標 ] 提升轉換率、減少跳出率
以舊版畫面為基礎，我們以付款方的角度做出了初步假設。
針對資源和時程考量，我們選擇以下項目作為本次迭代的主要調整方向：
- 簡化主頁 CTA，以減少使用者的選擇困擾。
- 增加付款方式、安全性提示等資訊，以減少使用者的不信任感。
- 加入付款流程動畫，簡單告知接下來的流程以減少不確定感。
頁面設計迭代
在與 PM 及其他設計師討論過後，最後選擇了左右切割的排版設計。清楚劃分介紹與操作這兩者，這樣的排版讓增加資訊後的主頁維持簡潔的樣式，不影響付款體驗。
新舊比較
結果
對照改版前同月份，取 2022 年 8–11 月的數據：
1. 跳出率：62.5% → 3.47%
改版前
62.5%
8 月，baseline
改版後
3.47%
11 月，上線後
跳出率下降 59.03%。
2. 轉換率：18.99% → 27.15%
改版前
18.99%
8 月，baseline
改版後
27.15%
11 月，上線後
轉換率提升 8.16%。
下一步
主頁改版後轉換率雖有改善但也不如預期顯著，付款也可能會有淡季旺季問題，除了觀測數據時間可以再拉長之外，採取以下方式驗證：
- 為了解使用者不進行下一步的原因，在網站中加入簡易彈出問卷調查。
- 尋找符合 Payer 身份的受訪者著手驗證在兩種介面的感受上是否有差異、差在哪、是否影響對平台的決策。
另外單個 Payer 使用大額付款的頻率增加，會不會也是印證 Payer 對平台的信任度提升，也是個值得觀察的議題。