十個(gè)建議,你的報(bào)表也可以高大上
設(shè)計(jì)圖表其實(shí)不僅僅是設(shè)計(jì)師的事,也是我們每個(gè)人在工作中都會遇到的。大到為投資者Pitch 報(bào)需要做的數(shù)據(jù)可視化,小到銷售數(shù)據(jù)統(tǒng)計(jì) Excel 表格里插入的圖表,其實(shí)我們每天都在接觸到圖表的設(shè)計(jì)。本文作者是個(gè)在數(shù)據(jù)可視化領(lǐng)域有著十五 年經(jīng)驗(yàn)的設(shè)計(jì)師,所以每天都會進(jìn)行圖表設(shè)計(jì)。這里他為大家分享了他做出兼具美學(xué)與實(shí)用性圖表的設(shè)計(jì)原則。
使用熟悉的圖表
作為設(shè)計(jì)師,使用一些特別又少見的圖表可能會是一種樂趣。比如流行圖。但是用戶卻沒有義務(wù)去學(xué)習(xí)如何讀懂你的圖表。所以,大多數(shù)情況下,你應(yīng)該使用以下這幾種常見的圖表:柱狀圖,區(qū)域圖,線形圖,以及餅狀圖。
一個(gè)餅狀圖內(nèi)不要?jiǎng)澐殖^五個(gè)區(qū)塊
基礎(chǔ)原則是,如果你一定要使用餅狀圖,那么要保證不要?jiǎng)澐殖^五個(gè)區(qū)塊。
區(qū)塊越多,越難以給用戶帶去有意義的表達(dá)。反而還會讓你陷入尋找如何顯示標(biāo)簽和愚蠢的懸浮顯示交互的泥潭。一般來說這種需要很多區(qū)塊的情況下,還不如直接換一個(gè)類型的圖表來得簡單。
組織數(shù)據(jù)序列
除了處理日期數(shù)據(jù)以外,建議通過對數(shù)據(jù)進(jìn)行降序或者升序排列來提高可讀性。這個(gè)原則主要適用于柱狀圖。
避免 3D 圖表
3D 圖表沒有一點(diǎn)實(shí)用效果 (也許唯一的例外是除你在設(shè)計(jì) VR 圖表),而且連看都不好看。
不要使用隨機(jī)生成的顏色
有些圖表機(jī)制會自動生成數(shù)據(jù)顏色。但是這些自動生成的算法,既不能滿足搭配整體色調(diào)的需要,也難以把不同數(shù)據(jù)按合理的顏色區(qū)分開來。***還是用你自己選擇的色系。并確保你的備選色系里有足夠的顏色可以分配給圖表的所有數(shù)據(jù)。
趨勢線往往會造成干擾
趨勢線似乎可以對圖表展示提供很大幫助。事實(shí)上卻是,它們很難為用戶在已經(jīng)很明顯的點(diǎn)狀數(shù)據(jù)上再提供更多的信息。如果你一定要添上趨勢線的話,至少,讓用戶可以隱藏它們吧。
不要過度依賴懸浮標(biāo)簽
把懸浮標(biāo)簽(鼠標(biāo)懸停的時(shí)候顯示的說明標(biāo)簽)看成一個(gè)輔助的,或是延伸的信息。換句話說,不要把這個(gè)作為展示數(shù)據(jù)值的唯一途徑。
除非必須,不要添加圖例
如果你只有一個(gè)數(shù)據(jù)系列,那就直接把這個(gè)數(shù)據(jù)表示的類型放進(jìn)圖標(biāo)名稱就好了,不需要再添加圖例占據(jù)額外的空間了。
只在需要的時(shí)候使用網(wǎng)格線
網(wǎng)格線可以使用戶的目光從 X Y 軸轉(zhuǎn)移到數(shù)據(jù)值上來。但在一張簡單的圖表上,網(wǎng)格線卻不是必須的。并且,當(dāng)你添加網(wǎng)格線的時(shí)候,還需要考慮是否在 X 和 Y 軸上都需要它們。在很多情況下,你其實(shí)只需要在 X 或 Y 軸上需要。
圖標(biāo)模型里面使用真實(shí)的數(shù)據(jù)
設(shè)計(jì)師往往傾向于設(shè)計(jì)一個(gè)超級漂亮的圖表,而沒有考慮在實(shí)際應(yīng)用中,圖表會用到的真實(shí)數(shù)據(jù)。
這會讓實(shí)現(xiàn)你設(shè)計(jì)的開發(fā)者很頭疼。更重要的是,你甚至都沒有驗(yàn)證過你的設(shè)計(jì)在真實(shí)數(shù)據(jù)環(huán)境下是否可行。
***的方法是設(shè)計(jì)兩套版本。***個(gè)方案展示在理想數(shù)據(jù)環(huán)境下,你的設(shè)計(jì)是怎樣展現(xiàn)的(也就是說,在美學(xué)上***程度優(yōu)化)。這個(gè)方案可以放進(jìn)你的作品集,或是展示給潛在客戶的時(shí)候使用。第二個(gè)版本,則是使用真實(shí)使用環(huán)境下的真實(shí)數(shù)據(jù)的實(shí)用版本,把這個(gè)版本拿給開發(fā)者實(shí)現(xiàn)。
***,一切都有例外
當(dāng)然,你可以使用你自己的判斷力來進(jìn)行***的數(shù)據(jù)設(shè)計(jì)。進(jìn)行有意義數(shù)據(jù)可視化不一定就是數(shù)據(jù)的機(jī)械裁剪。你可能會在實(shí)際設(shè)計(jì)中發(fā)現(xiàn)與以上原則有出入的地方,這也很正常,重要的是,你可以根據(jù)具體的場景來進(jìn)行最合適的設(shè)計(jì)就好。