欧美精品在线一区二区三区_亚洲女同精品视频_日韩一区免费_国产欧美久久久精品免费_国产这里只有精品_僵尸再翻生在线观看_久久99精品国产一区二区三区_亚洲免费一区二区_女教师淫辱の教室蜜臀av软件_中文字幕国产一区二区

B端設(shè)計速查-篩選 | 這樣去做篩選才不會爛|北京藍(lán)藍(lán)UI設(shè)計公司

2023-10-27    鶴鶴

本文大致分為兩部分內(nèi)容,第一部分會詳細(xì)的盤一盤篩選;第二部分講一講我的項目里篩選怎么做的并不好的原因大家遇到可以避坑。

向前進(jìn)

 

當(dāng)我開始認(rèn)真的做價值輸出的時候,那其實對于我或者你們來說都是一個很恐怖的事情。成為大牛之前都會有一段慢慢長夜需要我們獨自前行。我已經(jīng)在這長夜里走了6個春秋了,之后希望你們的陪伴讓我在之后走的會不那么孤單。

 



 

1、篩選的意義

 

首先你待知道這個東西是干什么的,他存在的意義是什么。對用戶來說他作用是設(shè)計,只有了解了這些我們在設(shè)計的時候從底層出發(fā)才能更好的運用和做好頁面的篩選功能

 

我們在B端設(shè)計里,對于一個平臺或工具系統(tǒng)而言其包含的數(shù)據(jù)往往是邏輯復(fù)雜其龐大的。在這龐大的數(shù)據(jù)海里,我們能有用精準(zhǔn)的篩選方式來定位我們所需要的數(shù)據(jù)。這是一個系統(tǒng)所要具備最基礎(chǔ)的功能,也是提升用戶體驗的關(guān)鍵。

 



 

-定位數(shù)據(jù)

 

大部分時間我們再操作系統(tǒng)時是帶著目的來的,頁面篩選可以幫助用戶對數(shù)據(jù)進(jìn)行快速的定位可分類,已解決用戶的需要。這樣可以更好的提上我們系統(tǒng)的服務(wù)質(zhì)量和水平。

 

-縮短路徑

 

對數(shù)據(jù)進(jìn)行劃分,進(jìn)而縮短查找路徑和時間,幫助用戶快速找到自己想要的數(shù)據(jù)。解決用戶需求

 

-內(nèi)容分類

 

頁面內(nèi)容過于復(fù)雜可以用篩選和分類結(jié)合,進(jìn)行頁面內(nèi)容的分類劃分。

 

 

2、篩選類型

 

在篩選類型上我們根據(jù)不同的場景,可以把篩選分為,這個分類是是比較粗暴的,如果細(xì)分我們在基礎(chǔ)篩選里就還可以分出N多了。我的分類原則是不復(fù)雜的在各大B端系統(tǒng)組件庫(ant design;TD DESIGN ; 阿科design等)里有的拿來就能用的都?xì)w類為基礎(chǔ)。需要根據(jù)業(yè)務(wù)場景需求定制的篩選組件都?xì)w到高級篩選。因為這部分是你需要花心思理解需求的。

 



 

-基礎(chǔ)篩選組件

 

通常有多個篩選條件組合而成,系統(tǒng)預(yù)設(shè)好的字段,用戶無法修改。
適用場景:針對特定的業(yè)務(wù)和場景,除了關(guān)鍵詞之外還有其他查詢限定詞,既支持模糊搜索也滿足精準(zhǔn)定位。大部分的系統(tǒng)場景基本這個基礎(chǔ)篩選都可以搞定。

分類:篩選無非就是、單選、多多選、tep、輸入框、下拉選擇。這些數(shù)據(jù)方式組合成的限定條件,對我們的數(shù)據(jù)或其他進(jìn)行快速的定位查找。進(jìn)而縮短我們的需求解決路徑提升我們的用戶體驗。

 



 

這些篩選的設(shè)計的組件元素,我在項目里基礎(chǔ)都用過。

 

-高級篩選組件

 

篩選條件自定義組合(靈活且占空間小)。高級篩選占用空間比較小,用戶可以根據(jù)需要自定義篩選條件,不必將所有篩選條件都展示在界面中。使用更靈活,界面更美觀。

 

高級篩選主要就是靈活多變能夠根據(jù)當(dāng)前業(yè)務(wù)定制符合用戶需求的篩選。我把這一類的定制化的篩選組件都?xì)w結(jié)到高級里。

 

 



 

這是我做的一個項目里對展示內(nèi)容篩選填充字段內(nèi)容的彈窗。

 

3、篩選的基本板式和常規(guī)樣式


樣式是隨著頁面板式的不同,并不一個一成不變的東西。不要把東西學(xué)太死嗎。只要用戶看的懂,有利于提升我們系統(tǒng)的效率。那就怎么簡潔明了怎么來整就完事了。我在項目中就因為要滿足業(yè)務(wù)方還要權(quán)衡用戶使用行為習(xí)慣做過各種其他的篩選組合和方式。

 

-常規(guī)布局

 

篩選功能大部分的布局都會位于、頁面的頂部和左側(cè)。這樣的布局在,用戶視覺和操作上面,都是一種相對效率更高和簡潔的選擇。我做的我們的系統(tǒng)。篩選模塊基本都是統(tǒng)一的安排在頁面的頂部。

 

 

-常規(guī)樣式

 

雖然篩選的樣式可以根據(jù)自己的業(yè)務(wù)搞得花里胡哨,但是還是有幾個基礎(chǔ)樣式可以參考的。平鋪;折疊;Tab篩選;單側(cè)選擇;表頭;綜合

 

 

平鋪

字面意思,就是把你的篩選條件的選擇都平鋪出來。這樣最大的優(yōu)點就是在操作上直觀高效。缺點就是占用地方太大導(dǎo)致屏效降低。最終體驗得不嘗試。(我們系統(tǒng)大部分頁面都是平鋪篩選,我是很反對的可是沒毛用)

 

折疊

這是我比較認(rèn)同的一種篩選方式的樣式。理解起來就是把用戶高頻的篩選條件放出來。把低頻的篩選條件折起來。這樣就兼顧了效率又提上了屏效。這種方式最大的問題是你永遠(yuǎn)不知道用戶的想法和你的設(shè)計差的會有多夸張。永遠(yuǎn)不知知道自己在用戶眼里有多蠢。

 

tab篩選

多用于區(qū)分內(nèi)容分類。兩標(biāo)簽內(nèi)容區(qū)分比較大的情況。這個也會用的很多。本質(zhì)上就是一種分類。

 

單側(cè)篩選

在板式左右分布的時候可以采用單側(cè)的篩選。他可以是單側(cè)過個復(fù)雜篩選條件的方式。也可以是單側(cè)導(dǎo)航的方式(后臺菜單導(dǎo)航不也是一種對整個后臺內(nèi)容的一種篩選嗎,你想對不)

 

表頭

就是在頁面列表里,對第一字段在表頭上對狀態(tài)或排列方式等的一種數(shù)據(jù)篩選方式。

 

綜合

就是以上的多種篩選方式,綜合在一個頁面里使用。

 

4、說說我的項目

 

在我做的SaaS項目里,那基本上本文所說的各種篩選方式都用上了。是的在項目里基本是這樣的。因為本身我們B端的業(yè)務(wù)邏輯比較復(fù)雜而且數(shù)據(jù)量比較大。畢竟我負(fù)責(zé)設(shè)計的SaaS平臺系統(tǒng)是一個服務(wù)全國4000+企業(yè)的大平臺。真的是一點不比哪些大廠設(shè)計師差。

 

是的在項目里,大部分時間是很難統(tǒng)一用一種篩選方式去處理所有業(yè)務(wù)問題的。所以在我的項目里,篩選的設(shè)計運用就是在一個大的框架原則下做到盡量的保持頁面的視覺表現(xiàn)。

 

 

 

在我項目里這個大的框架原則是什么呢。保證業(yè)務(wù)流程的通暢、系統(tǒng)操作邏輯的合理。

 

 

5、篩選的運用原則

 

通常我會認(rèn)為篩選的使用大概可以從以下幾個方面去考慮。

 

 

-業(yè)務(wù)

你的篩選要符合業(yè)務(wù)需求的要求。有沒有提說過沒有業(yè)務(wù)的設(shè)計都是耍流氓。

 

-效率

在滿足業(yè)務(wù)的同時你也要考慮用戶的操作效率。怎么的頁面篩選方式才能讓用戶更高效的達(dá)成解決自己的需求。

 

-學(xué)習(xí)成本

你不要覺得沒有學(xué)習(xí)成本就是一個好的系統(tǒng)。在現(xiàn)階段B端系統(tǒng)沒有學(xué)習(xí)成本是一個不可能的事情。但是過高的學(xué)習(xí)成本,是會極大的降低用戶體驗的。所以要考慮學(xué)習(xí)成成本和通用性。

 

最后

 

篩選個功能其實很簡單。多看看這幾個大廠的組件庫和頁面參考,大部分情況的業(yè)務(wù)都是可以解決的。希望這篇文章可以幫到你。

寫到這里感覺還是沒有沒有把這個篩選聊的很清楚。如果要把他聊的在清楚一點,可能就不能單獨的說篩選這個功能模塊。需要結(jié)合到生活場景、業(yè)務(wù)場景里面去探討。



作者:彪形大漢pro
鏈接:https://www.zcool.com.cn/article/ZMTU4OTQ0NA==.html
來源:站酷
著作權(quán)歸作者所有。商業(yè)轉(zhuǎn)載請聯(lián)系作者獲得授權(quán),非商業(yè)轉(zhuǎn)載請注明出處。
 
 
 

藍(lán)藍(lán)設(shè)計建立了UI設(shè)計分享群,每天會分享國內(nèi)外的一些優(yōu)秀設(shè)計,如果有興趣的話,可以進(jìn)入一起成長學(xué)習(xí),請加藍(lán)小助,微信號:ben_lanlan,報下信息,藍(lán)小助會請您入群。歡迎您加入噢~希望得到建議咨詢、商務(wù)合作,也請與我們聯(lián)系01063334945

分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問題,請及時與我們?nèi)〉寐?lián)系,我們立即更正或刪除。

藍(lán)藍(lán)設(shè)計( m.ocunn.cn )是一家專注而深入的界面設(shè)計公司,為期望卓越的國內(nèi)外企業(yè)提供卓越的UI界面設(shè)計BS界面設(shè)計 cs界面設(shè)計ipad界面設(shè)計包裝設(shè)計圖標(biāo)定制 用戶體驗交互設(shè)計網(wǎng)站建設(shè) 平面設(shè)計服務(wù)UI設(shè)計公司界面設(shè)計公司UI設(shè)計服務(wù)公司數(shù)據(jù)可視化設(shè)計公司UI交互設(shè)計公司高端網(wǎng)站設(shè)計公司UI咨詢用戶體驗公司軟件界面設(shè)計公司

日歷

鏈接

個人資料

存檔

亚洲经典一区二区三区| 亚洲在线观看免费| 激情综合网av| 亚洲深夜福利| 欧美a级一区| 国产精品久久久久无码av| 久久人人爽人人| 日韩一区欧美一区| 久久久午夜电影| 99re热这里只有精品免费视频| 蜜臀av性久久久久蜜臀aⅴ| 精品9999| 99pao成人国产永久免费视频| 亚洲乱码电影| 亚洲国产日韩欧美在线| 日韩一区三区| 青青草国产免费一区二区下载| 国产伦精品一区二区三区千人斩| 欧美人妖在线观看| 色综合www| 欧美成人午夜77777| 9l视频自拍蝌蚪9l视频成人| 精品视频一二| www.爱久久| 精品成人自拍视频| 你懂的视频欧美| 教室别恋欧美无删减版| 极品美女一区二区三区| 日韩毛片视频| 欧美激情91| 亚洲一区二区免费看| 久热综合在线亚洲精品| 免费在线观看不卡| 美女高潮久久久| 国产成人精品三级| 99re热这里只有精品免费视频| 久久久综合九色合综国产精品| 久久久99精品久久| 中文字幕亚洲视频| 亚洲成av人片观看| 欧美日韩一二三四五区| 欧美性大战久久| 日韩精品在线网站| 亚洲欧美日韩在线一区| 最近2019年手机中文字幕| 欧美日韩成人网| 欧美在线一区二区视频| 91午夜在线播放| 欧美日韩一区二区三区在线视频| 国产欧美一区二区在线| 成人动漫在线免费观看| 福利视频在线看| 日本色护士高潮视频在线观看| 岛国在线视频网站| 国产一区二区三区黄网站| 成人香蕉社区| 99久久影视| 日韩影院精彩在线| 成人av电影在线播放| 亚洲国产成人自拍| 欧美午夜激情在线| 精品三级av在线| 久久精品99国产精品酒店日本| 97精品久久久| 国产精品一区在线播放| 在线看无码的免费网站| a在线视频观看| 性生交大片免费看l| 色综合99久久久无码国产精品| 国产一级做a爰片在线看免费| 中文字幕在线播放av| 五月婷婷激情在线| 一区二区三区伦理| 欧美视频三区| 欧美ab在线视频| 国产精品夜夜爽| 日韩理论片中文av| 555夜色666亚洲国产免| 色噜噜国产精品视频一区二区| 奇米成人av国产一区二区三区| 国产区一区二区| 亚洲精品无码国产| 国产伦精品一区三区精东| 久久久久99精品成人片毛片| 国产人妖一区二区三区| 91精品专区| 欧美一区二区三区婷婷| 欧美丝袜丝交足nylons172| 久久一日本道色综合久久| 久久精品一区四区| 欧美性受xxxx| 欧美精品在线观看91| 青青操视频在线| ga∨成人网| 久久sese| 91精品啪在线观看国产18| 狠狠色丁香婷婷综合| 亚洲日本护士毛茸茸| 日韩久久免费av| 日韩av成人在线观看| 亚洲二区三区四区| 亚洲AV成人精品| 国产精品男女视频| 深夜福利在线看| 95精品视频| 国产日韩欧美三区| 综合分类小说区另类春色亚洲小说欧美| 欧美精品国产精品| 欧美在线视频一区二区| 成人性做爰片免费视频| 青青草视频播放| 国产麻豆免费视频| 国产网红在线观看| 日韩中文首页| 国产亚洲综合色| 欧美成人性战久久| 国产精品一区二区久久久| 成年人网站国产| 精品女人久久久| 国产女王在线**视频| 成人做爰视频www| 午夜亚洲性色视频| 亚洲一区二区三区中文字幕| 中文字幕免费国产精品| 国产日韩在线一区二区三区| www.亚洲高清| 国产亚洲欧美日韩高清| 麻豆视频在线免费观看| 一级特黄色大片| 99re99热| 一级黄色大片免费看| 日本视频www色| 国产啊啊啊视频在线观看| 欧美精选视频在线观看| www.日本不卡| 亚洲国产成人久久| 99九九电视剧免费观看| 99re6在线观看| 国产精品第六页| ****av在线网毛片| 欧美日韩hd| 亚洲第一久久影院| 欧美国产第一页| 成年人深夜视频| 国产女人18水真多毛片18精品| 青草久久伊人| 国产日产一区| 国产精品无人区| 综合136福利视频在线| 午夜精品一区二区在线观看| 老头老太做爰xxx视频| 导航福利在线| 亚洲精品合集| 国产精品美日韩| 久久精品国产久精国产一老狼 | 欧美一级bbbbb性bbbb喷潮片| 亚洲理论电影在线观看| 久久99久久98精品免观看软件 | freexxx性亚洲精品| 欧美日韩国产色综合一二三四| 一区二区三区丝袜| 久久青草精品视频免费观看| 久久久噜噜噜www成人网| www.国产一区二区| xxxxx性欧美特大| 男人的天堂久久精品| 欧美日韩一区在线| 69堂成人精品视频免费| 亚洲国产果冻传媒av在线观看| 桃乃木香奈av在线| 日本不卡电影| 香蕉成人伊视频在线观看| 国产suv精品一区二区三区88区| 亚洲黄色a v| 亚洲黄色在线免费观看| 欧美日韩破处| 国产精品国产三级国产aⅴ入口 | 欧洲毛片在线| 91成人免费| 91黄视频在线观看| 国产精品一码二码三码在线| 中文字幕av久久爽一区| 97香蕉超级碰碰久久免费的优势| 久久久久北条麻妃免费看| 精品无码国产一区二区三区av| 中文字幕第四页| 福利一区和二区| 26uuu亚洲| 久久久久久久久久久久av| 中文字幕国内自拍| 性插视频在线观看| 欧美高清视频手机在在线| 亚洲成人777| 3d蒂法精品啪啪一区二区免费| 最近中文字幕在线mv视频在线| 免费大片在线观看www| 国产精品久久久久久久久久妞妞| 91精品婷婷国产综合久久| 日本一区视频在线播放| 国产乡下妇女做爰毛片| 成人午夜毛片| 国产婷婷一区二区| 日本午夜精品理论片a级appf发布| 超碰中文字幕在线观看| 国产在线黄色| 久久字幕精品一区| 亚洲美女视频网站| 亚洲精品无码久久久久久| 蜜桃视频久久一区免费观看入口 | 精品大片一区二区| 色综合激情久久| 久久伊人资源站| 日韩久久中文字幕| aiai久久| 图片区小说区国产精品视频| 国产精品免费在线 | 成人黄色三级视频| 福利在线一区| 色开心亚洲综合| 毛片网站在线| 三级欧美韩日大片在线看| 亚洲国产精品免费| 两根大肉大捧一进一出好爽视频| 欧美在线 | 亚洲| 欧美日韩国产一区精品一区| 日韩一区二区免费在线电影| av一区二区三区免费观看| 粉嫩小泬无遮挡久久久久久| 欧美在线黄色| 亚洲精品黄网在线观看| 欧美一级片中文字幕| 天天av综合网| 美腿丝袜一区二区三区| 久久在线视频在线| 涩视频在线观看| av手机免费在线观看| 久久一日本道色综合| 国产精品小说在线| 免费一级黄色大片| 97久久亚洲| 在线视频欧美区| 国产又粗又长又爽视频| 四虎免费在线观看| 久久亚洲国产精品一区二区| 色妞一区二区三区| 日本三级日本三级日本三级极| 漫画在线观看av| 亚洲视频资源在线| 免费在线观看91| www.日韩高清| 久久久精品五月天| 欧美日韩成人精品| 亚洲熟女少妇一区二区| 91成人短视频| 欧美精品v国产精品v日韩精品| 2022亚洲天堂| 黄av在线播放| 国产精品亲子伦对白| 久久国产精品 国产精品| 国产三级小视频| 亚洲资源av| 韩国19禁主播vip福利视频| 91精品少妇一区二区三区蜜桃臀| 国产色噜噜噜91在线精品| 7777精品久久久大香线蕉| 成人亚洲视频在线观看| 牛牛精品在线| 亚洲精品自拍动漫在线| 亚洲免费在线精品一区| 性网站在线播放| 成人精品免费网站| 国产91亚洲精品一区二区三区| 国产一区二区视频免费观看| 中日韩男男gay无套| 欧美国产日韩视频| 波多野结衣爱爱视频| 九九热视频在线免费观看| 黄网站app在线观看下载视频大全官网| 日韩在线观看一区二区| 欧美一级大胆视频| 中文字幕一区在线播放| 黄色成人av网站| 久久频这里精品99香蕉| 自拍偷拍欧美亚洲| 今天的高清视频免费播放成人| 久久999免费视频| 免费一级片视频| 欧美成人一品| 国模私拍一区二区三区| www.国产色| 国产欧美综合一区二区三区| 欧美孕妇孕交黑巨大网站| 亚洲久久在线观看| 在线综合视频| 国产精品视频免费观看www| 在线观看国产精品入口男同| 日本中文字幕一区| 91系列在线观看| 色一情一乱一区二区三区| 成人av网站在线观看免费| 久久综合九九| 国产精品麻豆一区二区三区| 亚洲欧洲99久久| 国产婷婷一区二区三区| 青青青免费在线视频| 欧美日韩国产影片| 俄罗斯黄色录像| 少妇精品久久久一区二区三区| 中文字幕久久亚洲| 国产乡下妇女做爰| 久久一日本道色综合久久| 成人性生交xxxxx网站| 人妻视频一区二区三区| 99免费精品视频| 在线免费一区| free性m.freesex欧美| 欧美性高清videossexo| 久久久久亚洲av无码网站| 卡通动漫国产精品| 久久九九有精品国产23| 日本免费精品视频| 国产一区二区三区久久久| 欧美午夜视频在线| av网站免费在线观看| 欧美自拍偷拍一区| 国产精品久久久免费观看| 日韩精品电影| 日韩免费中文字幕| 粉嫩小泬无遮挡久久久久久| 国产欧美一区二区精品忘忧草| 97超碰国产精品| 欧美男男gaygay1069| 亚洲美女av电影| 国产三级av片| 国产成人av福利| 国产乱子伦精品视频| 写真福利精品福利在线观看| 日韩在线卡一卡二| 91美女在线观看| 男女啪啪免费观看| 欧美精品资源| 亚洲日本中文字幕| 日本高清不卡码| 国产精品99精品久久免费| 国产麻豆电影在线观看| 韩国美女久久| 亚洲男人第一网站| 一级黄色av片| av电影在线观看完整版一区二区| 大胆欧美熟妇xx| 国产精品国产三级在线观看| zzjj国产精品一区二区| 岳乳丰满一区二区三区| 久久久久久久av麻豆果冻| 欧美色图另类小说| 伦理一区二区三区| 91av视频导航| 亚洲字幕成人中文在线观看| 性做久久久久久免费观看| 美国黄色一级视频| 精品999日本| 欧美日韩亚洲一区二区三区在线观看| 波多野结衣在线观看| 国产视频久久网| 一区二区视频播放| 国产精品传媒在线| 日本中文字幕有码| 亚洲视频精品| 色综合久久88色综合天天提莫| 一区一区三区| 日韩三级影视基地| 欧美视频xxx| 欧美日韩国产在线| 亚洲精品国产精品乱码在线观看| 久久精品国产亚洲一区二区三区| 亚洲免费视频播放| 1769国产精品视频| 国产精品成av人在线视午夜片| 成人不用播放器| 亚洲国产精品一区二区久| www.国产毛片| 一色屋精品亚洲香蕉网站| 人妻 日韩 欧美 综合 制服| 99精品视频免费观看视频| 在线视频一区观看| 精品一区二区不卡| 亚洲字幕av一区二区三区四区| 国产欧美日韩另类视频免费观看| 亚洲自拍第三页| 日韩午夜av| 日韩视频 中文字幕| 成人高潮视频| 91深夜福利视频| 日韩脚交footjobhdboots| 超碰精品一区二区三区乱码| 在线观看一级片| 日韩欧美国产高清| 一二三区中文字幕| 午夜一区二区三区视频| 九九在线观看视频|