本文作者基於大眾點評、攜程旅行APP中酒店的“篩選”功能進行相應的對比分析， 希望通過此文能夠給各位帶來一些啟發。
引言在正式進行“篩選”功能對比之前，
1、用戶使用“篩選”功能的需求或者想要達到的目的是什麼？
可以更精准、快速、高效地找到自己期望獲得的產品
2、使用者使用“篩選”功能的場景或流程是什麼？相對應的行為有哪些？
二、關於產品1、設計產品“篩選”功能的目標是什麼？
一方面是幫助用戶解決“精准高效地找到產品”的需求；另一方面是提高使用者體驗， 讓使用者對產品產生粘性， 積累使用者， 從而獲得更大的轉化價值。
2、如何實現上述目標？
實現上述目標， 需要我們從使用者的角度出發， 對產品進行設計。 諾曼在其《設計心理學》一書中指出， 用戶的認知包括三個層面：
本能層面， 和視覺有關，因此， 若能對有關用戶認知的三個層面進行瞭解， 並以此作為產品功能設計的參考， 這對我們設計出更好的產品很有説明。
正文基於對以上問題的思考和回答， 接下來， 讓我們進入正文， 來看大眾點評、攜程旅行APP中酒店版塊的“篩選”功能是如何設計的， 他們為用戶做了哪些工作， 是否能夠很好地解決用戶需求， 並為用戶帶來很好的體驗。
本文將按照三個關鍵的使用者篩選流程， “篩選前、篩選中、篩選後”來作為行文結構， 此外， 在每一個關鍵流程中， 我們又將會從“主要功能點”、“UI樣式與交互”這兩大部分進行對比和分析。
最後， 通過對比和分析， 本文希望能夠為大眾點評APP中酒店版塊“篩選”功能的設計提出一些改進的建議。
注：競品分析版本
一、篩選前用戶在進入大眾點評、攜程旅行APP進行酒店預訂時， 首先面對的問題是如何找到酒店預訂的入口， 接著才會面對使用“篩選”功能的問題。
在有關酒店預訂入口方面， 如下圖一黑色標注， 大眾點評、攜程旅行都將其放在了APP首頁， 較為明顯的位置。 用戶很容易找到並可以點擊進入。 兩者在視覺和使用者操作上，
圖一
當用戶點擊“酒店”， 則正式進入酒店預訂、搜索、篩選介面， 如下圖二紅框部分：
圖二
通過圖二（左）， 我們可以看出， 大眾點評在位址選擇、日期選擇、搜索框、篩選維度等功能點的佈局上， 更加有次序、也更加清楚和明瞭。 用戶很容易讀懂， 並可以進行下一步的操作。
相比於大眾點評， 攜程在這一功能介面上， 就相對比較複雜和繁瑣。 使用者需要花費較多的時間和認知成本， 來確定並區分哪一塊屬於哪一個功能點。 此外， 有大又有小的字體、不一致的佈局， 會給用戶帶來困擾。
實際上，攜程如此設計，是希望方便使用者可以在此介面有一個對酒店的初步篩選，因為點擊上圖的“查詢”按鈕以後，它會跳到另一個介面（如下圖三），下圖三的介面和大眾點評一開始就跳轉進入的介面相似。但是，從用戶的角度來說，像大眾點評APP這樣，直接跳轉進入篩選介面，會更加方便、明瞭。對使用者來說，不需要在攜程上多跳轉一個頁面。
圖三
二、篩選中1、篩選維度、篩選項對比
結合上文圖二、圖三，我們可以看到大眾點評、攜程在酒店“篩選”功能上，主要包括以下篩選維度：
從上表中，我們看不出兩者在篩選維度上的顯著差異，因此我們通過結構圖來進行更進一步的對比，尋找其中的差異，如下圖四、圖五：
圖四：大眾點評酒店“篩選維度”
圖五：攜程酒店“篩選維度”
基於以上圖四、圖五，我們可以做以下對比和分析：
（1）智慧排序
在智慧排序方面，大眾點評與攜程旅行功能點基本一致，只是文字表達上的差異。
（2）星級價格
在星級/價格方面，大眾點評使用“經濟型”，而攜程採用“二星及以下/經濟”的描述，基本上沒有篩選項上的差異。對於價格也是如此。
（3）全城/位置距離
在有關這一篩選維度上，大眾點評與攜程旅行存在兩個顯著的差異：
移動互聯網時代，會有更多的用戶，傾向於不做規劃，到達當地以後再進行酒店的預訂，而這其中，基於自己所處的位置，選擇距離自己在一定範圍內的酒店，就成為了用戶預訂酒店的一個重要決策點。像筆者這樣的用戶，就常常會基於酒店和自己具體的距離來選擇酒店。因此，若能夠增加一個“距離”篩選項，來告訴用戶酒店距自己有多遠，會受到用戶歡迎。
我們可以看到，大眾點評還沒有“距離”這樣的篩選項功能，而攜程有。
此外，攜程有更為豐富的熱門地標，對地標的分類也更加詳細和細緻，一定程度上在於攜程擁有更多的酒店資源。在此方面，大眾點評可以慢慢發展和積累。
（4）篩選
作為以上三個篩選維度的補充，此處的“篩選”維度中的篩選項，更多的是被隱藏起來。此維度中的一些篩選項，對於使用者來說，使用頻率不是很高，也不是用戶進行決策和篩選的很重要的參考。但有些篩選項具有的話，會是對用戶的一種驚喜。
不過，大眾點評與攜程旅行在此維度上的“篩選項”還是具有較大的差異：
首先，對於“特色”、“品牌”、“服務”、“公司服務”這幾個篩選項來說，由於酒店資源上的差距，大眾點評在此些方面的豐富程度和多樣化程度上，需要進一步發展。
其次，對於“床型早餐”、“支付方式”這兩個篩選項來說，大眾點評可以在其“篩選”維度中增加，但不是必須具有的功能點。
最後，對於“點評”這一篩選項，作為以“用戶點評”起家的大眾點評，需要給予這一篩選項重視，如果可以納入進來，或者將其放在更為突出的“篩選”維度上，對於其他使用的用戶將是一個重要的參考。這也可以更加突出大眾點評產品本身的特色。
2、UI樣式與交互對比（1）全城/位置距離
圖六
首先，對於選中相應的篩選維度之後，“全城”、“位置距離”字體的顯示，大眾點評沒有變化，攜程進行了顏色和高亮的變化。對於用戶來說，後者更具有區分度。點評可以作為參考，字體顏色可以變為橙色，並高亮顯示。
其次，對於篩選項的呈現，點評選擇某一篩選項，比如“熱門”之後，被選中的狀態顯示不明顯，並且與其他未被選中的篩選項區分度不高，用戶在選擇和辨別時會有困難。攜程在此方面的處理，用戶體驗更好一些。比如當“商業區”被選中時，其顏色會變化，並高亮顯示，其他的篩選項則是處於灰色狀態，使用者很容易辨別。
最後，對於“清空”和“確定”的設置，大眾點評在該篩選維度下沒有進行設置，應該是為了降低用戶的操作成本，簡化交互的流程。但這帶來另一個問題是，當用戶想要回到最初篩選的起點時，用戶會發現自己在這一篩選維度下回不去了。
（2）星級/價格
圖七
首先，點評的“星級/價格”字體，在篩選時，沒有顏色的變化和高亮顯示，若有同于攜程的顏色變化和高亮，用戶體驗會更好。
其次，對於價格和星級佈局的問題，用戶對價格的概念、重視程度往往會重於對星級的程度。所以，將價格佈局在上，將星級佈局在下，會更有利於用戶進行快速地篩選。對於攜程在價格佈局處，增加價格選擇的“滑塊”這一功能，筆者操作起來的體驗並不是很好，需要費時間調整。對於價格選擇的問題，筆者認為加入“價格輸入框”會更好一些。如下圖八紅框處，淘寶APP上的價格輸入框，可以作為借鑒：
圖八
最後，從介面佈局次序和設計項目的一致性來看，大眾點評要優於攜程。我們可以從上圖7中，視覺層面，感受到大眾點評的介面更加簡約、並且和諧一致；然而攜程沒有展現其簡約及一致性。
（3）智慧排序
關於此篩選維度的對比，大眾點評和攜程沒有太大的UI樣式與交互差異。如下圖九：不過，還是有兩點可以指出：一是，從設計的協調一致上來說，字數的一致、和諧，大眾點評要優於攜程。二是，從使用更易被用戶理解的“箭頭”符號上，可以看出攜程的用心。
大眾點評可以考慮將“到”字，都改為更易解讀的箭頭符號。
圖九
（4）篩選
在“篩選”這一維度上，大眾點評與攜程旅行採取了完全不同的UI樣式與對話模式。如下圖十：
圖十
實際上，攜程如此設計，是希望方便使用者可以在此介面有一個對酒店的初步篩選，因為點擊上圖的“查詢”按鈕以後，它會跳到另一個介面（如下圖三），下圖三的介面和大眾點評一開始就跳轉進入的介面相似。但是，從用戶的角度來說，像大眾點評APP這樣，直接跳轉進入篩選介面，會更加方便、明瞭。對使用者來說，不需要在攜程上多跳轉一個頁面。
圖三
二、篩選中1、篩選維度、篩選項對比
結合上文圖二、圖三，我們可以看到大眾點評、攜程在酒店“篩選”功能上，主要包括以下篩選維度：
從上表中，我們看不出兩者在篩選維度上的顯著差異，因此我們通過結構圖來進行更進一步的對比，尋找其中的差異，如下圖四、圖五：
圖四：大眾點評酒店“篩選維度”
圖五：攜程酒店“篩選維度”
基於以上圖四、圖五，我們可以做以下對比和分析：
（1）智慧排序
在智慧排序方面，大眾點評與攜程旅行功能點基本一致，只是文字表達上的差異。
（2）星級價格
在星級/價格方面，大眾點評使用“經濟型”，而攜程採用“二星及以下/經濟”的描述，基本上沒有篩選項上的差異。對於價格也是如此。
（3）全城/位置距離
在有關這一篩選維度上，大眾點評與攜程旅行存在兩個顯著的差異：
移動互聯網時代，會有更多的用戶，傾向於不做規劃，到達當地以後再進行酒店的預訂，而這其中，基於自己所處的位置，選擇距離自己在一定範圍內的酒店，就成為了用戶預訂酒店的一個重要決策點。像筆者這樣的用戶，就常常會基於酒店和自己具體的距離來選擇酒店。因此，若能夠增加一個“距離”篩選項，來告訴用戶酒店距自己有多遠，會受到用戶歡迎。
我們可以看到，大眾點評還沒有“距離”這樣的篩選項功能，而攜程有。
此外，攜程有更為豐富的熱門地標，對地標的分類也更加詳細和細緻，一定程度上在於攜程擁有更多的酒店資源。在此方面，大眾點評可以慢慢發展和積累。
（4）篩選
作為以上三個篩選維度的補充，此處的“篩選”維度中的篩選項，更多的是被隱藏起來。此維度中的一些篩選項，對於使用者來說，使用頻率不是很高，也不是用戶進行決策和篩選的很重要的參考。但有些篩選項具有的話，會是對用戶的一種驚喜。
不過，大眾點評與攜程旅行在此維度上的“篩選項”還是具有較大的差異：
首先，對於“特色”、“品牌”、“服務”、“公司服務”這幾個篩選項來說，由於酒店資源上的差距，大眾點評在此些方面的豐富程度和多樣化程度上，需要進一步發展。
其次，對於“床型早餐”、“支付方式”這兩個篩選項來說，大眾點評可以在其“篩選”維度中增加，但不是必須具有的功能點。
最後，對於“點評”這一篩選項，作為以“用戶點評”起家的大眾點評，需要給予這一篩選項重視，如果可以納入進來，或者將其放在更為突出的“篩選”維度上，對於其他使用的用戶將是一個重要的參考。這也可以更加突出大眾點評產品本身的特色。
2、UI樣式與交互對比（1）全城/位置距離
圖六
首先，對於選中相應的篩選維度之後，“全城”、“位置距離”字體的顯示，大眾點評沒有變化，攜程進行了顏色和高亮的變化。對於用戶來說，後者更具有區分度。點評可以作為參考，字體顏色可以變為橙色，並高亮顯示。
其次，對於篩選項的呈現，點評選擇某一篩選項，比如“熱門”之後，被選中的狀態顯示不明顯，並且與其他未被選中的篩選項區分度不高，用戶在選擇和辨別時會有困難。攜程在此方面的處理，用戶體驗更好一些。比如當“商業區”被選中時，其顏色會變化，並高亮顯示，其他的篩選項則是處於灰色狀態，使用者很容易辨別。
最後，對於“清空”和“確定”的設置，大眾點評在該篩選維度下沒有進行設置，應該是為了降低用戶的操作成本，簡化交互的流程。但這帶來另一個問題是，當用戶想要回到最初篩選的起點時，用戶會發現自己在這一篩選維度下回不去了。
（2）星級/價格
圖七
首先，點評的“星級/價格”字體，在篩選時，沒有顏色的變化和高亮顯示，若有同于攜程的顏色變化和高亮，用戶體驗會更好。
其次，對於價格和星級佈局的問題，用戶對價格的概念、重視程度往往會重於對星級的程度。所以，將價格佈局在上，將星級佈局在下，會更有利於用戶進行快速地篩選。對於攜程在價格佈局處，增加價格選擇的“滑塊”這一功能，筆者操作起來的體驗並不是很好，需要費時間調整。對於價格選擇的問題，筆者認為加入“價格輸入框”會更好一些。如下圖八紅框處，淘寶APP上的價格輸入框，可以作為借鑒：
圖八
最後，從介面佈局次序和設計項目的一致性來看，大眾點評要優於攜程。我們可以從上圖7中，視覺層面，感受到大眾點評的介面更加簡約、並且和諧一致；然而攜程沒有展現其簡約及一致性。
（3）智慧排序
關於此篩選維度的對比，大眾點評和攜程沒有太大的UI樣式與交互差異。如下圖九：不過，還是有兩點可以指出：一是，從設計的協調一致上來說，字數的一致、和諧，大眾點評要優於攜程。二是，從使用更易被用戶理解的“箭頭”符號上，可以看出攜程的用心。
大眾點評可以考慮將“到”字，都改為更易解讀的箭頭符號。
圖九
（4）篩選
在“篩選”這一維度上，大眾點評與攜程旅行採取了完全不同的UI樣式與對話模式。如下圖十：
圖十