如何戰略性地規劃數據密集型 UX 設計

大數據正在膨脹。 然而，將復雜的數據需求與簡單、乾淨和有用的用戶界面相協調是當今任何 UX 設計師的考驗。 通常，設計（傳達信息的工具）會妨礙溝通（隱藏在原始數據高地的信息或意義）。

剝離信息將簡化和清理用戶界面。 但是對於數據驅動的應用程序，較少的數據通常意味著不太實用和有用的儀表板。

但是，保留所有可以使用的上下文數據會產生一個不可行的應用程序。

那麼，你如何達到正確的平衡呢？

應用程序如何呈現數據起著重要作用，這就是 UX 設計師的用武之地。

在這篇文章中，我將分享 UX 設計師可以用來開發簡單清晰的數據可視化的提示和技巧，即使在應用程序儀表板、網頁等應用大數據（以千兆字節計算的數據）時也是如此。

不過，我暫時不討論用於設計大數據應用程序的最佳語言。

如何設計客戶喜愛的出色大數據應用程序

也許最好的起點是詢問您的客戶是誰。

也許您已經製作了一個非常漂亮的儀表板並按時交付給客戶，只是讓他們問：“那麼，我在哪裡可以做 X、Y 和 Z？”

哎喲! 那一定很痛。

1. 使用用戶角色來設計有用的數據驅動儀表板

儘管人工智能和機器學習將不斷改進，但大多數組織仍需要人工干預來處理未分類的數據。

最好的用戶體驗設計師創造的產品將有助於為使用數據驅動應用程序的人解決問題。

他們是如何做到的呢？

Uber 和 Advanced Technologies Group 的高級設計負責人 Erik Klimcz 在 Medium 上分享了一些可行的技巧。 他建議用戶體驗設計師需要首先識別，然後定義每個項目的用戶或角色。

由於數據驅動的應用程序往往被組織內部或外部的多個角色使用，因此您需要識別這些角色，以便您可以組織信息架構線框和任務以滿足每個人的需求。

這將使設計對最終用戶有用，你的目標受眾——你的主要客戶。

這是一個插圖：

如果您需要了解如何為 UX 設計項目創建用戶角色的基礎知識，Cooper 提供了有用的提示（包括如何在此處為您的設計角色研究和收集數據）。

了解您的用戶/角色可以幫助您根據他們的需求定制應用程序的功能——這是最終目標。

此外，您還可以根據不同的客戶確定使用哪種類型的數據可視化工具，例如：

• 誰將處理數據（用戶角色）？ 例如，它是為客戶設計的還是為內部數據分析器設計的？
• 用例：這些用戶需要數據來幫助他們接下來做什麼？

例如：

您可以設計一種基於用戶個人條目填充信息的信息圖。

這種數據驅動的應用程序設計在用戶需要或免費上傳信息時會派上用場，因為他們需要或需要撤回信息以採取進一步行動。

一個例子是在客戶服務中，客戶服務代表可以輸入客戶的姓名或號碼以收集有關他們的更多信息，例如未解決的問題。

您可以在 Mahfix for You vs John Paulson 中找到這種類型的交互式數據可視化工具。 它允許您輸入一個數字，然後它會根據您的輸入報告回信息。 這很順利！

目標受眾和客戶
角色工作表

這個三頁的交互式 PDF 將幫助您找到您的受眾、審核您的內容並為您的業務制定一個遊戲計劃。 訂閱 Layout 以下載工作表！

免費下載工作表！

2. 可用性勝於風格：保持簡單、清晰和優雅

設計一個吸引你的有吸引力的用戶體驗很容易，但坦率地說，這對你的客戶來說是不切實際的。

為了可用，界面必須清晰。 用多產的 UX 設計師 Joshua Porter 的話來說，“清晰是第一要務”。

事實上，Joshua Porter 寫了一篇關於用戶界面設計原則的足智多謀的帖子——在設計大數據應用程序時仍然適用。

因此，為了提高可用性的清晰度：設計師應該使用自定義 UX 設計還是只使用經過驗證的可視化工具，例如折線圖？

這將取決於您的客戶/用戶案例。

更新的自定義數據可視化工具不斷湧現：信息圖表（靜態和交互式）、顏色編碼塊、動畫、3D 可視化等等。

但是，您實際上只需要四種數據表示工具：

• 用於說明連續數據的折線圖，例如隨時間變化的情況
• 用於顯示摘要信息的表格
• 用於顯示變量分佈和在區間內繪製定量數據的直方圖
• 用於顯示離散數據、比較變量和繪製分類數據的條形圖

然而，您可以超越可用性來創建一個有吸引力的數據處理界面。

這是一種方法：

更好的是，為數據密集型接口設計可以採取更簡單的方式：

在設計數據驅動的用戶體驗時，結合文本和圖表是提高清晰度的最佳方法之一。 用戶可以使用視覺效果並閱讀文本以提高清晰度。 但這種方法可能不適用於所有情況——尤其是對於大量未分類的數據。

3. 結合材料和平面設計——功能重於形式

這種設計理念更多地是關於可用性和極簡主義，而不是與流行的看法相反，一種沉悶的二維設計。 但扁平化設計既不乏味也不乏味。 你可以利用明亮的色彩、乾淨的邊緣和開放的空間。

對於移動應用程序、網站和桌面瀏覽器，特別推薦使用平面和材料設計。 由於該設計極簡且不會囤積大量額外數據（如以前的設計），因此加載速度很快，並且在旨在提高參與度時，可以幫助訪問者更長時間地查看頁面。

這對於數據驅動的網站或移動網站非常有用，它們可以受益於搜索引擎算法在互聯網上不斷掃描的移動友好、快速加載和更少的跳出率（SEO 和排名優勢）。

4. 美學上的可訪問性

這不僅僅是讓繁重的上下文數據變得流暢和吸引人（儘管這很有幫助）。 您還希望設計數據表示，使最終用戶可以輕鬆地：

• 清楚了解哪些數據最重要
• 理解所呈現數據的邏輯流程
• 了解數據的含義
• 了解下一步要採取的措施

我們如何分解這些元素中的每一個？

用戶應該知道哪些數據是最重要的

一個重要的 UX 設計原則是觀察和實現信息的層次結構——在這種情況下，是視覺層次結構。

換句話說，一種優先考慮正確指標的設計。

您希望首先組織、安排和優先考慮最重要的數據，然後再補充任何其他數據。 當然，優先順序會根據應用程序的用戶（來自上面定義的角色）而有所不同。

這樣做不僅可以整理儀表板，而且還有助於以一種易於理解、不那麼壓倒性的方式將用戶的注意力集中在對他們重要的事情上。

用戶應該能夠理解數據的邏輯流向

“簡單性在幫助用戶將數據與特定結果聯繫起來方面發揮著重要作用。 ”

與上一點討論的內容類似，您希望從整體數據的概覽網格開始。

您可以添加一個直觀的下拉菜單，當用戶單擊它時，它會向下滑動以顯示其他信息，然後是特定的任務或操作項。 人們喜歡這個，它已經越來越受歡迎。

這裡有兩種幫助流程的方法：

隱藏附加信息

您可以使用可點擊的鏈接或翻轉來顯示更多信息。 此外，滑動顯示數據和放大顯示等功能是包含附加信息或突出顯示關鍵數據點的好方法。 所有這些都使用簡單、自然的手勢。

這允許用戶點擊他們認為對他們的工作很重要的鏈接或翻轉，而留下他們認為不太重要的鏈接。

同樣，您將看到做體面的 UX 設計角色研究如何幫助您確定對哪個用戶和何時最重要的事情。

使用懸停動畫

您可以使用懸停動畫效果為（看似）枯燥的數據添加更多的活力、參與度和實用性。

懸停動畫特別適用於提供有關特定任務或項目的附加信息，同時有助於組織和清理數據驅動的應用程序。

儘管如此，仍有更多方法可以使用動畫來交付有用且引人入勝的數據密集型應用程序。

將信息隱藏在可點擊鏈接、幻燈片或翻轉後面的事情是，您在後端做的工作最多。 所以請記住，您需要從一開始就考慮到這一點來設計您的架構線框。

用戶應該能夠理解數據的含義

在儀表板上組織數據並確定其優先級後，下一步是將數據分解為單獨的頁面。 如果可以對信息進行分類，請務必為不同的數據包分配不同的頁面/屏幕。

這適用於小型和復雜的數據密集型應用程序設計項目，儘管它可能需要更長時間並且需要在後端進行更多工作。

根據上面的“壓倒性”主題，這樣做不僅可以幫助您的客戶/用戶減少不知所措，而且他們可能會更好地處理一頁上的數字，然後再繼續下一頁，一步一步地理解數據時間。

例如，任務控制 UI 可能會幫助您的客戶在一個頁面上獲取所有數據，但隨著時間的推移，它可能會讓他們不知所措——更不用說壓縮了，尤其是對於不同的屏幕尺寸。

通常客戶會要求使用這種類型的儀表板，但您應該更清楚。

任務控制 UI 可能看起來很複雜，但它不像之前討論的一次一頁的方法那樣流暢和易於使用。 前者可能很容易妨礙傳遞隱藏在所顯示數據中的含義。 這沒有用。

用戶應該能夠理解下一步要採取的措施

繼上述步驟之後，用戶可以更輕鬆地識別和關聯原始數據中的模式——這是為數據密集型應用程序設計時要爭取的另一個關鍵勝利。 當您使用的數據可視化工具幫助用戶理解大數據時，您就知道自己做得很好。

5. 留出改進空間

最後但並非最不重要的一點是，您需要使您的設計變得靈活。

隨著時間的流逝和用戶與您的設計互動，他們的反饋可以促使您採取行動並修復或重新設計整個事物。 沒有一種方法可以為處理數據創建完美的設計，因此保持設計敏捷可以幫助您進行持續改進或從堅實的補丁開始。

關鍵要點

用戶體驗設計的目的是以清晰和可操作的方式傳達信息。 這對於設計數據密集型應用程序尤其重要。 在這種情況下，良好設計的業務是幫助分析師或經理或最終用戶做出明智的決定。

如果用戶不能很好地理解原始數據及其呈現方式，他們就無法解釋和使用原始數據來為決策提供信息。

為數據量大的用戶體驗項目進行設計不應該像看起來那樣令人惱火。 上述提示和技巧可以幫助您弄清楚如何設計數據密集型接口。 只要記住：

1. 使用用戶角色來設計有用的數據驅動儀表板
2. 目標受眾和客戶角色工作表
3. 可用性勝於風格：保持簡單、清晰和優雅
4. 結合材料和平面設計——功能重於形式
5. 可訪問性高於美學
6. 留出改進空間

您有任何設計出色的數據可視化 UI 的首選技巧並願意分享嗎？

在下面的評論部分交給你。

網頁設計報告業務

今年，我們向 1,000 位領先的自由職業者、代理機構和創意人員詢問了構建網站、構建客戶服務和按時（全額！）獲得報酬的最佳方式。 從那裡我們處理數字，挖掘洞察力，並打包一份漂亮的報告，這樣您就可以停止猜測並開始擴展您的業務！

從本月開始，將您的網頁設計業務提升到一個全新的水平。 從像您這樣的其他設計企業那裡獲得見解，並開始為您的服務收取有競爭力的費用！