chinesefreesexvideos高潮,欧美极品少妇性运交,久久久国产一区二区三区,99久久婷婷国产综合精品,成人国产一区二区三区

APP推廣合作
聯(lián)系“鳥哥筆記小喬”
B端設(shè)計案例解析!一次性掌握8種表格展示樣式
2024-02-28 10:36:33

來源:Clippp

Halo,今天分享的是「B端表格樣式設(shè)計」。

上一篇文章梳理了表格的基礎(chǔ)樣式,這次一起來探索一下表格的更多展示樣式吧。

我們先大概看下本文講的哪些內(nèi)容:

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

表格中的標(biāo)簽

首先是常用的表格標(biāo)簽部分,一般常見于表格的頭部,一般作用于切換功能。

標(biāo)簽的主要樣式有:基礎(chǔ),卡片,膠囊等,標(biāo)簽切換一般用于沒有交集的數(shù)據(jù)內(nèi)容,通常和時間,狀態(tài)的流轉(zhuǎn)有關(guān)。

根據(jù)標(biāo)簽,可以清楚地知道切換tab就可以篩選內(nèi)容,分類需覆蓋選項,并且保證每一項沒有交集,值得注意的是分類不能過多,超過7±2個選項可選擇下拉篩選。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

下面是阿里云和騰訊云的頁面截圖,可以看到他們在不同的場景下使用了2種不同的標(biāo)簽樣式來區(qū)分狀態(tài)。阿里云的內(nèi)容較少,騰訊云的標(biāo)簽內(nèi)容較多。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

表格中的工具欄

工具欄是由標(biāo)題、篩選、搜索、視圖、新建等操作組成,而功能間的區(qū)分是工具欄設(shè)計的一個關(guān)鍵。

由于表格承載的數(shù)據(jù)量很大,為了提高用戶體驗,能夠快速地提升查找數(shù)據(jù)的數(shù)據(jù)效率,對內(nèi)容進行快速搜索,結(jié)合席克定律和7±2原則,人的記憶點通常為7個單位左右。

超過7個后,每增加一個單位,都會延長用戶決定時間,所以此處的篩選條件不宜過多。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

下面是有贊后臺工具欄的展示,有贊在這里固定了篩選區(qū)域的大小,篩選條件一行2個,查詢按鈕放置于第三行,這樣的設(shè)計兼容了小屏幕的使用場景。

在日常設(shè)計中,篩選條件不宜過多,避免在小屏幕的狀態(tài)下,一屏展示內(nèi)容篩選區(qū)域占據(jù)了大部分,并且過多的篩選條件給予用戶太多選擇,反而不利于使用效率。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

平鋪篩選:將所有的篩選項直接展示在頁面中,直接點擊選擇相關(guān)的篩選項即可。

優(yōu)點:內(nèi)容不多占用極少的頁面空間,能快速操作。

缺點:不適合篩選過多的內(nèi)容。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

天貓后臺這里就是采用了平鋪篩選,在商品種類,品牌多的情況下,平鋪篩選減少了頁面展示使用面積,讓用戶能看到更多的選項。

雖然內(nèi)容較多,但是這里也經(jīng)過了控制,把點擊率較高的品牌與分類前置展示,更多的其他內(nèi)容則收起,用戶需要再自行點擊放出來。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

組合展示

前面我們說過7±2原則,但是現(xiàn)實的B端產(chǎn)品中,往往都是大批量的數(shù)據(jù)與篩選,在這個時候明顯不符合我們的設(shè)計原則,那要怎么辦呢?

數(shù)據(jù)埋點,每個操作埋個PV(點擊量)。

用戶調(diào)研,通過「問卷投放」或「用戶訪談」,深入理解用戶真實使用場景以及與業(yè)務(wù)之間的關(guān)系。

我們對得到的信息進行信息排序,信息排序的原則是:按使用頻率,用戶目標(biāo)高于業(yè)務(wù)邏輯,通過得到的信息,我們對一些次要的信息進行隱藏。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

表頭分組

當(dāng)一個表格里面有多條數(shù)據(jù)在同一個小范圍的維度進行展示時,表頭有很多分組進行區(qū)分,通過硬拆分將數(shù)據(jù)進行切割,這樣數(shù)據(jù)的易讀性會有一定影響,這樣的操作常用于財務(wù)報表中。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

B端邏輯復(fù)雜,環(huán)環(huán)相扣,多種數(shù)據(jù)嵌套,有時候在表格展示的時候,無法避免的需要使用表頭分組,并且這種表格的字?jǐn)?shù)可能都較長,這就很考驗設(shè)計師們的處理方式了,下面是神策數(shù)據(jù)的后臺界面。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

樹形結(jié)構(gòu)

樹形表格往往層級分明,上下級關(guān)系緊密。當(dāng)數(shù)據(jù)信息有清晰的層級關(guān)系時,可以使用樹表格。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

還有一種情況則是需要直接在表格里展開(可以是詳情,也可以是二級表格),無需打開新頁面即可查看附加信息,防止用戶迷失,這種方式適用于信息較少的情況下。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

單元格數(shù)據(jù)過多

工作中常常會遇到單元格數(shù)據(jù)過多的情況,這時候怎么辦呢?

常見的方法有兩種:

1. 定義一個單元格長度或字?jǐn)?shù)限制,超過該范圍以"..."顯示,鼠標(biāo)懸停時出現(xiàn)氣泡顯示完整內(nèi)容。

2.多行顯示,這種方法平鋪直敘,讓用戶可以直截了當(dāng)?shù)乜吹剿行畔?,在B端使用層面上還是不錯的,但是超出三行文字高度行高就會很高。

數(shù)據(jù)過多時,單元格長度如何定義?超過哪個范圍“...”顯示呢?

定義長度的依據(jù):根據(jù)業(yè)務(wù)字段,防重復(fù)。保證用戶在掃視的時候,對重要字段能快速區(qū)分、對比。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

實例展示:

依舊舉例有贊后臺,商品模塊,商品名稱文字沒有限制字?jǐn)?shù),商家填寫關(guān)鍵詞較長,文本數(shù)據(jù)較多,這里采用的是固定文字寬度,超過部分...展示,鼠標(biāo)移上去則展示全部的文字。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

關(guān)鍵數(shù)據(jù)標(biāo)識

用戶在使用表格時,會經(jīng)常去留意一些關(guān)鍵的數(shù)據(jù)。比如數(shù)據(jù)的狀態(tài)、變化的多少…

在系統(tǒng)中,能夠很明確知道用戶想要了解哪些數(shù)據(jù)時,便可在關(guān)鍵數(shù)據(jù)上進行標(biāo)識。這樣能夠幫助用戶快速定位到自己想要的信息,減少數(shù)據(jù)尋找所花的時間。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

值得注意的是:表格設(shè)計中一定不要使用過多的顏色區(qū)作狀態(tài)或操作的區(qū)分,過多的顏色細(xì)分會使表格變得更加混亂,影響用戶體驗。

對狀態(tài)的區(qū)分,僅用輕量的顏色區(qū)分即可,操作欄保持主色按鈕色。

信息展示

1.頭像+姓名的展示方式

表格中很常見,在真實的展示中,往往還需要加上默認(rèn)頭像展示。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

2.圖表標(biāo)識

在對表格進行簡化的過程中,將諸如狀態(tài)、電話、性別之類的屬性進行符號化,這樣可以提升展示效率,極大降低用戶閱讀所需要花費的時間。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

3.進度條

進度條是屬于關(guān)鍵數(shù)據(jù)的一種,它所涉及到的功能與圖表表格類似,能夠更直觀展示數(shù)據(jù)的占比,方便用戶對于多條數(shù)據(jù)間的值進行判斷。進度條常見于“容量、使用量”的數(shù)據(jù)中。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

4.收起低頻的操作項

當(dāng)界面空間有限、表格列數(shù)很多時,如果表格的操作項過多,會占用很多頁面空間,需要有選擇的展示,將低頻操作項收起,用點擊更多按鈕去觸發(fā)選擇。

如果是上線的產(chǎn)品,我們還可以通過按鈕點擊PV(頁面成功訪問次數(shù)),來了解按鈕的使用頻率,做出按鈕優(yōu)化。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

4.不留空白格

設(shè)計表格的時候,要考慮到表格的各種展示情況,非特殊情況不要出現(xiàn)單元格空白。

沒有數(shù)量用“0”表示,沒有該項內(nèi)容用“-”表示。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

5.詳情頁的展開形式

如果詳情內(nèi)容不多,沒有新開頁面的必要,我們可以采用展開行、彈窗、抽屜的形式,但是要注意盡量減少過多的樣式,避免給用戶增加疑惑感。

如果詳情的內(nèi)容很多,而且有編輯的需求,建議采用新開頁的形式。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

6.自定義字段展示

不同用戶想看的信息側(cè)重不同,有時候我們無法準(zhǔn)確判斷用戶看重哪些字段,還可以讓用戶自定義展示字段。

B端設(shè)計案例解析!一次性掌握8種表格展示樣式

關(guān)鍵詞
Clippp
分享到朋友圈
收藏
收藏
評分

綜合評分:

我的評分
Xinstall 15天會員特權(quán)
Xinstall是專業(yè)的數(shù)據(jù)分析服務(wù)商,幫企業(yè)追蹤渠道安裝來源、裂變拉新統(tǒng)計、廣告流量指導(dǎo)等,廣泛應(yīng)用于廣告效果統(tǒng)計、APP地推與CPS/CPA歸屬統(tǒng)計等方面。
20羽毛
立即兌換
一書一課30天會員體驗卡
領(lǐng)30天VIP會員,110+門職場大課,250+本精讀好書免費學(xué)!助你提升職場力!
20羽毛
立即兌換
順豐同城急送全國通用20元優(yōu)惠券
順豐同城急送是順豐推出的平均1小時送全城的即時快送服務(wù),專業(yè)安全,準(zhǔn)時送達!
30羽毛
立即兌換
Clippp
Clippp
發(fā)表文章126
每周定期分享關(guān)于產(chǎn)品、交互、UI視覺上的設(shè)計思考。有原創(chuàng)文章,有精選視頻,歡迎來撩~
確認(rèn)要消耗 羽毛購買
B端設(shè)計案例解析!一次性掌握8種表格展示樣式嗎?
考慮一下
很遺憾,羽毛不足
我知道了

我們致力于提供一個高質(zhì)量內(nèi)容的交流平臺。為落實國家互聯(lián)網(wǎng)信息辦公室“依法管網(wǎng)、依法辦網(wǎng)、依法上網(wǎng)”的要求,為完善跟帖評論自律管理,為了保護用戶創(chuàng)造的內(nèi)容、維護開放、真實、專業(yè)的平臺氛圍,我們團隊將依據(jù)本公約中的條款對注冊用戶和發(fā)布在本平臺的內(nèi)容進行管理。平臺鼓勵用戶創(chuàng)作、發(fā)布優(yōu)質(zhì)內(nèi)容,同時也將采取必要措施管理違法、侵權(quán)或有其他不良影響的網(wǎng)絡(luò)信息。


一、根據(jù)《網(wǎng)絡(luò)信息內(nèi)容生態(tài)治理規(guī)定》《中華人民共和國未成年人保護法》等法律法規(guī),對以下違法、不良信息或存在危害的行為進行處理。
1. 違反法律法規(guī)的信息,主要表現(xiàn)為:
    1)反對憲法所確定的基本原則;
    2)危害國家安全,泄露國家秘密,顛覆國家政權(quán),破壞國家統(tǒng)一,損害國家榮譽和利益;
    3)侮辱、濫用英烈形象,歪曲、丑化、褻瀆、否定英雄烈士事跡和精神,以侮辱、誹謗或者其他方式侵害英雄烈士的姓名、肖像、名譽、榮譽;
    4)宣揚恐怖主義、極端主義或者煽動實施恐怖活動、極端主義活動;
    5)煽動民族仇恨、民族歧視,破壞民族團結(jié);
    6)破壞國家宗教政策,宣揚邪教和封建迷信;
    7)散布謠言,擾亂社會秩序,破壞社會穩(wěn)定;
    8)宣揚淫穢、色情、賭博、暴力、兇殺、恐怖或者教唆犯罪;
    9)煽動非法集會、結(jié)社、游行、示威、聚眾擾亂社會秩序;
    10)侮辱或者誹謗他人,侵害他人名譽、隱私和其他合法權(quán)益;
    11)通過網(wǎng)絡(luò)以文字、圖片、音視頻等形式,對未成年人實施侮辱、誹謗、威脅或者惡意損害未成年人形象進行網(wǎng)絡(luò)欺凌的;
    12)危害未成年人身心健康的;
    13)含有法律、行政法規(guī)禁止的其他內(nèi)容;


2. 不友善:不尊重用戶及其所貢獻內(nèi)容的信息或行為。主要表現(xiàn)為:
    1)輕蔑:貶低、輕視他人及其勞動成果;
    2)誹謗:捏造、散布虛假事實,損害他人名譽;
    3)嘲諷:以比喻、夸張、侮辱性的手法對他人或其行為進行揭露或描述,以此來激怒他人;
    4)挑釁:以不友好的方式激怒他人,意圖使對方對自己的言論作出回應(yīng),蓄意制造事端;
    5)羞辱:貶低他人的能力、行為、生理或身份特征,讓對方難堪;
    6)謾罵:以不文明的語言對他人進行負(fù)面評價;
    7)歧視:煽動人群歧視、地域歧視等,針對他人的民族、種族、宗教、性取向、性別、年齡、地域、生理特征等身份或者歸類的攻擊;
    8)威脅:許諾以不良的后果來迫使他人服從自己的意志;


3. 發(fā)布垃圾廣告信息:以推廣曝光為目的,發(fā)布影響用戶體驗、擾亂本網(wǎng)站秩序的內(nèi)容,或進行相關(guān)行為。主要表現(xiàn)為:
    1)多次發(fā)布包含售賣產(chǎn)品、提供服務(wù)、宣傳推廣內(nèi)容的垃圾廣告。包括但不限于以下幾種形式:
    2)單個帳號多次發(fā)布包含垃圾廣告的內(nèi)容;
    3)多個廣告帳號互相配合發(fā)布、傳播包含垃圾廣告的內(nèi)容;
    4)多次發(fā)布包含欺騙性外鏈的內(nèi)容,如未注明的淘寶客鏈接、跳轉(zhuǎn)網(wǎng)站等,誘騙用戶點擊鏈接
    5)發(fā)布大量包含推廣鏈接、產(chǎn)品、品牌等內(nèi)容獲取搜索引擎中的不正當(dāng)曝光;
    6)購買或出售帳號之間虛假地互動,發(fā)布干擾網(wǎng)站秩序的推廣內(nèi)容及相關(guān)交易。
    7)發(fā)布包含欺騙性的惡意營銷內(nèi)容,如通過偽造經(jīng)歷、冒充他人等方式進行惡意營銷;
    8)使用特殊符號、圖片等方式規(guī)避垃圾廣告內(nèi)容審核的廣告內(nèi)容。


4. 色情低俗信息,主要表現(xiàn)為:
    1)包含自己或他人性經(jīng)驗的細(xì)節(jié)描述或露骨的感受描述;
    2)涉及色情段子、兩性笑話的低俗內(nèi)容;
    3)配圖、頭圖中包含庸俗或挑逗性圖片的內(nèi)容;
    4)帶有性暗示、性挑逗等易使人產(chǎn)生性聯(lián)想;
    5)展現(xiàn)血腥、驚悚、殘忍等致人身心不適;
    6)炒作緋聞、丑聞、劣跡等;
    7)宣揚低俗、庸俗、媚俗內(nèi)容。


5. 不實信息,主要表現(xiàn)為:
    1)可能存在事實性錯誤或者造謠等內(nèi)容;
    2)存在事實夸大、偽造虛假經(jīng)歷等誤導(dǎo)他人的內(nèi)容;
    3)偽造身份、冒充他人,通過頭像、用戶名等個人信息暗示自己具有特定身份,或與特定機構(gòu)或個人存在關(guān)聯(lián)。


6. 傳播封建迷信,主要表現(xiàn)為:
    1)找人算命、測字、占卜、解夢、化解厄運、使用迷信方式治病;
    2)求推薦算命看相大師;
    3)針對具體風(fēng)水等問題進行求助或咨詢;
    4)問自己或他人的八字、六爻、星盤、手相、面相、五行缺失,包括通過占卜方法問婚姻、前程、運勢,東西寵物丟了能不能找回、取名改名等;


7. 文章標(biāo)題黨,主要表現(xiàn)為:
    1)以各種夸張、獵奇、不合常理的表現(xiàn)手法等行為來誘導(dǎo)用戶;
    2)內(nèi)容與標(biāo)題之間存在嚴(yán)重不實或者原意扭曲;
    3)使用夸張標(biāo)題,內(nèi)容與標(biāo)題嚴(yán)重不符的。


8.「飯圈」亂象行為,主要表現(xiàn)為:
    1)誘導(dǎo)未成年人應(yīng)援集資、高額消費、投票打榜
    2)粉絲互撕謾罵、拉踩引戰(zhàn)、造謠攻擊、人肉搜索、侵犯隱私
    3)鼓動「飯圈」粉絲攀比炫富、奢靡享樂等行為
    4)以號召粉絲、雇用網(wǎng)絡(luò)水軍、「養(yǎng)號」形式刷量控評等行為
    5)通過「蹭熱點」、制造話題等形式干擾輿論,影響傳播秩序


9. 其他危害行為或內(nèi)容,主要表現(xiàn)為:
    1)可能引發(fā)未成年人模仿不安全行為和違反社會公德行為、誘導(dǎo)未成年人不良嗜好影響未成年人身心健康的;
    2)不當(dāng)評述自然災(zāi)害、重大事故等災(zāi)難的;
    3)美化、粉飾侵略戰(zhàn)爭行為的;
    4)法律、行政法規(guī)禁止,或可能對網(wǎng)絡(luò)生態(tài)造成不良影響的其他內(nèi)容。


二、違規(guī)處罰
本網(wǎng)站通過主動發(fā)現(xiàn)和接受用戶舉報兩種方式收集違規(guī)行為信息。所有有意的降低內(nèi)容質(zhì)量、傷害平臺氛圍及欺凌未成年人或危害未成年人身心健康的行為都是不能容忍的。
當(dāng)一個用戶發(fā)布違規(guī)內(nèi)容時,本網(wǎng)站將依據(jù)相關(guān)用戶違規(guī)情節(jié)嚴(yán)重程度,對帳號進行禁言 1 天、7 天、15 天直至永久禁言或封停賬號的處罰。當(dāng)涉及欺凌未成年人、危害未成年人身心健康、通過作弊手段注冊、使用帳號,或者濫用多個帳號發(fā)布違規(guī)內(nèi)容時,本網(wǎng)站將加重處罰。


三、申訴
隨著平臺管理經(jīng)驗的不斷豐富,本網(wǎng)站出于維護本網(wǎng)站氛圍和秩序的目的,將不斷完善本公約。
如果本網(wǎng)站用戶對本網(wǎng)站基于本公約規(guī)定做出的處理有異議,可以通過「建議反饋」功能向本網(wǎng)站進行反饋。
(規(guī)則的最終解釋權(quán)歸屬本網(wǎng)站所有)

我知道了
恭喜你~答對了
+5羽毛
下一次認(rèn)真讀哦
成功推薦給其他人
+ 10羽毛
評論成功且進入審核!審核通過后,您將獲得10羽毛的獎勵。分享本文章給好友閱讀最高再得15羽毛~
(羽毛可至 "羽毛精選" 兌換禮品)
好友微信掃一掃
復(fù)制鏈接