本文的英文原标題是“10 Rules of Dashboard Design”，其中Dashboard如果翻譯成儀表盤的話，總覺得不大容易理解，所以我在這裡把它翻譯為數據可視化。數據展示方面的設計，相信大家會經常用到，這篇文章有很多簡單直接，立馬就能用上的幹貨，一起來學習吧！

為什麼數據可視化設計非常重要？

數據可視化的目的是以一種用戶更容易理解的形式呈現複雜信息。

一個優秀的數據可視化界面包含以下幾個關鍵要素：

• 清晰：一個好的數據可視化界面一定是能夠清晰的展現用戶所需要的信息。當用戶看到界面内容時，應該能在5秒内了解到它的用途，而不是花費至少幾分鐘才能理解各個數據的含義。
• 有意義：一個有用的數據可視化界面上的每一條信息都應該是有意義的，這些有意義的信息能準确傳達設計師想要表達的内容，每一條數據的背後，用戶應該都是可以讀懂的。
• 一緻性：優秀的數據可視化界面，會有一套非常嚴謹一緻的版面，這裡的一緻性需要考慮到布局，結構和内容。
• 簡單：複雜的界面違背了數據可視化設計的初衷，如果一個信息呈現不夠簡單直接，那麼肯定是在設計上出現了問題。

如何設計一個數據可視化界面？

數據可視化界面設計最重要的步驟是需要了解目标用戶是誰，能為他們提供什麼價值。了解目标受衆的知識背景和理解水平能幫助你做出對他們有價值的設計。

在了解目标用戶時，有必要了解受衆感興趣的數據類型。

“專注于用戶的需求，更容易産生他們喜歡使用的結果。”

目标用戶級别可能會在一級和另一級之間變化，這是一個挑戰性的點。與其他任何設計項目一樣，可以細分受衆并将信息相應地分為基本内容和高級内容。

在界面中表示一組信息有多種方法，選擇正确的數據指标是設計數據可視化的另一個關鍵元素。這也與目标用戶的偏好有關，即他們希望看到什麼樣的信息。

“根據需要設計數據可視化界面，為不同的業務使用不同類型的展示方式。”

下面是為目标用戶設計數據可視化界面時需要考慮的一些重要規則。

1. 區分層級

一個非常常見的錯誤就是設計師沒有對信息區分層級，所有的内容看起來都一樣重要。

可以嘗試使用組件的大小和位置來區分數據的層次結構。

• 通過定義信息層級，讓用戶清楚什麼是最重要的；
• 在左上角顯示更重要的信息，沿着對角線方向，信息的重要程度應該依次減弱，右下角的信息重要性最弱；
• 還可以将信息劃分為不同類别，并在不同的視圖中顯示它們。

2. 簡單易懂

數據可視化的真正目的是用一種更方便理解，更簡單的形式來傳達複雜信息。

• 不要放一些大多數用戶都難以理解的信息
• 使用更少的列來顯示信息
• 删除冗餘内容來減少混亂

3. 一緻性

使用一緻性布局設計的數據可視化界面看起來更好。

• 為了使界面更容易閱讀，可以在信息組之間使用類似的可視化效果。
• 把相關的信息放的更近一些。
• 對相關内容進行可視化分組。

4. 臨近原則

在界面中把相近的信息放在一起可以幫助用戶快速理解。

• 把相關的信息放的更近一些
• 不要将相關信息分散在界面上
• 對相關内容進行可視化分組

5. 對齊

可視化組件元素需要在視覺上對齊，并保持視覺平衡。

• 将可視化組件元素在視覺上進行對齊，可以将界面組織的更好；
• 嘗試将組件元素進行網格布局設計；
• 不對齊的界面會給用戶帶來糟糕的體驗。

6. 留白

留白是為了讓界面有呼吸感，它使得用戶在使用你的界面時能夠有出喘息的空間。

• 當用戶查看需要的信息時，界面中的留白能夠吸引用戶的目光，提升用戶體驗；
• 減少留白會使用戶的界面變得混亂；
• 使用留白能對信息進行可視化分組。

留白太少簡直就是在鼓勵你的用戶盡快離開

7. 顔色

使用有效的配色方案來吸引用戶的注意力，幫助他們輕松地浏覽信息。

• 仔細選擇顔色，目标是使内容易于閱讀。
• 使用大對比度來顯示背景上的視覺元素。

避免使用低對比度和低效的漸變

8. 字體

标準字體是可視化界面中的最佳字體，除非有特别的理由，一般不要用其他字體。

• 使用标準字體，因為它們更容易閱讀和掃描。
• 特别和美術字體可能看起來不錯，但很難理解
• 避免所有的大寫字母文字，因為它很難閱讀，人類的大腦需要時間來消化它。
• 使用合适的字體大小和風格，有效地傳達信息。

不要使用影響可讀性的字體

9. 數字排版

顯示精度超過要求的數字使它們難以閱讀和理解。

• 必要時使用整數，因為長數字會使用戶混淆；
• 省去不必要的信息；
• 讓用戶能夠容易地比較簡單的差異細節。

10. 标簽

使用能夠快速有效地向用戶傳達所需信息的标簽。

• 避免使用帶旋轉的标簽，因為很難閱讀；
• 盡可能的使用标準的縮寫。

避免旋轉标簽

總結

數據可視化旨在節省時間和精力，将複雜和抽象的數據以更簡單的形式表示，目的是以用戶能夠理解的方式将關鍵信息傳達給他們，确保自己理解用戶所需，并給他們需要的信息。

原文：https://medium.muz.li/10-rules-of-dashboard-design-f1a4123028a2

作者：Saadia Minhas

譯者：彩雲sky，公衆号：彩雲譯設計

本文由 @彩雲sky 翻譯發布于人人都是産品經理。未經許可，禁止轉載

題圖來自Unsplash，基于CC0協議

,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!

查看全部