<address id="ttjl9"></address>

      <noframes id="ttjl9"><address id="ttjl9"><nobr id="ttjl9"></nobr></address>
      <form id="ttjl9"></form>
        <em id="ttjl9"><span id="ttjl9"></span></em>
        <address id="ttjl9"></address>

          <noframes id="ttjl9"><form id="ttjl9"></form>

          折柱餅 +3 個套路,簡單圖表你真的會用嗎?

          2021-7-13    ui設計分享達人

          本文一句話概括:數據可視化中,如何用最簡單的圖表高效地傳遞信息。


          人人熟知的 3 類圖表

          看似簡單的 3 類常掛在嘴邊的「折柱餅」,你真的知道怎么使用嗎?

          @rubyxrli 在 紐約的Uber數據可視化大會上所做演講中提到: 
          根據我的經驗(基于原型研究超過10年)大多數可視化問題可以通過一些圖表來解決。很少情況下,需要你去想出一個全新的表達方式。像條形圖、折線圖、散點圖、透視表等「圖形化主力」真的很難被替代! 


          對于大部分的企業級產品使用者來說,基本的圖表類型,通常可以為大多數當前頁面的問題作出解釋,但是我們要做并不是簡單地調用一個圖表就結束了,如果想讓你的頁面更有效地傳遞結論、原因,可以讓使用者探索更多可能性,甚至去發現新的分析思路,那么首先你需要掌握下面的分析套路:


          3 個套路

          「對比,細分,溯源」,給簡單的圖表加點「戲」

          在數據分析中,分析思路一般可以概括為「對比,細分,溯源」,這也是《數據化管理》中提到六字箴言。首先我們來了解一下這六字箴言的具體含義:

          此處引用部分《分析思維 第三篇:數據分析的三板斧》內容


          1、對比

          對比分為橫向對比和縱向對比。

          · 橫向對比是指和“他人”比較,比如,兩個網站的用戶流失率;

          · 縱向對比是指按照某個維度,和“自己”比較。比如,這個網站上個月今天和這個月今天的用戶流失率。

          2、細分

          細分是指分維度、降低粒度來分析數據。

          · 分維度是指增加維度,比如,離職率按照部門維度來分析;

          · 降低粒度是指降低數據聚合的程度,比如,離職率不按年份,而按照月份來統計。

          3、溯源

          溯源是指在對比、細分鎖定到具體維度和粒度之后,依然沒有結論,那就需要查看原始數據或相關聯數據,洞察數據,從數據中尋找靈感。


          3x3 實踐

          第一個 3 代表圖表類型;第二個 3 代表分析套路。

          了解分析思維的三個套路后,可以嘗試在自己的圖表中檢驗打鉤。

          下面我用幾個例子來說明一下,如何打開圖表設計的腦洞:  


          折線圖

          通常在一個數據概覽頁面,人們都會使用一個折線圖,來表示一個關鍵指標的發展趨勢,當然這么做非常直觀,也非常準確。當我們為折線圖添加一個對比的維度,就可以使折線圖表達的內容更加豐滿。

          橫向對比

          可以是橫向對比“和他人比”。


          縱向對比

          也可以是縱向對比“和自己比”。


          添加輔助元素,強化關鍵信息進行對比

          G2Plot 為圖表提供了很多圖表輔助信息組件:https://g2plot.antv.vision/zh/examples/general/label

          例如:

          · 參考型組件:參考線、趨勢線、輔助區域等

          · 極值型組件:最高/低點、預警線等

          undefined


          細分維度

          通過右上角的 TAB 切換,提升和降低數據聚合的程度


          柱 / 條形圖

          橫向對比

          和別人比。


          細分維度

          將維度拆分進行分析。


          在使用柱狀圖/條形圖時,問問自己「對比」的呈現效果好嗎?

          這是使用者在使用柱形圖做對比時,經常遇到的問題:

          · X 軸類別數量過多,柱子非常密集

          · 軸文字標簽數量過多,文字在 45%旋轉后可讀性降低

          這時,設計者應該試著旋轉柱圖,把它變成一個條形圖。


          對比是好的,但不要做無用的對比


          餅 / 環圖

          縱向對比

          餅/環圖天生自帶「縱向對比」的性質,但是除了用一個餅/環圖之外,還有什么做法?


          細分維度


          溯源,顯示更多詳情幫助用戶定位問題


          合并極小值的維度,在有需要的時候做細分


          拓展:N x N 實踐

          第一個 N 可以代表圖表類型,也可以代表頁面,但需要是一個實體;

          第二個 N 代表分析思路,上文中提到的 3 個套路只是眾多分析思路中被總結出最為常用的,還可以根據不同業務場景的訴求去添加思路。

          這個矩陣的表格填出來后,除了可以幫助設計者檢驗是否高度利用了圖表區域之外,還可以總結出一份屬于自己業務場景的圖表指引,傳遞給下一個設計者使用。


          結語

          在企業級產品設計的領域中,用可視化的方式表達信息,讓數據不再枯燥難懂,是一種常見的設計手法。在真實的業務場景中,大部分用戶青睞 dashboard(報表頁面),來呈現「數據概覽」、「數據監控」、「數據明細」等信息,其中的重要組成部分即「統計型圖表」。如何恰當使用「統計型圖表」來實現用戶的分析目的? 這對沒有可視化基礎的制作者來說,還是有一定的難度。

          通過以下三步,讓用戶更高效地讀取重要信息,驅動業務決策,實現商業價值。

          本文用簡單直白的工具方法,為「零基礎」的圖表制作者提供一種簡單易學的思路,讓你的圖表在 Dashboard 里更全面、更有效地傳遞關鍵信息。


          藍藍設計建立了UI設計分享群,每天會分享國內外的一些優秀設計,如果有興趣的話,可以進入一起成長學習,請掃碼藍小助,報下信息,藍小助會請您入群。歡迎您加入噢~~希望得到建議咨詢、商務合作,也請與我們聯系。

          截屏2021-05-13 上午11.41.03.png



          文章來源:站酷  作者:Ant_Design

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.

          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

          藍藍設計www.syprn.cn )是一家專注而深入的界面設計公司,為期望卓越的國內外企業提供卓越的UI界面設計、BS界面設計 、 cs界面設計 、 ipad界面設計 、 包裝設計 、 圖標定制 、 用戶體驗 、交互設計、 網站建設 、平面設計服務


          日歷

          鏈接

          個人資料

          藍藍設計的小編 http://www.syprn.cn

          存檔

          亚洲va欧美va天堂v国产综合