按鍵的位置是如何強化用戶習慣的?

2 評論 3606 瀏覽 347 收藏 8 分鐘

當設計師需要向用戶展示大量的數據時,總是不可避免要利用到篩選和排序。篩選和排序可以幫助用戶縮小他們正在尋找的數據范圍。

目前我正致力于提升一家大型電子商務的移動端用戶體驗。一個好的導航結構以及深思熟慮后的篩選和排序,是讓用戶輕松找到目標數據的關鍵。

篩選和排序的設計當然絕不是一件復雜的事情,但仍有很多不同的方案去實現。

彈出式篩選頁

有很多APP使用這種方式。篩選頁在搜索結果屏幕上展示給用戶。篩選頁覆蓋在搜索結果頁之上是為與已經展示的結果數據進行上下文的關聯。

Foursquare

b3506c413b8db7196b7334e7adab7d5a

Amazon

59ddba3fec48f6d9da0aac6d15f50924

Etsy

  • 應用場景:當篩選項不是很多,并且你希望能夠對搜索結果數據維持關聯時可以應用。在展示搜索結果時應用通常能收到好的效果。
  • 案例學習: Foursquare and Etsy 都使用了標準模式,而Amazon則使用更為個性化的解決方案。

滿屏式篩選頁

這種方式同上文的彈出式很相似,但是它需要更多的專注力和更多的篩選條目,因此犧牲了對上下文的聯系。

609d06974dab1f03b27145123852b85f

Airbnb

f275ba2c17fc7b525aa41c4750041ce6

Kayak

c4fb89b4b5daa19f88b6be753c6f2cbc

Hostelworld

  • 應用場景:當需要篩選的數據很多時,這種方式能夠給你更多的可利用空間,并且用戶在翻看篩選項時不會覺得有干擾。
  • 案例學習:上面的屏幕截圖中,Hostelworld更適用與上下文聯系的彈出式篩選頁方式,因為只有兩個篩選項要求用戶選擇;我會使用同上面的Foursquare相似的方式。Hostelworld還可以通過“重置”動作來簡化篩選。

搜索結果再篩選

搜索結果是難以預料的,因為數據的返回很大程度上是基于用戶的輸入。哪種方式是好的解決方案取決于垂直線上的數量和數據的總量。

ff55cbc91909f80511cd39fc72d2bc45

Apple

1aba409d314ee1f05d50cb1bfd375dc9

Etsy

d2c29bab0f178264767ebdd80f8417b8

  • 案例學習:蘋果平等對待每一個搜索請求。在之前頁面選中的分類現在放在滿屏式的篩選頁中。另一方面Etsy利用了更為靈活的方式:基于用戶搜索請求的特殊性,提供給用戶一個完全不同的方式。
  • 如果用戶搜索一個一般性商品,例如“anchor(錨)”,Etsy就會提供分類讓你縮小搜索結果范圍。若果你是搜索更精確的商品,例如“anchor necklace(錨項鏈)”,Etsy就會馬上返回商品列表。

排序

與篩選不同,排序不限制展示給用戶的數據,但改變了結果的展現方式。通用的排序功能是按價格、品質或字母順序。為了節省空間,可以學習上面的Etsy和Foursquare將篩選和排序合并在一個頁面中。

a4247112c06a1c8f33b3e99e6f17c3f1

TripAdvisor

b887100a546a4bc56d107a10274b33c8

Kayak

b52e4500246d6b558bbfc2df873c7549

Hostelworld

  • 應用場景:當用戶很難自己找出極限值(如最低價格)時,排序便會發揮作用。在手機上,這種場景很早就存在,因為設計師需要在很有限的視圖尺寸上做設計。這是設計師必須做出的主觀決定。
  • 案例學習:TripAdvisor和kayak都選擇了彈出式,而Hostelworld卻仍用滿屏式。再一次地,我建議他們不要用滿屏式,因為這樣會將用戶帶離查詢結果。

篩選項上:分開展示重要的選擇項

并非所有項目都值得被篩選。展示頂層決定項是個聰明的選擇,列如分別位于不同屏幕的產品類別。這些幾乎是所有用戶都會做出的決定,無論他們在尋找什么。

用戶會知道在哪個類別下他最能找到他要找的產品,但他可能無法確定價格范圍或顏色。

5fb62287982fca8d2b2b756f4139b6c7

Postmates

42e0a304faddf75e76857402c08ce378

Etsy

4d7a817499a9fd52a4f1e131bc620968

Apple

  • 應用場景:不是所有項都應該填塞在篩選中。會被幾乎所有用戶選擇的重要的頂層選擇項最好放在最前。這也助于理清和簡化用戶體驗。
  • 案例學習:Postmates讓你在進入APP上的一個商鋪前先選定產品類別,進入商鋪后即展示商品,并將產品類別藏于篩選頁上。

結論:思索再三

篩選和排序是幫助用戶更便捷地找到目標的有力工具。多花些時間去考慮你的可能選擇——這會讓你獲益的。

記住,最好方法的是不需要篩選和排序——這是可能實現的。在這方面,Postmates是個很好的列子。

找出哪個篩選項被用得最多也是很有受益的。你可以基于這些結果為篩選項安排位置。airbnb知道房屋類型和價格是用戶用得最多的,因此他們把這兩項放在最上面。

就是這些了,正如我所說的,并不復雜~

來源: medium – Thierry Meier???譯文出處:Tuesday_Woo

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 好文,反觀國內APP千篇一律的采用頂部多級下拉菜單的形式

    來自上海 回復