電子商務B2C網站使用者購物付款流程設計

1. 不要讓使用者先註冊再去選商品。

顧客們是來買東西的，不是來填表單的。所以需要確保使用者在付款過程中完成了註冊，而不是付款前就去註冊，也不是讓使用者把商品放到購物車裡之前去註冊。註冊表單的需要使用者花功夫去填，註冊過程中還可能有問題，所以這會成為使用者順利完成購物的障礙。

Taget這個網站就是當使用者真正要把錢付了的時候，才讓他去註冊的。

在購物流程中，把註冊這個麻煩往後面移，能使最後購買商品的使用者大大增加。使用者既然一開始就花了很多時間選購他們想買的東西，那如果在付款的時候因為註冊麻煩而離開，前面選購商品花的時間久白費了。但如果使用者還沒開始選商品酒讓他去註冊，這時，他們還沒花時間成本，就更容易選擇離開。

2 如果這個商品有貨，明確地告訴使用者

對商品有的庫存數量需要明確地告訴使用者。如果商品沒貨了，要早些讓使用者知道，避免使用者購買時往後操作了好幾步才發現原來商品沒貨了。不僅要在商品介紹頁面顯示庫存數量，在使用者搜尋商品的結果頁面也要顯示出來。

Overclockers 在商品列表中，就列出了詳細的庫存數量資訊。

另外，如果某個商品現在缺貨，但最近就會進貨了，可以提供給使用者一個預定的功能，這樣不急著買這個商品的使用者，過幾天來就可以買到了，他也不用擔心過一陣子來買時，商品又售空了。

3. 讓使用者很方便地修改訂單

每個人都可能出錯，使用者有可能在購物車裡放錯了商品，或者要付款的時候改變主意了。這時，要讓使用者在付款的過程中能修改他們購買的商品，如果不能修改他們可能就離開了，而能修改的話，就贏得了許多潛在使用者。

IconDock 就讓使用者通過輸入框中的數字，很方便地修改購買的數量。

如果使用者想把商品從購物車中刪掉，不要讓他們在輸入框中輸“0”這個數字來刪掉。還是提供“刪除”這個連結比較好，通過點“刪除”，可以讓他們把商品從購物車中刪掉，這樣修改既快又簡單。

4. 在使用者操作過程中，提供給他們即時的協助

因為付款過程需要使用者輸入資訊，而使用者很可能在這個過程中碰到問題，這些問題不一定能靠有限的幾個介面來解決。這種情況下，提供給使用者專業的，一對一得協助，要比給他們一個寬泛的協助（比如“常見問題”的頁面）好很多，類似“常見問題”的頁面不一定能解決使用者碰到的問題。

在“戴爾”的購物網站上，使用者就可以通過諮詢電話和線上客服獲得協助。如果使用者在付款過程中碰到了問題，她可以立刻諮詢客服獲得協助，問題幾分鐘內就輕鬆解決了。

在使用者付款過程中，提供線上客服或電話諮詢的協助是個非常好的主意。不過不是所有公司都能負擔得起那麼多客服成本的，大中型公司可以考慮這個方法，特別是那些網上付款流程比較複雜的公司。

5. 使“返回”按鈕充分起到作用

“返回”按鈕是網頁瀏覽器中最常用的按鈕之一，所以許多使用者可能在付款過程中也會經常用到。一些網站不提供返回上一頁的功能，當使用者點“返回”時，頁面會自動重新指向某個頁面或是報錯，這樣會對使用者的體驗造成負面影響。

Ticketmaster 中，點“返回”按鈕出現這樣的報錯，就會讓使用者有受挫感。

當使用者點“返回”按鈕時，不僅不能老讓他們碰到出錯提示，而且如果前一頁是表單的話，要儲存他們之前填的資料並再次顯示給他們看。這樣使用者只需要在原來填的內容上做修改，而無需重新填寫整個表單。的確，有些情況下，使用者點“返回”已經為時已晚，比如他點了“確定支付”的按鈕。不過別的一些頁面都能支援“返回”按鈕的話，既節省了使用者時間又減少了他們的挫敗感。

6.在購物籃中供應商品的照片，說明，連結

    使用者經常會把商品放進購物籃後，付款前再核對一下購買的商品，看看他們是否確定要買這些。商品如果只有標題，他們就無法再快速地瀏覽核對一遍。所以，最好加上圖片，商品說明—比如大小，顏色，精裝書還是平裝書，等等。

亞馬遜網站，說明了商品的顏色和詳細情況，比如精裝書/平裝書，還提供連結返回查看原商品詳細資料。不過他沒有供應商品的縮圖。

Oxfam 提供了每件商品的縮圖，讓使用者能快速探索。另外，如果使用者想確認這個商品是否確實是自己想買的，還可以通過連結返回原商品介紹頁面。

7. 提供操作流程的指引

付款通常是一個包括多步操作的流程。這意味著使用者完成支付前會經過好幾個頁面。所以最好加一個操作流程指引，告訴使用者他們現在的位置，即他們目前走到付款流程的哪一步，哪個頁面上了，以及離完成過程還有哪幾步。

蘋果網站在所有付款頁面上，都放了一個簡潔的流程指引。

讓使用者知道自己在流程中的哪個位置，會給他們一種控制感，從可用性角度來說，這是很有必要的。當然，讓使用者知道後面還有哪幾步操作，就可以完成了也會減少他們的疑惑。這樣他們在完成付款前，根據自己的情況和想法，來調整或取消訂單的自由度更大。

8.付款介面保持簡潔

付款過程和網站上瀏覽型的網頁不同。在付款過程中，使用者並沒有在購物。這意味著所有的瀏覽型操作在這裡都是多餘的，這隻會分散使用者的注意力，影響他正在完成的任務。設計時，要把那些不需要的元素去掉—比如，商品目錄連結，熱銷商品推薦等，使介面保持簡潔。

戴爾網站的付款頁面，就沒有商品的目錄連結，而是讓使用者把所有注意力放在付款流程上。

有時使用者會返回，再買一些商品，再來付款，所以需要提供一個“返回繼續購物”的連結。另外，要確保所有指向“下一步”的按鈕都大一些，避免使用者找不到。

9.不要讓使用者離開付款流程

使用者在付款過程中不要被打斷很重要，比如，把使用者引到一個和付款不相關的頁面。把使用者帶離開付款流程會有以下兩個問題：1）他們會搞不清自己究竟在哪裡，甚至有可能付款的頁面找不到了 2）他們可能會因為被打斷而沒有成功完成整個付款流程。

Laskys 網站的付款頁面上，當滑鼠移至上方在某些元素上，會有協助資訊彈出告訴使用者相關的功能說明。

不能打斷使用者付款流程，那麼我們要找到一個方法顯示不要的資訊。如果需要提供一些協助資訊，而這些資訊又不適合在當前頁面上顯示，可以考慮通過浮動視窗或快顯視窗顯示。

10. 告知使用者商品配送時間

線上購物比起實體店購物，有個較大的弊端：使用者需要等待幾天才能收到購買的商品。所以當使用者購買成功後，需要告訴他們大致需要等待的時間。

蘋果網站會根據不同使用者的訂單顯示相應的送貨時間。

告知使用者商品配送時間有以下幾個原因：首先，使用者要確保快遞公司送貨上門時，家中有人收快遞。其次，這樣使用者會對貨什麼時候到有個心理預期，而不用老擔心買的東西怎麼還沒送到。送貨時間顯示得越早越好，最好在商品介紹的頁面上就顯示。這樣的話，想購買該商品的使用者，就能根據商品送到時間是否能滿足需求，來決定他們是否購買。

11. 告訴使用者之後會發生什麼

當使用者完成了商品購買，並點擊了最後一步操作的按鈕後，接著會出現什嗎？以“感謝您購買本商品”為結束語。這對使用者來說，是一種禮貌的表示，而使用者也一定很樂意接受這些體貼的話。

亞馬遜網站，在使用者付款完成時，就會顯示：感謝您購買了此商品，並且告訴使用者接下去可以做些什麼。

另外，還要告訴使用者接著還會發生什麼——比如，當商品發貨時，他們會收到一封郵件通知。這會消除使用者對訂單是否真正成功購買的不確定，他們安心。

12 發一封確認郵件

使用者可能完成了商品訂購併付款了，但其實還沒結束。網站需要發一封確認郵件，告知使用者購買商品的詳細資料和送貨到達的時間。這個資訊還是很有協助的，因為這讓使用者再次確定他們沒買錯商品，比較安心。

亞馬遜網站會在使用者付款後，發送關於購買的商品詳細資料的郵件，並告訴使用者如果買錯，如何在商品發貨前修改。

如果使用者買錯了商品，在商品發貨前，需要提供給他們重新登陸並返回修改訂單的機會。簡單的出錯，比如選擇錯了尺寸，顏色，經常會發生，所以網站需要讓使用者感覺線上上購物既簡單又可靠。