登錄 如何設(shè)計好表格

文章搬運至https://www.ui.cn/detail/254321.html奢讨,僅作收集記錄稚叹,請大家支持原創(chuàng)作者。

在數(shù)據(jù)表格中拿诸,什么樣的UI算是成功的

不能可視化和交互的數(shù)據(jù)是無用的扒袖。未來行業(yè)的成功將使高級數(shù)據(jù)收集與更好的用戶體驗相結(jié)合,數(shù)據(jù)表包含了大部分用戶體驗亩码。

良好的數(shù)據(jù)表格允許用戶對信息進行瀏覽季率,分析,比較描沟,過濾飒泻,排序和操作,從而獲得洞察力和行動啊掏。本文介紹了設(shè)計結(jié)構(gòu)蠢络,交互模式和技術(shù)列表,以幫助您設(shè)計更好的數(shù)據(jù)表迟蜜。

固定頭

?當(dāng)用戶上下滾動時固定行標(biāo)題

水平滾動

呈現(xiàn)大型數(shù)據(jù)集時刹孔,水平滾動是不可避免的。將標(biāo)識符數(shù)據(jù)放在第一列中是個好習(xí)慣娜睛。作為高級功能髓霞,可以對列進行單獨鎖定,以便用戶將數(shù)據(jù)與多個錨定標(biāo)識符進行比較畦戒。

調(diào)整列寬

調(diào)整列大小允許用戶查看完整的縮寫數(shù)據(jù)方库。

行風(fēng)格

斑馬條紋,線條障斋,自由形式纵潦。

行風(fēng)格幫助用戶瀏覽數(shù)據(jù)徐鹤。通過刪除行線或斑馬條紋來減少視覺噪音對小數(shù)據(jù)集有效。瀏覽較大的數(shù)據(jù)集時邀层,用戶可能會迷失返敬。線路劃分可以幫助用戶保持自己的位置。交替行(又名斑馬條紋)可幫助用戶在瀏覽長水平數(shù)據(jù)集時保持其位置寥院。雖然當(dāng)有少量行時劲赠,它們會導(dǎo)致可用性問題,因為用戶可能會將注意力集中在突出顯示的行秸谢。

顯示密度

較小的行高使用戶能夠查看更多的數(shù)據(jù)凛澎,而無需滾動。然而估蹄,會降低閱讀性導(dǎo)致視覺解析錯誤塑煎。這就是為什么許多成功的數(shù)據(jù)表設(shè)計包含了控制顯示密度的功能。

可視表匯總

視覺數(shù)據(jù)匯總提供了附表的概述元媚。它允許用戶在操作圖表之前集體發(fā)現(xiàn)樣式和問題轧叽。

分頁

分頁通過在視圖中呈現(xiàn)設(shè)置的行數(shù),具有導(dǎo)航到另一集的能力刊棕。上述示例提供了自定義每個視圖的行數(shù)的功能。這種模式經(jīng)常被無限滾動所取代待逞。隨著用戶滾動甥角,無限滾動逐漸加載結(jié)果。無限滾動對于發(fā)現(xiàn)網(wǎng)站很好识樱,但對于優(yōu)先級應(yīng)用程序通常是災(zāi)難性的嗤无。

懸停操作

當(dāng)用戶懸停時提出額外的操作可以減少視覺雜亂。然而怜庸,它可能導(dǎo)致可發(fā)現(xiàn)性問題当犯,因為用戶需要與表進行交互以暴露操作的呈現(xiàn)。

內(nèi)聯(lián)編輯

內(nèi)聯(lián)編輯允許用戶更改數(shù)據(jù)割疾,而無需導(dǎo)航到單獨的詳細信息視圖

展開行

可擴展行允許用戶評估附加信息嚎卫,而不會丟失其上下文。

快速瀏覽

與展開行類似宏榕,快速查看可讓用戶在上下文中查看其他信息拓诸。

模態(tài)

模態(tài)允許用戶留在表視圖中,但更多地關(guān)注附加信息和操作麻昼。

多模態(tài)

多模態(tài)功能對于主動使用用戶來說很有用奠支,可以執(zhí)行一系列操作,或者比較不同項目的細節(jié)抚芦。

行細節(jié)

單擊行鏈接將表格轉(zhuǎn)換為左側(cè)的列表視圖倍谜,右側(cè)展示其他詳細信息迈螟。它使用戶能夠解析大型數(shù)據(jù)集,以及引用許多項目時不會迷失位置尔崔。

可排序列

列排序允許用戶按字母順序和數(shù)字排列行答毫。

基本過濾

基本過濾允許用戶操縱表中提供的數(shù)據(jù)。

篩選列

此設(shè)計模式允許用戶將過濾參數(shù)分配給特定列您旁。

可搜索列

此設(shè)計模式允許用戶搜索每列內(nèi)的特定值烙常。

添加列

此模式允許用戶從數(shù)據(jù)集中添加列。這是一種將表的數(shù)據(jù)限制為基本信息的方法鹤盒,并允許用戶根據(jù)用例添加其他列蚕脏。

定制列

定制列功能使用戶可以選擇要查看的列,并進行相應(yīng)排序侦锯。該功能可能包括保存預(yù)設(shè)以備以后使用的功能驼鞭。

為什么表很重要

數(shù)據(jù)正在成為全球經(jīng)濟的根基。追求數(shù)據(jù)推動了舊式工業(yè)的革新尺碰。能源挣棕,媒體,制造業(yè)亲桥,物流業(yè)洛心,保健業(yè),零售業(yè)题篷,金融業(yè)甚至政府正在進行數(shù)字化轉(zhuǎn)型词身。

然而,如果沒有可視化和行事的能力番枚,數(shù)據(jù)是無意義的尿孔。在未來十年中幸存的公司不僅擁有卓越的數(shù)據(jù)蔬螟,還將擁有卓越的用戶體驗。

良好的用戶界面設(shè)計是基于人類的目標(biāo)和行為。用戶界面反過來影響行為错维,進一步設(shè)計決策基于此清焕。以微妙和無意識的方式席镀,用戶體驗改變?nèi)祟惾绾巫鞒鰶Q定评腺。看到的是什么奥额,在哪里呈現(xiàn)苫幢,以及如何交互,影響行動垫挨。重要的是我們做出設(shè)計決策韩肝,創(chuàng)造一個更美好的世界,一次一個數(shù)據(jù)表設(shè)計九榔。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末哀峻,一起剝皮案震驚了整個濱河市涡相,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌剩蟀,老刑警劉巖催蝗,帶你破解...
    沈念sama閱讀 222,104評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異育特,居然都是意外死亡丙号,警方通過查閱死者的電腦和手機,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,816評論 3 399
  • 文/潘曉璐 我一進店門缰冤,熙熙樓的掌柜王于貴愁眉苦臉地迎上來犬缨,“玉大人,你說我怎么就攤上這事棉浸』逞Γ” “怎么了?”我有些...
    開封第一講書人閱讀 168,697評論 0 360
  • 文/不壞的土叔 我叫張陵迷郑,是天一觀的道長枝恋。 經(jīng)常有香客問我,道長嗡害,這世上最難降的妖魔是什么焚碌? 我笑而不...
    開封第一講書人閱讀 59,836評論 1 298
  • 正文 為了忘掉前任,我火速辦了婚禮霸妹,結(jié)果婚禮上呐能,老公的妹妹穿的比我還像新娘。我一直安慰自己抑堡,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 68,851評論 6 397
  • 文/花漫 我一把揭開白布朗徊。 她就那樣靜靜地躺著首妖,像睡著了一般。 火紅的嫁衣襯著肌膚如雪爷恳。 梳的紋絲不亂的頭發(fā)上有缆,一...
    開封第一講書人閱讀 52,441評論 1 310
  • 那天,我揣著相機與錄音温亲,去河邊找鬼棚壁。 笑死,一個胖子當(dāng)著我的面吹牛栈虚,可吹牛的內(nèi)容都是我干的袖外。 我是一名探鬼主播,決...
    沈念sama閱讀 40,992評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼魂务,長吁一口氣:“原來是場噩夢啊……” “哼曼验!你這毒婦竟也來了泌射?” 一聲冷哼從身側(cè)響起,我...
    開封第一講書人閱讀 39,899評論 0 276
  • 序言:老撾萬榮一對情侶失蹤鬓照,失蹤者是張志新(化名)和其女友劉穎熔酷,沒想到半個月后,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體豺裆,經(jīng)...
    沈念sama閱讀 46,457評論 1 318
  • 正文 獨居荒郊野嶺守林人離奇死亡拒秘,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,529評論 3 341
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了臭猜。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片躺酒。...
    茶點故事閱讀 40,664評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖获讳,靈堂內(nèi)的尸體忽然破棺而出阴颖,到底是詐尸還是另有隱情,我是刑警寧澤丐膝,帶...
    沈念sama閱讀 36,346評論 5 350
  • 正文 年R本政府宣布量愧,位于F島的核電站,受9級特大地震影響帅矗,放射性物質(zhì)發(fā)生泄漏偎肃。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點故事閱讀 42,025評論 3 334
  • 文/蒙蒙 一浑此、第九天 我趴在偏房一處隱蔽的房頂上張望累颂。 院中可真熱鬧,春花似錦凛俱、人聲如沸紊馏。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,511評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽朱监。三九已至,卻和暖如春原叮,著一層夾襖步出監(jiān)牢的瞬間赫编,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,611評論 1 272
  • 我被黑心中介騙來泰國打工奋隶, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留擂送,地道東北人。 一個月前我還...
    沈念sama閱讀 49,081評論 3 377
  • 正文 我出身青樓唯欣,卻偏偏與公主長得像嘹吨,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子黍聂,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,675評論 2 359

推薦閱讀更多精彩內(nèi)容