3/15/2013



當你的應用程式有大量內容需要呈現時,可以考慮在系統內加入篩選過濾的功能,讓用戶可以精準的找到欲查詢的資料,目前常見的篩選模式則有直接篩選、收纳式篩選器、彈跳式篩選器、篩選表單等四種,以下就簡單介紹一下這四種篩選模式的特色。

直接篩選


這種篩選方法和直接排序非常類似,篩選切換器通常會直接呈現在搜尋結果頁上,使用者只要作一次點擊的動作就可以完成篩選過濾的工作。拿 Google 搜尋為例,用戶可以直接利用畫面左側的導覽頁,對網頁、圖片、地點、新聞…等不同內容作搜尋。


而《CBS News》與《ACL Festival》這兩款應用則是採用了橫向並且可滾動的篩選器,讓用戶可以在不同的內容間,快速地作切換。


收纳式篩選器


利用抽屜收纳的概念,將過濾選單隱藏在畫面上的某個角落,使用者通常需要點擊或滑動特定元件,先將選單叫出來,之後才能進行篩選的動作。拿《Audible》與《Sam’s Club》為例,這兩款應用都直接將篩選器隱藏在畫面底部。


彈跳式篩選器


在此模式中,系統會透過額外跳出視窗的方式,將篩選器呈現在用戶面前,使用者必須等視窗跳出後,才能在上面進行篩選或取消的工作,iOS 版的《TripAdvisor》和 Android版的《Due Today》都使用了類似的設定。


篩選表單


當篩選條件較繁雜或數量較多時,則可以透過表單的方式,讓用戶進行篩選的工作。在排序篇曾提到過,篩選和排序這兩種功能常常會出現在同一表單內。再設計篩選表單時請特別注意,不要把表單設計的太過複雜。


延伸閱讀

1. App企劃》搜尋系統介面設計模式-搜尋篇
2. App企劃》搜尋系統介面設計模式-排序篇

【參考資料:smashingmagazine