<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>

          讓數據更有趣!全面總結圖表設計的思路和方法

          2021-8-25    seo達人


          1.選擇正確的圖表類型

          選擇錯誤的圖表類型,或默認使用最常見的類型,可能會混淆用戶對數據產生誤解。

          一組數據可以有多種表示方式,具體類型取決于用戶希望看到的內容。

          圖片

           

          2.根據正負值確定方向

          當數據中出現正負值時,要先確定基線的位置,再確定數據位置,將正值分布在基線上側(X軸)或右側(Y軸),負值分布在下側(X軸)或左側(Y軸)。

          避免在基線的同一側同時添加正值和負值,造成用戶對圖表信息理解錯誤。

          圖片

           

          3.始終從零開始繪制條形圖

          單看左側的條形圖,能發現B的值比D的值要多3倍以上,但在右側從零開始的條形圖中,實際差異要小得多。從零開始可確保用戶獲得更準確的數據展示。

          圖片

           

          4.折線圖使用自適應Y軸

          對折線圖來說,如果始終將Y軸的比例限制為從零開始,一旦數據波動幅度很小,那整個折線圖會看起來很平坦,效果不明顯。

          圖片

           
          折線圖主要用來表現趨勢,根據給定時間的數據調整比例,并保持折線區域能占到Y軸范圍的三分之二。

           

          5.使用折線圖時考慮時間間隔

          折線圖是由一條條小線段連接組成,這些線段展示了在短時間內數據是如何變化的。當時間間隔很大或數據更新不頻繁時,就要慎重考慮是否使用折線圖。

          例如想表示年收入,左側的兩個折線圖樣式都不太合適,每個月的收入是固定的數字,而折線圖展現的數據更像是收入的變化,相反右側的條形圖更適合來展示每月具體的收入。

          圖片

           

          6.不要使用平滑的折線

          平滑的折線圖可能看著很舒服,但它們歪曲了背后的實際數據,而且過粗的線條掩蓋了真正的節點。

          圖片

           

          7.謹慎使用雙軸折線圖

          當兩組數據出現X軸代表的信息相同但Y軸不同時,為節省空間我們可能會考慮用雙軸圖。

          但大部分雙軸圖難以閱讀,只是感覺圖表上有很多數據,但遠遠沒有單個圖表展示的清晰。

          圖片

           

          8.限制餅圖的切片數量

          餅圖是最受歡迎但經常被誤用的圖表之一。在使用餅圖時,首先要注意切片的數量最好保持在5-7片。

          如果還有很多占比很小的切片,可以將這些全部歸到“其他”切片中。

          圖片

           

          9.直接在圖表上標注

          如果沒有正確的標注,無論圖表設計的多好看都沒有意義。

          直接在圖表上標注數據或信息對使用者來說更直觀,更節省時間和精力。

          圖片

           

          10.不要在切片上標注

          將數值放在切片上雖然很直觀,但可能會導致很多問題,例如左側餅圖數值的可讀性問題、切片太薄無法添加數值等,對比來看,右側餅圖添加標注的方式更合適。

          圖片

           

          11.餅圖切片的排序

          餅圖切片的排序是一個很容易忽略的問題,將餅圖切片只是一個開始,通過合理的排序保證用戶清晰觀看圖表才是關鍵。

          常見的排序方法是將面積最大的切片放在12點鐘位置,然后按順時針降序放置第二大的切片,以此類推。

          圖片

           

          12.避免隨機性

          同樣的建議適用于其他類型的圖表。盡量不要默認按字母順序排序,將最大值放在頂部(水平條形圖)或左側(對于垂直條形圖),以確保最重要的值占據最突出的空間,減少視線運動和閱讀圖表所需的時間。

          圖片

           

          13.避免極端的環形圖

          環形圖,又稱為甜甜圈圖,是餅圖的一種變體,本質是餅圖將中間區域挖空,用在多樣品間的多種數據的比較中。

          雖然環形圖騰出中間區域來顯示額外的信息,但犧牲清晰度走極端會讓圖表變得毫無用處。

          圖片

           

          14.讓數據自己說話

          不必要的設計樣式不僅會分散注意力,還可能導致用戶對數據誤解并產生錯誤印象,圖表在設計上應避免:

          3D元素、陰影、漸變;

          斑馬紋、過多的網格線;

          裝飾性過強的斜體、粗體或襯線字體。

          圖片

           

          15.選擇與數據性質匹配的調色板

          顏色是保持數據可視化有效的組成部分,在設計時考慮3種調色板類型:

          分類色板(左)適合顯示分類數據,當你想區別不連續且內在沒有順序關系的數據時可以使用這種類型;

          連續色板(中)適用于需要按特定順序放置的變量中,使用色調/亮度或兩者組合創建色板。

          離散色板(右)是兩個連續色板的組合,中間有一個中心值(通常為零)。不同的調色板會傳達正值和負值。

          圖片

           

          16.無障礙設計

          根據眼科研究中心的數據,大約每12個人中就有1個色盲,圖表只有在廣泛受眾可以訪問的情況下才是成功的:

          在調色板中使用不同的飽和度、亮度;

          黑白打印可視化圖表,檢查對比度和可讀性。

          圖片

           

          17.注重易讀性

          確保圖表排版在傳達信息并幫助用戶專注于數據,而不是分散注意力:

          選擇字跡清晰的字體,避免使用襯線和裝飾性很強的字體;

          避免使用斜體、粗體和全部大寫;

          確保文本與背景形成高對比度;

          不要旋轉文本。

          圖片

           

          18.使用水平條形圖代替旋轉標注

          這個簡單的技巧可以確保用戶能夠更有效地瀏覽圖表,而不會使他們感到緊張。

          圖片

           

          19.建立圖表庫

          如果你的任務是將交互式圖表添加到Web和移動項目中,那么首要考慮問題是將使用什么樣的圖表?

          基于定義的庫(Highcharts)進行設計將確保易于實現,并為我們提供大量的交互想法。

          圖片

           

          20.超越靜態報告

          通過更改參數、可視化類型、時間線幫助用戶進行探索,得出最大價值化的結論。例如IOS Health結合使用了各種數據表示來發揮優勢。

          圖片

           

          最后

          為大家收集整理了一波創意性的可視化圖表,來激發創作靈感,創造更多的可能性~

          圖片

          下載方式

          1)點個“在看”,星標公眾號“Clip設計夾”

          2)公眾號后臺回復“圖表”自動獲取下載鏈接

          —  The End  — 

          原文地址:Clip設計夾 (公眾號)

          作者: Clippp

          轉載請注明:學UI網》讓數據更有趣!全面總結圖表設計的思路和方法

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

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

          分享此文一切功德,皆悉回向給文章原作者及眾讀者.
          免責聲明:藍藍設計尊重原作者,文章的版權歸原作者。如涉及版權問題,請及時與我們取得聯系,我們立即更正或刪除。

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



          日歷

          鏈接

          個人資料

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

          存檔

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