電商系統(tǒng):下單功能如何設(shè)計?拆解出來講給你聽

2 評論 1331 瀏覽 0 收藏 12 分鐘

本文主要和大家聊一聊有關(guān)前臺商城下單的一些設(shè)計思路與方法,旨在對以往的經(jīng)歷進行一些沉淀與總結(jié),也希望能夠與大家共同探討,一起成長進步。文章從訂單確認和訂單支付兩個方面說明商城下單的功能設(shè)計。

本文目錄:

一、訂單確認

用戶通過商品詳情頁或購物車頁面,進行商品下單。下單環(huán)節(jié)的第一個頁面為訂單確認頁,主要用于用戶確認訂單的商品信息與金額信息,并對訂單進行一些信息補充或設(shè)置操作。

我們從信息展示以及功能操作兩個方面聊一聊訂單確認頁面的設(shè)計。信息展示包含商品信息和金額信息。功能操作包含添加地址(含收貨地址和代發(fā)地址)、添加發(fā)票、編輯留言、使用優(yōu)惠信息(含優(yōu)惠券和積分抵扣)。

電商Axure原型設(shè)計演示地址:https://pu6jwl.axshare.com

1.1 商品信息與金額信息

商品信息包含:圖片、標題、規(guī)格、價格、數(shù)量,如果是平臺型商城,還會展示商家店鋪名稱。金額信息一般包含商品金額、運費金額、優(yōu)惠金額、積分抵扣金額、活動減免金額、應(yīng)付金額。金額信息的顯示應(yīng)注意統(tǒng)一規(guī)范,如統(tǒng)一顯示小數(shù)點后兩位。

金額信息的顯示,在垂直方向上應(yīng)保持右對齊。方便用戶能夠從視覺上直觀的對比金額。

1.2 地址信息

用戶需要為訂單選擇收貨地址,為了減少用戶的操作,系統(tǒng)按以下規(guī)則為用戶推薦地址。

  • 若用戶設(shè)置了默認收貨地址,則系統(tǒng)將自動選擇默認收貨地址。
  • 若用戶未設(shè)置默認收貨地址,則系統(tǒng)自動選擇上一單收貨地址。
  • 若用戶在系統(tǒng)內(nèi)首次下單,且未設(shè)置默認地址,則系統(tǒng)不予選擇,需要用戶手動選擇。
  • 若用戶只有一個收貨地址,則無需用戶進行選擇,系統(tǒng)直接讀取收貨地址。

下單頁面支持修改原地址、支持添加新地址。收貨地址顯示的信息包含:收貨人姓名、聯(lián)系電話和地址信息。出于隱私安全考慮,可以將電話號碼進行脫敏顯示,隱藏中間的四位數(shù)字。

對于B2B商城來說,客戶常常會有訂單代發(fā)的需求,所以需要為客戶提供代發(fā)服務(wù)。

客戶在下單頁面需要添加代發(fā)地址,代發(fā)地址的功能設(shè)計與收獲地址基本相同,規(guī)則如下:

  1. 若客戶設(shè)置了默認發(fā)貨地址,則系統(tǒng)將自動選擇默認發(fā)貨地址。
  2. 若客戶未設(shè)置默認發(fā)貨地址,則系統(tǒng)自動選擇上一單發(fā)貨地址。
  3. 若客戶首次下單,且未設(shè)置默認發(fā)貨地址,則系統(tǒng)不予選擇,需要用戶手動選擇。
  4. 若用戶只有一個地址信息,則無需用戶選擇,直接讀取地址信息。

下單頁面同樣支持修改發(fā)貨地址、添加發(fā)貨地址。代發(fā)地址顯示的信息包含:代發(fā)人姓名、電話和地址。處于隱私安全考慮,可以將電話號碼進行脫敏顯示,隱藏中間的四位數(shù)字。

1.3 發(fā)票

自營商城或部分B2C類型的商城,通常還會給用戶提供發(fā)票服務(wù),因此下單頁面允許添加開票信息。出于成本考慮,系統(tǒng)默認不提供發(fā)票,用戶可以根據(jù)自己的實際需要選擇開具發(fā)票,發(fā)票通常會和訂單貨物一起快遞給用戶。發(fā)票的信息通常包含發(fā)票抬頭名稱,如果是企業(yè)發(fā)票還應(yīng)顯示稅號。

發(fā)票信息的管理通常在發(fā)票頁面進行添加、編輯和刪除,如果用戶未添加發(fā)票信息,下單頁面需要支持用戶添加發(fā)票。若用戶已添加過發(fā)票信息,則下單頁面不支持對發(fā)票信息進行編輯和刪除,只能選擇發(fā)票。

1.4 留言

用戶下單時,通常會有一些關(guān)于包裝或發(fā)貨的事情需要提醒商家,因此在下單頁面為客戶提供了留言功能。留言的文字內(nèi)容系統(tǒng)可以根據(jù)自己的需要,限制文字內(nèi)容的長度,一般控制50字以內(nèi)。

1.5 優(yōu)惠信息

01 優(yōu)惠券

平臺或商家通常為了刺激用戶下單,通常會提供各類優(yōu)惠券。根據(jù)發(fā)放的主體不同,可分為平臺券和店鋪券。根據(jù)適用范圍不同,可以分為平臺通用券、店鋪通用券、平臺品類券、店鋪品類券或指定單品券。根據(jù)優(yōu)惠方式的不同,可以分為滿減券、折扣券和現(xiàn)金券。

當有多張優(yōu)惠券時,系統(tǒng)會根據(jù)算法為用戶推薦減免金額最大的一張券,以達到充分讓利給用戶的目的。

各類情況的推薦策略如下:

  • 有多張不同額度的優(yōu)惠券,推薦減免金額最大的優(yōu)惠券。
  • 若減免金額相同,則優(yōu)先推薦過期時間最早的優(yōu)惠券券。
  • 若減免金額與過期時間都相同,則按照券類型的不同進行分別推薦,推薦順序依次為:店鋪單品券>店鋪品類券>平臺品類券>店鋪通用券>平臺通用券。

訂單只能使用一張商品優(yōu)惠券,如果用戶對系統(tǒng)推薦的優(yōu)惠券不滿意,也可以自行選擇其它優(yōu)惠券或不使用優(yōu)惠券。在下單頁面供用戶選擇的優(yōu)惠券,系統(tǒng)需要經(jīng)過基礎(chǔ)的規(guī)則過濾,如根據(jù)商品(僅展示適用訂單商品的券)、訂單金額(展示符合消費門檻的券)以及優(yōu)惠券的使用狀態(tài)(僅展示未使用的券)進行過濾。當使用現(xiàn)金券時,建議系統(tǒng)限制現(xiàn)金券的金額不能大于訂單金額,以防止免單的情況發(fā)生。

02 運費券

運費券是一種特殊類型的優(yōu)惠券,只能用于抵扣運費金額。當有多張額度不同的運費券時,系統(tǒng)優(yōu)先推薦減免額度最大的運費券;當有多張額度相同的運費券,則系統(tǒng)推薦過期時間最早的運費券。與商品優(yōu)惠券的使用相同,用戶也可以根據(jù)自己的需要手動選擇不同的運費券或不使用運費券。

03 積分抵扣

部分商城會有自己的積分體系,積分可用于在下單時抵扣訂單金額。通常每個商城都會有自己的一套抵扣規(guī)則,至少需要系統(tǒng)設(shè)置抵扣額度,一般按照訂單金額的百分比進行抵扣或固定抵扣金額。

對于何種類型的訂單能夠使用積分抵扣,也具有一定的規(guī)則。

抵扣的訂單限制要求與優(yōu)惠券類似,商城可根據(jù)自己的需要針對某類商品的訂單或訂單金額滿足一定的門檻才可以使用。積分由商城統(tǒng)一發(fā)放與管控,積分的使用范圍一般與店鋪無關(guān)。

部分商城支持貨到付款,如京東商城以及一些2B類的垂直行業(yè)。系統(tǒng)默認為用戶推薦使用在線支付。

上述信息確認無誤后,提交訂單,系統(tǒng)生成訂單。

二、訂單支付

提交訂單后,進入支付環(huán)節(jié)。訂單按照支付類型不同可以分為全款支付、定金支付或預付款支付、尾款支付。定金與尾款適用于預售商品、眾籌類商品的訂單。

2.1 支付方式

目前國內(nèi)的支付生態(tài)豐富,根據(jù)支付主體的不同可以歸結(jié)為銀行支付、互聯(lián)網(wǎng)第三方支付、終端廠商支付。銀行支付一般為銀聯(lián),由銀聯(lián)對接各銀行?;ヂ?lián)網(wǎng)支付最常見的主要為微信支付、支付寶支付、翼支付等。終端廠商支付為各類移動設(shè)備廠商在手機終端中預裝的支付錢包,如Apple Pay、華為支付、小米支付等。商城根據(jù)自己的實際需要與資源情況,尋找各支付廠商進行技術(shù)對接即可使用。各支付廠商,一般會根據(jù)每筆訂單收取一定的手續(xù)費。

2.2 支付頁設(shè)計

在設(shè)計訂單支付頁面時,應(yīng)注意將支付金額放置在最顯眼的位置,且支付金額的字體應(yīng)放大,以便足夠引起用戶的注意。商城系統(tǒng)支持的支付方式應(yīng)清晰的羅列展示。一般情況下,只能選擇一種支付方式,且不能修改支付金額。

支付完成,應(yīng)清晰的向用戶展示支付結(jié)果(成功或失?。⒂唵翁?、支付金額、收款人等信息。另外在支付結(jié)果頁,通常還會增加訂單列表、首頁等跳轉(zhuǎn)按鈕,引導用戶留在商城。為了提升訂單的支付轉(zhuǎn)化率,還可以在支付結(jié)果頁增加刮刮卡、大轉(zhuǎn)盤等抽獎活動。

部分支付廠商會直接提供支付結(jié)果的H5頁面,提供的頁面支持商城進行定制化修改;也有部分廠商僅提供支付接口,需要商城開發(fā)支付結(jié)果頁。

結(jié)語:

從本篇文章開始,將開啟訂單系統(tǒng)的系列分享,陸續(xù)更新有關(guān)訂單系統(tǒng)前后臺功能的設(shè)計思考與心得分享。由于本人才疏學淺,難免有不足之處,歡迎大家在評論區(qū)分享交流,愿你我一起成長,共同進步!

本文由 @PM_墨兮 原創(chuàng)發(fā)布于人人都是產(chǎn)品經(jīng)理。未經(jīng)許可,禁止轉(zhuǎn)載

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

該文觀點僅代表作者本人,人人都是產(chǎn)品經(jīng)理平臺僅提供信息存儲空間服務(wù)。

更多精彩內(nèi)容,請關(guān)注人人都是產(chǎn)品經(jīng)理微信公眾號或下載App
評論
評論請登錄
  1. 文章講的很清晰,很干,看下來有個大概的了解了,感謝分享。

    來自廣東 回復
    1. 感謝閱讀評論,由于本人才疏學淺,難免有不足之處,歡迎大家在評論區(qū)分享交流,愿你我一起成長,共同進步!

      來自上海 回復