從文字標(biāo)題上來看，作者原本的意圖是介紹一個(gè)通過A/B測試來提高產(chǎn)品性能的案例（溫哥華冬奧會(huì)官方特許商品購買網(wǎng)站），但大家實(shí)際留下的評(píng)論以及關(guān)注重點(diǎn)都被集中在這個(gè)具體的Checkout設(shè)計(jì)的交互細(xì)節(jié)上。當(dāng)然我也被這個(gè)我認(rèn)為有些優(yōu)雅的設(shè)計(jì)所吸引，因此簡單翻譯并整理一下原文和原文評(píng)論。好了，言歸正傳。

什么是Checkout？就我個(gè)人的理解來說就是挑選商品結(jié)束后進(jìn)入結(jié)帳的流程。從決定開始結(jié)帳到輸入聯(lián)系信息、支付選擇到最后的支付成功，整個(gè)過程就叫Checkout。在改版前，她們?cè)瓉淼腃heckou流程是這樣的：

原Checkout的sign in

control

可以發(fā)現(xiàn)原 Checkout流程分成：Sign in、Shipping、Billing & Review、Receipt，也就是說從點(diǎn)Checkout按鈕到最后結(jié)帳成功需要走四步。

經(jīng)過重新設(shè)計(jì)后，新的流程變成了一步（見下圖）。怎么做到的呢？

首先，取消了Checkout前的強(qiáng)制Sign in（只保留Returning Customer Sign in以便于直接獲得Shipping和Delivery option等信息）。其次，將Shipping和Billing信息進(jìn)行整合，以簡單扁平的方式形成一個(gè)較長的表單供用戶填寫并確認(rèn)。頁面右側(cè)是訂單詳細(xì)信息。點(diǎn)擊Place Order后Checkout完成后，提示用戶可以新注冊(cè)帳號(hào)（Create Account）以便跟蹤具體的訂單情況。

另外一個(gè)我個(gè)人認(rèn)為不錯(cuò)的交互是右側(cè)的Order Summary展示。由于合并后的頁面較長，因此她們把Order Summary做成能隨著頁面上下浮動(dòng)，這讓用戶始終能看到訂單的詳情。

從最后的數(shù)據(jù)上來看，新設(shè)計(jì)相比老設(shè)計(jì)：

• 購買完成率上升了257.26%
• 平均訂單額上升了8.54%（這個(gè)數(shù)值的上升作者自稱始料未及，也不知道具體原因）
• Overall site conversion rate上升了0.54%（這個(gè)數(shù)值作者沒有很好的解釋清楚，評(píng)論下方也有人在問）

新的Checkout設(shè)計(jì)

Checkout成功后，提示注冊(cè)

為什么她們會(huì)這么設(shè)計(jì)，要知道連Amazon也是4步checkout的，她們是怎么考慮的？思考過程作者在原文中沒有透露，但從下方的激 烈的評(píng)論和作者的回應(yīng)中我們可以基本找到答案。

首先，這個(gè) store的目的是銷售特許商品。因此通過簡化產(chǎn)品設(shè)計(jì)和降低門檻來提高購物的轉(zhuǎn)化率是她們的核心KPI，拋開運(yùn)營的壓力（主要是不注冊(cè)可Checkout不利于二次購物和商品推薦），她們的設(shè)計(jì)出發(fā)點(diǎn)就是盡可能多的幫助用戶完成訂單。多余的Checkout流程會(huì)給用戶機(jī)會(huì)來改變他們的選擇。（評(píng)論中一哥們提到他做過相似的實(shí)驗(yàn)，多一個(gè)頁面轉(zhuǎn)化率就有少20%。）其次，由于她們銷售的屬于利基（niche）商品，因此Checkout步驟少或多并不影響實(shí)際的轉(zhuǎn)化率。因?yàn)橛脩糁荒茉谶@里購買，沒有其他選擇，這以因素也可以認(rèn)為是之前提到的第二個(gè)指標(biāo)并未提高很多的原因。最后，另外一個(gè)老兄發(fā)現(xiàn)他們只提供VISA支付，作者解釋到這是因?yàn)閂ISA是奧運(yùn)特許合作伙伴，而這一 客觀因素也幫助她們能在設(shè)計(jì)上少費(fèi)些周折。如果必須有多種支付方式選擇，那么真的把所有的支付方式結(jié)合其他信息放在一個(gè)頁面上，我想她們也會(huì)有思想斗爭的壓力的：）

題外話，有朋友會(huì)認(rèn)為她們的表單設(shè)計(jì)也并非完美，比如在實(shí)時(shí)數(shù)據(jù)驗(yàn)證、錯(cuò)誤提示、表單字段的提示上等等也有可改進(jìn)的地方。但我們應(yīng)該認(rèn)識(shí)到完美又優(yōu)雅的設(shè)計(jì)往往可遇而不可求，最合適的設(shè)計(jì)才是我們應(yīng)該努力去實(shí)現(xiàn)的。我想至少在這個(gè)具體問題上，這個(gè)例子給了我們一個(gè)榜樣。

最后總結(jié)一下，本例告訴我們?cè)诳赡艿那闆r下，把多頁面表單適時(shí)地整合成不太復(fù)雜的單頁面表單也是一種提高轉(zhuǎn)化率的方法。這也是一種明明白白告訴用戶你有多少表單信息需要填寫的直白方式，但這么做的前提是必須很好地認(rèn)識(shí)用戶的行為以及行為背后潛在的需求，切不可為了KPI而不顧一切。

原文評(píng)論中其他有價(jià)值的問題：

• 如果把訂單額從現(xiàn)在的$45.60變成$456，是否實(shí)驗(yàn)的結(jié)果依然是如此？
• Checkout結(jié)束后的注冊(cè)有多少效果？
• A/B測試的注意事項(xiàng)：何時(shí)開始、何時(shí)結(jié)束？

真正的最后，有問題的朋友歡迎各位看了原文后和我討論。

本文的圖片和主要觀點(diǎn)來自：A/B Test Case Study:Single Page vs. Multi-Step

作者是Linda Bustos、Janis Lanka，她們都來自Elastic Path Software

來源：http://gengrenjie.com/