萬盛學電腦網

 萬盛學電腦網 >> 網頁制作 >> 交互設計 >> 分解預訂流程之“別墅型”

分解預訂流程之“別墅型”

前段時間針對一些熱門的預訂類網站進行了研究,感覺大多數預訂流程都離不開這3個基本類型,我把他們叫成"別墅型","管道型","菜場型"

別墅型:所有的產品都在自己家的預訂流程中走完,包括產品也全是自己可控,屬於自家產品,例如:攜程酒店預訂

管道型:將預訂的內容整合到一個預訂流程中,作為一個樞紐,最後再擴散到各自對應的預訂流程中,例如:去哪兒,TripAdviser

菜場型:匯集各方的資源到自己的"菜場"中,統一開賣。例如:淘寶旅行

我們先來拆一下:別墅型預訂流程

拆解樣本:攜程酒店(可以一邊看我拆解,一邊實際體驗)

第一步:選擇城市時間

分解預訂流程之“別墅型” 三聯教程

[1] 日歷細節

1. 顯示當前日期(今天日期)

2. 顯示已選擇的入住日期

3. 顯示已選擇的離店日期

4. 節日顯示

第二步:選擇對應酒店

[1] 價格生成等待會出現友好提示

[2] 篩選功能

A. 酒店級別的選擇:默認單選,多選選擇旁邊

a. 默認單選

b. 多選

c. 已選擇狀態顯示,也可以自由刪除

d. 當選擇少於2個,則自動恢復成單選

B. 地鐵路線

C. 顯示所有篩選

a. 通過收起篩選條件按鈕可以切換顯示和收起

D. 第一步已選擇內容,在選擇酒店這裡可以自由更改

a. 已經選擇內容顯示

b. 修改城市

[3] 內容列表顯示

A. 2種方式(列表+地圖)查看具體內容

B. 各種排序分類

a. 排序名稱+icon

b. 價格,點評單獨排序

c. 價格區間變化,如果輸入了數字以外的字母之類,會進行過濾。

[小細節]

d. 促銷酒店,精簡+展開

C. 頂部促銷欄(消耗庫存)

D. 酒店細節與內容

a. 總攬

b. 價格明細

c. 全部房型

d. 優惠的展示方式一,直接特價房

e. 優惠的展示方式二, 小禮物特惠

E. 右側多類目提示信息

第三步: 確認訂單

[1] 到這一步才進入預訂流程(這個點很不錯)

[2] 確認訂單

A. 顯示預訂的內容的明細拆開(不含保險費之類的)

B. 根據房間數,人數的變化調整

第四步: 核對信息(提交訂單)

[1] 整合訂單信息提交

[2] 客服&在線糾錯始終存在

[3] 特殊狀況,特殊顯示

copyright © 萬盛學電腦網 all rights reserved