數據可視化——最佳實踐和基礎

已發表: 2022-03-11

“混亂和混亂不是數據的屬性——它們是設計的缺點。” ——愛德華·塔夫特

什麼是數據可視化?

Michael Friendly 將數據可視化定義為“以某種示意圖形式抽像出來的信息,包括信息單元的屬性或變量”。 換句話說,它是一種直觀地傳達定量內容的連貫方式。 根據其屬性,數據可以用許多不同的方式表示,例如折線圖、條形圖、餅圖、散點圖或地圖。

對於圖形設計師來說,遵循數據可視化最佳實踐並確定以可視方式呈現數據集的最佳方式非常重要。 數據可視化應該是有用的、視覺上吸引人的並且不會誤導。 尤其是在處理非常大的數據集時,開發一種有凝聚力的格式對於創建既有用又具有視覺吸引力的可視化至關重要。

在此數據可視化最佳實踐示例中,直觀地顯示數據更容易理解
美國失業數據的華爾街日報數據可視化。 (由華爾街日報)

為什麼使用數據可視化

據 IBM 稱,每天創建 2.5 萬億字節的數據。 麻省理工學院的研究科學家 Andrew McAfee 和 Erik Brynjolfsson 教授指出,“每秒通過互聯網的數據比 20 年前存儲在整個互聯網中的數據還要多。”

隨著世界與越來越多的電子設備聯繫越來越緊密,數據量將繼續呈指數級增長。 IDC 預測到 2025 年將有 163 澤字節(163 萬億千兆字節)的數據。

人腦很難理解所有這些數據——事實上,如果不進行某種類比或抽象,人腦很難理解大於5的數字。 數據可視化設計師可以在創建這些抽象方面發揮重要作用。

畢竟,如果不能以有用的方式理解和使用大數據,那麼大數據就毫無用處。 這就是為什麼數據可視化在從經濟學到科學技術,再到醫療保健和人類服務的方方面面都發揮著重要作用的原因。 通過將復數和其他信息片段轉換為圖表,內容變得更易於理解和使用。

可視化圖表在儀表板設計中特別有用

何時使用它

由於大量數據很難以任何有意義的方式理解,而且許多最有用的數據集包含大量有價值的數據,因此數據可視化已成為決策者的重要資源。 為了利用所有這些數據,許多企業看到了數據可視化的價值在於清晰有效地理解重要信息,使決策者能夠理解困難的概念、識別新模式並獲得數據驅動的洞察力,以便更好地決定。

數據可視化設計解決方案上花費資源是值得的。 了解大型數據集對於做出明智的決定是必要的——無論是在商業、技術、科學還是其他領域。 清晰的可視化使復雜的數據更容易掌握,因此更容易採取行動。

消費者應用數據可視化最佳實踐

原則

定義明確的目的

數據可視化應該回答重要的戰略問題,提供真正的價值,並幫助解決實際問題。 例如,它可用於跟踪績效、監控客戶行為和衡量流程的有效性。 在數據可視化項目開始時花時間明確定義目的和優先級將使最終結果更有用,並防止浪費時間創建不必要的視覺效果。

了解觀眾

如果不旨在與目標受眾進行清晰的溝通,數據可視化將毫無用處。 它應該與觀眾的專業知識相兼容,並允許觀眾輕鬆快速地查看和處理數據。 考慮到受眾對數據所呈現的基本原則的熟悉程度,以及他們是否可能具有 STEM 領域的背景,在這些領域,圖表和圖表更有可能被定期查看。

美國的全職自由UX設計師想要

使用視覺特徵正確顯示數據

有很多不同類型的圖表。 確定哪種類型最適合可視化呈現的數據本身就是一門藝術。 正確的圖表不僅可以使數據更易於理解,而且可以以最準確的方式呈現。 要做出正確的選擇,請考慮您需要傳達什麼類型的數據,以及要傳達給誰。

以下是最流行的數據可視化圖表類型:

折線圖:折線圖應該用於比較隨時間變化的值,並且非常適合顯示大小變化。 它們還可用於比較多組數據的更改。

折線圖是良好數據可視化技術的一個例子
(來源:<a href="https://www.unep.org/about-un-environment

條形圖:條形圖應該用於比較幾個類別的定量數據。 它們也可用於跟踪隨時間的變化,但最好僅在這些變化很重要時使用。

條形圖是直觀呈現某些數據的好方法
(來源:我們的數據世界)


散點圖:散點圖應該用於顯示一組數據的兩個變量的值。 它們非常適合探索兩組之間的關係。

散點圖數據可視化最佳實踐
(來源:我們的數據世界)


餅圖:餅圖應該用於顯示整體的各個部分。 它們無法顯示諸如隨時間變化之類的東西。

餅圖非常適合數據可視化設計。

保持組織和連貫

在將大數據集編譯為可視化時,連貫性尤為重要。 連貫的設計將有效地淡入背景,使用戶能夠輕鬆處理信息。 最好的可視化可幫助查看者對所呈現的數據得出結論,而不會“當面”或以其他方式吸引註意力。 他們只是以最好的方式顯示數據。

創建數據層次結構以相關方式為決策者顯示各種數據點。 您可以從高到低排序以強調最大值或以突出的方式顯示對用戶更重要的類別。

甚至是數據顯示的順序、使用的顏色(例如最重要的點用較亮的顏色,或基線數據的灰色),以及圖表各種元素的大小(例如將餅圖的某些切片擴展到超出圖表的規則邊框)可以幫助用戶更輕鬆地解釋數據。 在使用這些技術時,請注意不要在不應該存在的地方產生偏見。

交互式數據可視化最佳實踐
交互式數據可視化也是幫助人們解釋數據的絕佳方式。

使數據可視化具有包容性

顏色被廣泛用作表示和區分信息的一種方式。 根據 Salesforce 最近進行的一項研究,它也是用戶決策的關鍵因素。

他們分析了人們對圖表中使用的不同顏色組合的反應,假設他們會更喜歡具有細微顏色變化的調色板,因為它更具美學吸引力。

然而,他們發現,雖然很吸引人,但微妙的調色板使圖表更難分析和獲得洞察力。 這完全違背了創建可視化來顯示數據的目的。

訂閱 Toptal 設計博客並接收我們的電子書

如果顏色相似且對比度較低的圖表對於普通人來說難以閱讀,那麼對於視力不完美的人來說就更難了——而且它們代表了很大一部分人口。 據世界衛生組織稱,估計有 2.53 億人患有視力障礙。

幸運的是,有一些工具可用於檢查有這些缺陷的人如何可視化圖像,例如 Photoshop 和 Illustrator 中的色盲校樣。 使用足夠大的字體大小以及字體和背景之間足夠的對比度等其他事情也很有幫助。

如果模擬工具揭示了調色板的問題,有一些技術可以提高圖形的可讀性:

  • 使用具有高對比度的顏色。
  • 將顏色與圖案或紋理相輔相成,以傳達不同類型的信息。
  • 使用文本或圖標來標記元素。

數據可視化中良好顏色組合的一個很好的例子
即使數據可視化使用比例模型,也可以在每個步驟之間使用足夠的顏色對比度。 當用戶將鼠標懸停在每個國家/地區時,此圖形的交互式版本包括標籤。 (來源:我們的數據世界)

字體選擇會影響文本的易讀性,增強或削弱預期含義。 因此,最好避免顯示字體並堅持使用更基本的襯線或無襯線字體。

確保數據可視化具有適合其媒體的清晰字體大小。 Smashing Magazine建議“16 像素通常應該是現代網頁設計中正文的最小尺寸。”

不要扭曲數據

出色的數據可視化應該清楚地講述故事,避免扭曲。 避免使用不能準確表示數據集的視覺表示,例如 3D 餅圖。

糟糕的數據可視化設計
像這樣的 3D 餅圖很難實際可視化每個切片的比例。 (通過PSDgraphics)

數據可視化可以在不扭曲數據本身的情況下引導查看者得出某些結論。 這在設計諸如供公眾消費的信息圖表之類的東西時特別有用,通常是為了支持特定的結論而創建的,而不僅僅是為了傳達數據。 為此,可以使用顏色選擇和標註特定數據點之類的東西,而不會創建誤導性的圖形(這可能會使設計師的可信度受到質疑)。

不良數據可視化示例

糟糕的數據可視化設計示例
不從零開始 Y 軸會使數據看起來比實際存在的增益更大。 這使得可視化具有誤導性,並且沒有闡明所呈現的數據。


一個誤導性的數據可視化示例
另一個圖表示例,Y 軸不從零開始,扭曲了結果的顯示方式。


不良數據可視化中不良顏色和比例組合的示例
這張來自主要品牌的條形圖在比例上具有誤導性,因為沒有 Y 軸。 儘管只有不到 1% 的微小差異,但超大的藍色條被放大得不成比例。


電池壽命增加 70% 的誤導性數據可視化示例
當 Apple 試圖說明 New iPad 電池的電池續航時間延長了 70% 時,他們將高度增加了 70%,同時也增加了整體規模,使電池看起來比以前的 iPad 電池大得多。 (通過小發明)


良好的數據可視化示例

良好的顏色組合在此數據可視化中包括足夠的顏色對比度
像這樣的條形圖是顯示數據集之間差異的絕佳方式,儘管增強的顏色對比度會使視障用戶更容易訪問此圖像。 (由五十三十二十)


直觀地呈現數據可以使儀表板更易於理解
此銷售儀表板使用幾種不同的可視化格式,以易於理解的格式呈現相關數據,一目了然。 數據也被很好地標記,進一步澄清了事情。 (巴古斯·菲克里)


良好數據可視化的儀表板示例
將乾淨、整潔的設計與易於解釋的數據可視化和簡單的圖表相結合,可以打造出色的用戶體驗。 (由米克洛斯飛利浦)


Google Audience Insights 是交互式數據可視化最佳實踐的一個很好的例子
Google 的 Audience Insights 的交互式數據分析套件做得很好,使數據易於理解。

結論

良好的數據可視化應該使用圖形清晰有效地傳達數據集。 最好的可視化使一目了然地理解數據變得容易。 他們採用複雜的信息並將其分解,使目標受眾易於理解並以此為基礎做出決策。

正如 Edward R. Tufte 指出的那樣,“設計的基本考驗是它對理解內容的幫助程度,而不是它的時尚程度。” 尤其是數據可視化,應該堅持這個想法。 目標是通過設計增強數據,而不是引起對設計本身的關注。

牢記這些數據可視化最佳實踐可以簡化設計對受眾真正有用的信息圖表的過程。

•••

進一步閱讀:

  • 從這些數據可視化中獲得靈感
  • 使用這些儀表板設計靈感升級您的分析
  • 儀表板設計 - 注意事項和最佳實踐
  • 演示設計和視覺敘事藝術
  • 以人為本的設計在產品設計中的重要性
  • 最佳 UX 設計師作品集——鼓舞人心的案例研究和示例