守望者

工作上接觸到多個B端產品,設計時幾乎都是直接用組件,個性定制的部位比較少。因此有些模塊就屬于換湯不換藥,長期延續一種設計方式,很少去考慮有沒有其他的形式會更適合。其中篩選組件就是一個,做了幾個相似的篩選組件后,我決定好好分析一下。

 

什么是篩選?

篩選,故名思義就是幫助用戶從眾多的內容中,快速的定位內容,以及將眾多數據分類,講究的是效率。那么在數據量比較大的后臺管理系統,篩選必不可少,它可以通過多個篩選條件進行多維度的尋找。這點單純的搜索是做不到的。?
?

篩選分類

有人可能會把菜單導航、搜索誤認為是篩選,其實這樣理解也沒有太大問題,導航和搜索都是單一條件的篩選,而篩選是多條件,多維度的查找(也可以單一條件查詢)。這里分析的是多條件篩選。我把篩選的形式大致分為以下四種:
?

1、文字輸入類

文字輸入類的篩選條件是需要自己輸入,然后進行查詢的。輸入框中最好可以有文字輸入的提示內容,方便提示用戶輸入,以及確認輸入的類別或格式。同時需要有查詢/搜索按鈕,來執行篩選。(暫時沒找到更加合適的案例,以下圖來說明下問題,它是屬于輸入類和固定選項類混合使用)。

文字輸入類適合于篩選選項不確定的情況,篩選選項多樣性,無法總結。這樣的缺點就是增加了用戶的操作成本,但是能夠更針對性的查詢。

?

2、固定選項類

當篩選選項有限,可以明確的總結分類時,一般采用固定選項類。這種操作起來便捷,降低用戶的操作難度。一般情況下需要“搜索/查詢”按鈕,但是也有的產品是勾選即執行的。如下案例就是多條件選擇之后執行篩選,這樣做的原因是用戶可能還需要選擇其他的選項,避免中途執行篩選分散用戶注意力。

當然前面提到也有一邊選擇一邊執行篩選的,如下案例。它沒有執行篩選的按鈕,勾選選項即開始搜索,這樣的好處是,用戶可以隨時根據結果調整自己的篩選選項。
?

3、平鋪類

一些產品會采用平鋪類的篩選展示,這樣做的好處是用戶能直接看到選項內容,減少操作步驟提高了用戶篩選的效率。但是這樣做的時候要注意做好分類,避免選項過多時找不到目標。

?

4、快捷類

最后還有一種篩選形式是快捷選項類。直接勾選之后即可展示自己想要看到的內容。如下案例中。這種篩選形式和平鋪類相似,都能夠有效提高用戶的篩選效率。

不同的是,這種形式通常作為篩選之后的一個補充,即搭配正常篩選,同時執行搜索,篩選出用戶想要的結果。

?

劃重點

文中總結了四種篩選形式,這四種形式各有自己的特點,我們可以根據自己的產品需要使用合適的形式,但是不一定每種形式單獨出現,也可以將它們混合使用。比如第一個案例中,就是文字輸入類和固定選項類結合使用,當然也可以將平鋪類與快捷選項類結合使用。

 

原文地址:海鹽社(公眾號)

作者:山竹屁

轉載請注明:學UI網 » B端篩選器的小秘密,你們發現了嗎?

登錄收藏
 
你可能喜歡的:
如何快速又精準的確定產品風格?(上)如何快速又精準的確定產品風格?(上)
深耕“用戶界面”(上篇)- 界面表現層自查深耕“用戶界面”(上篇)- 界面表現層自查
PRD分享:「網易云音樂-登錄/注冊模塊」產品需求文檔PRD分享:「網易云音樂-登錄/注冊模塊」產品需求文檔
行為召喚:終極生存指南行為召喚:終極生存指南
觸摸鍵盤的設計解析 | 智能化工具產品觸摸鍵盤的設計解析 | 智能化工具產品
十萬個為什么設計系列02-內容個性化十萬個為什么設計系列02-內容個性化
騰訊動漫8.0——用戶為本騰訊動漫8.0——用戶為本
蘋果絕對不會告訴你表單設計原則:我研究3年后才發現蘋果絕對不會告訴你表單設計原則:我研究3年后才發現
從4款主流產品中掌握登錄注冊流程從4款主流產品中掌握登錄注冊流程
【新系列】十萬個為什么設計-為什么行為召喚按鈕的位置在右側【新系列】十萬個為什么設計-為什么行為召喚按鈕的位置在右側
?
5星腾龙时时彩做号软件 水下工程赚钱吗 11选5走势图 188篮球比分直播篮球即时比分网 cba新浪体育 吉林时时彩计划软件手机版下载 彩票倍投盈亏计算器 大乐透电子投注单有效吗 辽宁十一选五走势图模拟 广西11选五走势图手机版 热血江湖梅赚钱吗 投票录入赚钱 淘宝达人怎样赚钱 百度彩票苹果 山西快乐十分 188足球直播比分直播网 325棋牌游戏下载