中文字幕无码av不卡一区,亚洲综合AV永久无码精品一区二区,黑人巨大白妞出浆,黄色高清无码免费看,久久久久免费精品国产,久久无码人妻丰满熟妇区毛片,欧美日韩国产综合草草,久久福利网站,亚洲一区二区三区中文字幕在线,av国内精品久久久久影院

數(shù)據(jù)篩選在B端產(chǎn)品的出現(xiàn)頻次相當高，也是很重要的一個模塊。作為設(shè)計師來說我們一定要好好進行數(shù)據(jù)過濾的功能設(shè)計，滿足用戶目標來提升用戶體驗。下面這篇文章作者為我們細化了數(shù)據(jù)過濾的種類以及優(yōu)缺點，一起來看看吧。

一、為什么需要數(shù)據(jù)過濾

數(shù)據(jù)過濾意思就是在一堆大量的數(shù)據(jù)中選擇出一些符合我們特定條件的數(shù)據(jù)，得到特定的數(shù)據(jù)就是數(shù)據(jù)過濾。

B端產(chǎn)品往往業(yè)務(wù)復(fù)雜，同時伴隨著數(shù)據(jù)量大的特點。所以數(shù)據(jù)篩選在B端產(chǎn)品的出現(xiàn)頻次相當高，也是很重要的一個模塊。作為設(shè)計師來說我們一定要好好進行數(shù)據(jù)過濾的功能設(shè)計，滿足用戶目標來提升用戶體驗。

二、數(shù)據(jù)過濾的類型

數(shù)據(jù)過濾通?？梢允褂脙煞N方式來實現(xiàn)，分別是：

1. 篩選
2. 搜索

在B端系統(tǒng)界面設(shè)計中，搜索是通過指定任意條件，系統(tǒng)對此條件進行的檢索后，展示相對應(yīng)內(nèi)容，功能偏主動性；篩選是系統(tǒng)提供指定各種條件縮小范圍，可以選擇查找不同條件的內(nèi)容，功能偏被動性。

1. 搜索

搜索功能一般來說是用戶在自己有明確目標的情況下，知道想要查詢的目標（準確或者模糊的目標），通過輸入文本關(guān)鍵詞實現(xiàn)查詢功能。搜索框的樣式基本一致，在交互上會略有不同，使用的場景有兩類，全局搜索和特定搜索。

全局搜索

全局搜索一般表示一種允許用戶在某個平臺或者數(shù)據(jù)庫中使用不受相對搜索限制的搜索方式。說人話就是搜索的范圍是針對整個產(chǎn)品或系統(tǒng)，并且搜索沒有任何限制。例如iPhone在桌面下拉的輸入框內(nèi)輸入信息，就是觸發(fā)全局搜索，去查找輸入的關(guān)鍵詞內(nèi)容，并且范圍也是針對全局，可匹配文件名稱、app名稱、相冊內(nèi)容等。

對于系統(tǒng)中模塊分類較多，所涉及到的內(nèi)容比較全面的，B端系統(tǒng)也會選擇全局搜索，只需要在全局搜索框中輸入自己模糊的目標信息，系統(tǒng)會根據(jù)輸入的關(guān)鍵信息搜索出各個模塊所對應(yīng)的目標字段，如果分類較多，界面還會設(shè)計分類tab進行結(jié)果的展示。

• 優(yōu)點：搜索準確率高，所要即所得。
• 缺點：需要用戶自己輸入，然后進行查詢。需要記憶搜索詳細信息。輸入框需要有提示輸入的內(nèi)容，方便用戶填寫，以及確認輸入的類別或格式。
• 適用場景：適用于用戶沒有清晰的目標，只有模糊的概念或關(guān)鍵詞時。當結(jié)果太多時搜索需要配合篩選固有類一起使用。

特定搜索

特定的頁面指的是在一個模塊或頁面中加入搜索的功能，例如在數(shù)據(jù)表格頁面加入搜索的功能，搜索的目標只在該表格模塊內(nèi)容中進行搜索，搜索的信息具有局限性，當然也是更加準確的搜索用戶想要的目標信息。

• 優(yōu)點：搜索范圍更固定，效率更高。
• 缺點：搜索只能針對固定的來源或頁面，不是針對全局進行搜索，范圍有限。
• 適用場景：適用于用戶的目標明確有明確的來源或頁面，在固定的范圍進行搜索。

使用場景

搜索是用戶指定任意關(guān)鍵詞，平臺對此條件進行檢索后，展示對應(yīng)內(nèi)容。搜索通常針對整個系統(tǒng)和功能全局，在信息過濾性方便比較模糊。搜索可以作為一個入口承載更多運營和導(dǎo)流，例如推薦搜索、熱門搜索等。

對于B端產(chǎn)品而言，如果頁面中數(shù)據(jù)量大并且需要精確展示符合條件的信息則使用篩選；只需要定位到關(guān)鍵詞的內(nèi)容，則使用搜索。

設(shè)計原則

關(guān)于搜索，你可能在移動端或web端都用過，那么我們?nèi)绾巫龊盟阉鞯脑O(shè)計呢？設(shè)計師在設(shè)計搜索的時候應(yīng)該遵循什么原則呢？主要是以下4點：

（1）漸進呈現(xiàn)

在我們設(shè)計展現(xiàn)搜索結(jié)果時，可以考慮漸進呈現(xiàn)的方式。這是指搜索結(jié)果不要一次性全部都呈現(xiàn)給用戶，而是使用逐步擴大范圍的展示方式，讓用戶慢慢瀏覽結(jié)果。但需要注意，漸進展示的層級不要太深，內(nèi)容要做到符合用戶目標。

（2）可操作

對于搜索的結(jié)果，我們可以給予操作選擇，例如查看詳情、收藏、保存搜索結(jié)果等，這將會大大提升用戶與搜索結(jié)果之間的后續(xù)聯(lián)系。

（3）結(jié)構(gòu)化

結(jié)構(gòu)化是指搜索結(jié)果呈現(xiàn)的形式要有經(jīng)過歸納和整理，呈現(xiàn)的結(jié)果要符合一定的規(guī)律邏輯，并且注意內(nèi)容層級不能太深，不能反饋給用戶的是沒有層次的內(nèi)容。簡單來說，分類就是結(jié)構(gòu)化呈現(xiàn)的體現(xiàn)，內(nèi)容結(jié)構(gòu)化后用戶查找和定位才會更有效率。

（4）可保存

無論搜索任何內(nèi)容，用戶都有權(quán)保存自己常用的搜索結(jié)果，保證用戶后續(xù)無需重復(fù)搜索即常見的歷史搜索。這點上已經(jīng)有很多C端產(chǎn)品做的很好了，我們在B端產(chǎn)品上也可以考慮起來。

2. 篩選

另一種數(shù)據(jù)過濾方式是篩選，篩選的百度百科定義是利用篩子使物料中小于篩孔的細粒物料透過篩面，而大于篩孔的粗粒物料滯留在篩面上，從而完成粗、細料分離的過程。該分離過程可看作是物料分層和細粒透篩兩個階段組成的。物料分層是完成分離的條件，細粒適篩是分離的目的。

篩選是系統(tǒng)提供指定或用戶自定義各種條件縮小范圍，找到符合這批條件的所有數(shù)據(jù)。我們最常見的篩選是給出特定的條件，用戶直接選擇對應(yīng)的條件即可實現(xiàn)篩選，也就是常用的普通篩選，但是隨著B端業(yè)務(wù)差異和功能性各不相同，復(fù)雜業(yè)務(wù)場景下簡單的篩選已經(jīng)無法滿足現(xiàn)有業(yè)務(wù)需求了，后面開始引進高級篩選的功能，在不同的需求情況下會選擇采用不同的篩選模式，以便于滿足用戶的不同需求。

篩選總共分為3種類型，分別是：

• 下拉篩選
• 表頭篩選
• tab標簽頁篩選

下拉篩選

下拉篩選是在系統(tǒng)中頁面中的篩選區(qū)設(shè)置下拉篩選條件，用戶通過下拉選擇篩選條件中的值對數(shù)據(jù)進行篩選操作。當然篩選區(qū)中可能除了下拉選擇之后還有輸入篩選，下拉篩選和數(shù)據(jù)篩選共同組成篩選區(qū)。

• 優(yōu)點：頁面的空間利用率高，使用下拉選擇器作為數(shù)據(jù)選項，節(jié)約空間。
• 缺點：由于下拉選擇器的局限性無法觀看到所有的篩選字段，需要點擊操作點擊查看。
• 適用場景：下拉的篩選適用與篩選精確且條件較多時使用，多個下拉篩選能夠更精準匹配想要呈現(xiàn)的數(shù)據(jù)內(nèi)容。下拉篩選條件通常不超過8個，當下拉篩選項較多時可將多余的篩選條件收起或讓用戶自定義展示那些下拉選項。

表頭篩選

通過點擊表格列表頭自帶的篩選項進行數(shù)據(jù)列的篩選。

• 優(yōu)點：通過表頭的點擊，簡潔、直觀的篩選當前表格列。
• 缺點：只能篩選當前列的內(nèi)容，篩選字段比較少，篩選形式比較單一。篩選值展示不夠直觀，表頭篩選也不是所有列都具有篩選功能，所以表頭篩選并不是最好的篩選方式
• 適用場景：表頭篩選類似Excel表格的操作，是一種相對高級的交互，適合表格列比較單一內(nèi)容的篩選。 表頭篩選優(yōu)先級較低，如頁面中有下拉篩選則優(yōu)先滿足下拉篩選。

Tab標簽頁篩選

Tab標簽頁也是一種篩選的方式，Tab標簽頁默認選中一個，點擊切換選中顯示另一個標簽頁下的內(nèi)容。標簽頁從位置來看分為垂直和水平方向Tab，從樣式上分為卡片式Tab和頁簽式Tab。

• 優(yōu)點：篩選通過Tab點擊顯示篩選內(nèi)容，交互步驟少，一個Tab標簽代表一個維度，學(xué)習(xí)成本低。
• 缺點：Tab標簽篩選數(shù)量有限制，不超過5個，并且每一個Tab之間要能夠互斥或業(yè)務(wù)上有關(guān)聯(lián)性，如未查驗、已查驗。同時空間占用多、不夠靈活，對用戶自定義項支持也較差。
• 適用場景：Tab標簽切換一般用于和時間、狀態(tài)的流轉(zhuǎn)有關(guān)，且沒有交集的數(shù)據(jù)內(nèi)容。選項值不超過5個。

使用場景

篩選分為下拉、表頭、tab標簽頁。根據(jù)頁面和業(yè)務(wù)需要選擇。篩選結(jié)果要求精確、業(yè)務(wù)數(shù)據(jù)較多的推薦使用下拉篩選，篩選要求不高業(yè)務(wù)數(shù)據(jù)較少則使用表頭和tab，但需要注意在tab篩選之間需要有業(yè)務(wù)關(guān)聯(lián)性，表頭篩選需要謹慎使用。

二、常見設(shè)計方法

1. 篩選區(qū)布局

從出現(xiàn)的位置來說，組合篩選一般有如下幾種常見類型：上下布局水平篩選區(qū)、左右布局的垂直側(cè)邊篩選區(qū)、 內(nèi)嵌的表頭篩選區(qū)。

上下布局水平篩選區(qū)

在B端設(shè)計的頁面中最常用的篩選布局方式上下布局，篩選區(qū)放置在內(nèi)容區(qū)頁面的上方，先篩選后查看結(jié)果，提高了用戶篩選的效率。

當篩選項目少于三個的情況時，會一行展示，也會占用一整行空間；而當篩選項目多的時候，會占據(jù)大量頁面縱向空間。內(nèi)容較多時，推薦增加收起展開功能，這樣保證篩選整體面積不會很大，提升屏效比。

左右布局垂直側(cè)邊篩選區(qū)

左右布局的篩選區(qū)一般是以選項的形式進行篩選，篩選區(qū)的位置較固定，主要是占用頁面的橫向空間。當左側(cè)篩選區(qū)超出長度時，以滾動的形式進行篩選區(qū)內(nèi)部滾動，通常都搭配實時觸發(fā)篩選。左右布局垂直側(cè)邊篩選區(qū)在國外的網(wǎng)站和產(chǎn)品中比較常見，在國內(nèi)產(chǎn)品中并不常見。

左右布局的好處就是不影響頁面的垂直高度空間，使用抽屜的形式展開收起，可以適應(yīng)很多場景，但是這種類型篩選器會影響頁面的橫向空間，使得頁面的內(nèi)容區(qū)空間寬度被壓縮，并且抽屜展開會擠壓到內(nèi)容區(qū)寬度，對內(nèi)容區(qū)內(nèi)容自適應(yīng)有很高的要求。

內(nèi)嵌的表頭篩選區(qū)

表頭篩選是一種復(fù)雜的篩選形式，常見于表格區(qū)域表頭中，是一種表格內(nèi)置篩選形式，適合表格列比較單一內(nèi)容的篩選，其最開始是源于Excel的篩選形式。

具有表頭篩選功能的表格列表頭名稱右側(cè)會有一個篩選icon，點擊篩選icon呼出氣泡卡片，點擊復(fù)選框內(nèi)容可單選或多選需要展示的內(nèi)容，點擊通常實時生效。生效后表頭篩選icon為選中色，表示有篩選項生效。再次點擊呼出氣泡卡片可點擊清空結(jié)果。

2. 高級篩選

高級篩選針對的場景是篩選條件較多的情況下，超過8個篩選條件即屬于篩選條件過多。在這種情況下，將所有的篩選條件都展示出來會使得篩選區(qū)域過高，影響使用。這時候可以采用高級篩選的方式。

篩選方式做法是在篩選區(qū)展示高級篩選的按鈕，點擊高級篩選會彈出對話框或者抽屜，對話框會承載所有的篩選條件，用戶可在此點擊想要的篩選條件和對應(yīng)的內(nèi)容進行篩選，點擊確定后生效結(jié)果，展示應(yīng)用高級篩選后的數(shù)據(jù)內(nèi)容。對話框內(nèi)會設(shè)置清空按鈕，點擊清空恢復(fù)篩選前的內(nèi)容狀態(tài)。

3. 自定義篩選

自定義篩選的使用場景也是由于篩選條件太多，這時候也可以使用自定義篩選的方式。簡單來說自定義篩選的做法是將篩選條件隱藏，用戶可以自己配置將自己認為重要的經(jīng)常使用的篩選條件展示出來，形成一種篩選條件配置方案保存，用戶可根據(jù)自身使用場景配制出多種篩選條件配置方案，這樣就形成了多種篩選條件方案。

自定義篩選通常將選項放置在對話框中，點擊自定義篩選彈出對話框，勾選需要顯示出來的條件，還可以根據(jù)條件重要性進行順序設(shè)置。

4. 基礎(chǔ)篩選+自定義篩選

基礎(chǔ)篩選+自定義篩選就是在自定義篩選的基礎(chǔ)上，增加了幾個固定的基礎(chǔ)篩選條件，這幾個基礎(chǔ)篩選條件會被固定在篩選區(qū)，用戶可以在這幾個固定條件的基礎(chǔ)上自定義添加其他的篩選條件。

點擊固定條件旁邊的加號添加自定義篩選條件，選擇好條件的同時選擇或輸入需要篩選的關(guān)鍵內(nèi)容，通?；A(chǔ)篩選+自定義篩選都是即時觸發(fā)的形式。

5. 反饋

篩選區(qū)有兩種不同的反饋模式：

• 數(shù)據(jù)實時更新反饋
• 數(shù)據(jù)手動更新反饋

數(shù)據(jù)實時更新反饋

界面將與所有設(shè)置的篩選相匹配并對結(jié)果進行實時更新，即常說的即時觸發(fā)反饋。這種模式的優(yōu)點是在執(zhí)行篩選時為用戶提供了一種方便簡單的體驗，可以在每次點擊篩選條件后立即看到結(jié)果，無需點擊查詢或確定按鈕。需要注意的是如果數(shù)據(jù)量巨大的情況下，頻繁觸發(fā)篩選每次更新數(shù)據(jù)時間較長，反而會降低用戶的使用效率。

手動更新反饋

在手動更新反饋模式下，過濾結(jié)果只有在用戶點擊查詢時才會更新。如果用戶想在每次更改后查看結(jié)果，必須單擊查詢按鈕。這種模式適合多維度復(fù)雜的篩選，所有篩選字段設(shè)置完畢之后，統(tǒng)一執(zhí)行操作，和實時反饋結(jié)果相比降低篩選等待時間，尤其是在大量數(shù)據(jù)進行篩選中，優(yōu)化了用戶體驗。

三、注意事項

1. 什么情況下不適用篩選

選用篩選組件的前提是信息之間有一定的共性。如人員狀態(tài)、人員職級等。如果是篩選注冊用戶郵箱不會重復(fù)很獨立的信息就不適合用篩選組件去查找，用搜索會更好。

2. 篩選分類條件要求

• 分類需符合大眾認知的條件。如：時間選擇按照年月日的認知來選擇，請假時間選擇按照年月日時來選擇。
• 要求篩選類目的名稱要合理、避免晦澀難懂的文案，盡量符合當前業(yè)務(wù)中的業(yè)務(wù)名詞。這決定了實際用戶使用篩選功能的時候是否清晰無困惑。

3. 高頻篩選怎么方便用戶操作

如何定義高頻篩選項不是產(chǎn)品經(jīng)理和研發(fā)團隊自己主觀臆斷出來的，需要有真實數(shù)據(jù)支撐。高頻篩選需要產(chǎn)研團隊根據(jù)數(shù)據(jù)埋點找到業(yè)務(wù)處理中客戶使用的點擊量進行判斷。篩選項根據(jù)數(shù)據(jù)反應(yīng)的點擊情況進行分類，將高頻的篩選項展示出來直接點擊，不常用的篩選項可使用高級搜索的方式收起。

4. 篩選項過多怎么設(shè)計

篩選項過多一般指的數(shù)量是超過8個條件，正常業(yè)務(wù)處理時不會那么多篩選條件同時使用。篩選項過多需要首先進行數(shù)據(jù)埋點，將所有的篩選條件的點擊率使用頻率進行排序，可以挑出點擊率最高的與其他篩選條件點擊量大很多的幾個條件。對于使用頻率最高的幾個條件可以固定在查詢區(qū)，不經(jīng)常使用的可以放入到高級搜索對話框中或者作為自定義篩選項。

5. 篩選和搜索區(qū)別

主要區(qū)別在于用戶對目標的清晰度不同，需要選用不同組件功能來達到其目的。在B端系統(tǒng)界面設(shè)計中，搜索是通過匹配任意條件的關(guān)鍵詞，系統(tǒng)對此條件進行的檢索后，展示符合關(guān)鍵詞的內(nèi)容；篩選是系統(tǒng)提供指定各種不同的條件縮小范圍，可以選擇查找不同條件的內(nèi)容。從使用場景來說，篩選比搜索的結(jié)果要更加精確，業(yè)務(wù)上適合需要精確查找的數(shù)據(jù)內(nèi)容。搜索和篩選都是讓用戶使用某個條件對內(nèi)容進行區(qū)分，從而找到用戶想要的內(nèi)容。

四、經(jīng)驗和建議

• 查詢和搜索針對的使用場景不同，需要根據(jù)需要合理配置和選擇。
• 在設(shè)計篩選區(qū)的時候條件是否高頻和低頻不能根據(jù)產(chǎn)品經(jīng)理的主觀感受進行，最好嚴謹?shù)剡M行數(shù)據(jù)埋點，數(shù)據(jù)的反饋才是最真實的效果。
• 在進行頁面優(yōu)化改動的時候，上線前一定要進行AB測試，看看方案是否改動合理，只要是改動就會改變一定的用戶習(xí)慣。

隨著B端業(yè)務(wù)的復(fù)雜性增強，傳統(tǒng)的功能模式以及交互模式已經(jīng)無法完全的滿足現(xiàn)有的需求，所以需要在原有的基礎(chǔ)上做更好的優(yōu)化，使其更好的滿足現(xiàn)有的需求，也就是讓操作和管理更加簡單，使開發(fā)更容易維護。以上是我對近期所做的項目中所遇到的搜索和篩選功能的總結(jié)與分享，希望對B端的設(shè)計小伙伴有所幫助。