如何設(shè)計(jì)Dashboard?5個(gè)高級(jí)技巧幫助您!

Dashboard是一個(gè)包含了導(dǎo)航、數(shù)據(jù)展示、信息圖表、微交互的界面,你總會(huì)覺得空間不夠,想多放一些內(nèi)容,而又想保持簡潔美觀,那么要如何才能設(shè)計(jì)好呢?這邊整理了5個(gè)高級(jí)技巧,希望能夠幫到您?。?strong>更多Dashboard設(shè)計(jì)可下載后臺(tái)管理設(shè)計(jì)模板


1. 將數(shù)字設(shè)置為右對(duì)齊等間隔

如果Dashboard中的數(shù)據(jù)表或列表小部件包含了統(tǒng)計(jì)數(shù)字?jǐn)?shù)據(jù),請(qǐng)確保數(shù)字靠右對(duì)齊,且每個(gè)數(shù)字占用相等的空間。

這有助于快速比較數(shù)列中的不同數(shù)值,而無需將每一項(xiàng)都進(jìn)行分析。大多數(shù)人習(xí)慣于從左到右閱讀,因此在閱讀中,右對(duì)齊、等間隔的數(shù)值能夠讓人更加清晰地區(qū)分。

默認(rèn)情況下,大多數(shù)字體都沒有打開“等間隔數(shù)值”選項(xiàng),只設(shè)置了等比例數(shù)值——然而實(shí)際上,大部分被廣泛使用的字體都支持這個(gè)功能。你也可以通過調(diào)整OpenType功能,在Sketch或Figma中打開它。

5-tips-dashboard-design4.jpg

右對(duì)齊等間隔的數(shù)值,在視覺上便于識(shí)別更大的數(shù)據(jù),從而快速比較。而左對(duì)齊的等比例數(shù)值,用戶必須單獨(dú)分析每個(gè)數(shù)據(jù),不便于視覺上快速比較。


2.允許用戶定制和共享Dashboard

雖然這可能不適用于每個(gè)產(chǎn)品,但如果你正在設(shè)計(jì)一個(gè)需要團(tuán)隊(duì)協(xié)作的分析平臺(tái),那么你可以考慮引入一種可定制的、能夠讓用戶和他的隊(duì)友共享的Dashboard。

由于企業(yè)報(bào)告工具通常為各種實(shí)例服務(wù),用一組固定小部件覆蓋所有實(shí)例就不能滿足需求。而如果允許用戶創(chuàng)建一個(gè)可高級(jí)定制的Dashboard,我們不僅可以滿足不同的用戶需求,同時(shí)能夠增加應(yīng)用的采納率和使用率。

用于NLP平臺(tái)的dashboard


3.何時(shí)該用餅狀圖和柱狀圖?

圓形餅狀圖通常不能有效且清晰地顯示一個(gè)區(qū)域比另一個(gè)區(qū)域大了多少。特別是有超過4-5個(gè)圖表項(xiàng)目時(shí),更要避免使用餅狀圖來呈現(xiàn)定量數(shù)據(jù)。餅圖更適合用于顯示帶有少量變量的百分比份額。

如果你有許多定量圖表項(xiàng)目,那么可以考慮使用水平或垂直柱狀圖(取決于選項(xiàng)的數(shù)量和設(shè)計(jì)目標(biāo))??紤]一下你是否想要關(guān)注每一個(gè)單獨(dú)項(xiàng),了解它與其他項(xiàng)目有什么不同,以及是否需要從趨勢(shì)中找出突出項(xiàng)。

5-tips-dashboard-design1.jpg



4.考慮信息的層級(jí)感

用戶往往要求能夠快速訪問同一頁面上的各種類型的數(shù)據(jù),并且以盡可能少的用戶交互來掌握所有重要的指標(biāo),特別是在設(shè)計(jì)企業(yè)分析產(chǎn)品時(shí)。

在這種情況下,要考慮動(dòng)態(tài)組合的原則。這意味著要根據(jù)你的用戶流以有意義的順序展示出最有價(jià)值的數(shù)據(jù)。

遵循對(duì)象的層次結(jié)構(gòu)并確保數(shù)據(jù)單元清晰可辨是至關(guān)重要的,這樣一來,Dashboard就不會(huì)變得一團(tuán)糟。幫助建立這種秩序的一個(gè)簡單的經(jīng)驗(yàn)法則就是要注意:即使所有的圖形、形狀和重點(diǎn)都不同,但一定要構(gòu)成一個(gè)有機(jī)的整體。

把Dashboard想象成一個(gè)故事。問問自己如何將這個(gè)故事分解成一組內(nèi)聚的數(shù)據(jù)單元,從而以一種快速、明顯和全面的方式傳遞信息。

5-tips-dashboard-design5.jpg


5.突出統(tǒng)計(jì)數(shù)據(jù)的變化并對(duì)異常情況作出反應(yīng)

一切都是相關(guān)的——在觀察數(shù)據(jù)時(shí)一定要注意這一點(diǎn)。

指出度量標(biāo)準(zhǔn)是如何隨時(shí)間變化的,以及在比較數(shù)據(jù)集時(shí)存在哪些差異。這將告訴客戶是需要采取措施,還是更深入地研究報(bào)告。將圖表上的數(shù)據(jù)設(shè)置為可點(diǎn)擊:通過使用預(yù)定義的過濾器將用戶引導(dǎo)到一個(gè)完整的報(bào)告中,使他們能夠快速訪問特定數(shù)據(jù)的擴(kuò)展視圖。

“指出度量標(biāo)準(zhǔn)是如何隨時(shí)間變化的,以及在比較數(shù)據(jù)集時(shí)存在哪些差異?!?/p>

在操作相對(duì)較大的歷史數(shù)據(jù)量時(shí),定期捕獲度量的非自然變化是非常有效的。它不僅會(huì)對(duì)客戶的業(yè)務(wù)產(chǎn)生積極的影響,還能增加應(yīng)用的使用率和可信度。

“教”你的產(chǎn)品算法去識(shí)別數(shù)據(jù)中的異常,不僅在異常發(fā)生時(shí)通知客戶,而且在可能的情況下提供相應(yīng)的操作指示清單。例如,如果廣告預(yù)算花費(fèi)太快,你可以在特定情況下自動(dòng)建議最合適的報(bào)價(jià),為用戶降低每單位行動(dòng)成本。

5-tips-dashboard-design3.jpg



文章整理翻譯自:https://dribbble.com/stories/2020/03/26/5-tips-dashboard-design

每天更新,
全站高品質(zhì)素材免費(fèi)下載!