數(shù)據(jù)可視化與信息可視化淺談!

2022-12-20    seo達(dá)人


1.柱狀圖

2

適用場(chǎng)景:它的適用場(chǎng)合是二維數(shù)據(jù)集(每個(gè)數(shù)據(jù)點(diǎn)包括兩個(gè)值x和y),但只有一個(gè)維度需要比較。
優(yōu)勢(shì):柱狀圖利用柱子的高度,反映數(shù)據(jù)的差異。肉眼對(duì)高度差異很敏感,辨識(shí)效果非常好。
劣勢(shì):柱狀圖的局限在于只適用中小規(guī)模的數(shù)據(jù)集。

2.折線圖

3

適用場(chǎng)景: 折線圖適合二維的大數(shù)據(jù)集,尤其是那些趨勢(shì)比單個(gè)數(shù)據(jù)點(diǎn)更重要的場(chǎng)合。它還適合多個(gè)二維數(shù)據(jù)集的比較。
優(yōu)勢(shì):容易反應(yīng)出數(shù)據(jù)變化的趨勢(shì)。

3.餅圖

4

適用場(chǎng)景:適用簡(jiǎn)單的占比圖,在不要求數(shù)據(jù)精細(xì)的情況下可以適用。
劣勢(shì):餅圖是一種應(yīng)該避免使用的圖表,因?yàn)槿庋蹖?duì)面積大小不敏感。

4.漏斗圖

5

適用場(chǎng)景:漏斗圖適用于業(yè)務(wù)流程比較規(guī)范、周期長(zhǎng)、環(huán)節(jié)多的流程分析,通過(guò)漏斗各環(huán)節(jié)業(yè)務(wù)數(shù)據(jù)的比較,能夠直觀地發(fā)現(xiàn)和說(shuō)明問(wèn)題所在。
優(yōu)勢(shì):能夠直觀地發(fā)現(xiàn)和說(shuō)明問(wèn)題所在。在網(wǎng)站分析中,通常用于轉(zhuǎn)化率比較,它不僅能展示用戶從進(jìn)入網(wǎng)站到實(shí)現(xiàn)購(gòu)買的最終轉(zhuǎn)化率,還可以展示每個(gè)步驟的轉(zhuǎn)化率。
劣勢(shì):單一漏斗圖無(wú)法評(píng)價(jià)網(wǎng)站某個(gè)關(guān)鍵流程中各步驟轉(zhuǎn)化率的好壞。

5.地圖

7

適用場(chǎng)景:適用于有空間位置的數(shù)據(jù)集。
優(yōu)劣勢(shì):特殊狀況下使用。

6.雷達(dá)圖

8適用場(chǎng)景:雷達(dá)圖適用于多維數(shù)據(jù)(四維以上),且每個(gè)維度必須可以排序。但是,它有一個(gè)局限,就是數(shù)據(jù)點(diǎn)最多6個(gè),否則無(wú)法辨別,因此適用場(chǎng)合有限。
劣勢(shì):需要注意的時(shí)候,用戶不熟悉雷達(dá)圖,解讀有困難。使用時(shí)盡量加上說(shuō)明,減輕解讀負(fù)擔(dān)。

數(shù)據(jù)可視化使用小貼士
餅圖順序不當(dāng)

9

(最好的做法是將份額最大的那部分放在12點(diǎn)方向,順時(shí)針?lè)胖玫诙蠓蓊~的部分,以此類推。)

2.在線狀圖中使用虛線

10

(虛線會(huì)讓人分心,用實(shí)線搭配合適的顏色更容易區(qū)分。)

3.數(shù)據(jù)被遮蓋

11

(確保數(shù)據(jù)不會(huì)因?yàn)樵O(shè)計(jì)而丟失或被覆蓋。例如在面積圖中使用透明效果來(lái)確保用戶可以看到全部數(shù)據(jù)。)

4. 耗費(fèi)用戶更多的精力

12

(通過(guò)輔助的圖形元素來(lái)使數(shù)據(jù)更易于理解,比如在散點(diǎn)圖中增加趨勢(shì)線。)

5.柱狀過(guò)寬或過(guò)窄
13

(經(jīng)過(guò)調(diào)研,柱子的間隔最好調(diào)整為寬的1/2。)

6.?dāng)?shù)據(jù)對(duì)比困難

14

(選擇合適的圖表,讓數(shù)據(jù)對(duì)比更明顯直接。上圖的數(shù)據(jù)作用是為了比較,顯然,柱狀圖比餅圖在視覺(jué)上更易于比較。)

7.錯(cuò)誤呈現(xiàn)數(shù)據(jù)

15

(確保任何呈現(xiàn)都是準(zhǔn)確的,比如,上圖氣泡圖的面積大小應(yīng)該跟數(shù)值一樣。)

8.不要過(guò)分設(shè)計(jì)

16

(清楚標(biāo)明各個(gè)圖形表示的數(shù)據(jù),避免用與主要數(shù)據(jù)不相關(guān)的顏色,形狀干擾視覺(jué)。)

9. 數(shù)據(jù)沒(méi)有很好歸類,沒(méi)有重點(diǎn)區(qū)分

17

(將同類數(shù)據(jù)歸類,簡(jiǎn)化色彩,幫助用戶更快理解數(shù)據(jù)。上圖的第一張沒(méi)有屬于同類型手機(jī)中不同系統(tǒng)進(jìn)行顏色上的歸類,從而減少了比較的作用。下圖就通過(guò)藍(lán)色系很好的把iPhone,Android,WP版歸為一類,很好的與iPad版,其他比較。)

10.誤導(dǎo)用戶的圖表

18

(要客觀反映真實(shí)數(shù)據(jù),縱坐標(biāo)不能被截?cái)?,否則視覺(jué)感受和實(shí)際數(shù)據(jù)相差很大。左圖的數(shù)據(jù)起始點(diǎn)被截?cái)鄰?0開(kāi)始。)

信息可視化案例
信息可視化囊括了數(shù)據(jù)可視化,信息圖形,知識(shí)可視化,科學(xué)可視化,以及視覺(jué)設(shè)計(jì)方面的所有發(fā)展與進(jìn)步。下面是信息可視化的案例分享。
19
(上圖為關(guān)系網(wǎng)——基于60000封電子郵件存檔數(shù)據(jù),用不同顏色深度的線條呈現(xiàn)了地址簿中用戶和個(gè)體之間的關(guān)系,比如回復(fù)、發(fā)送、抄送。)

20
(上圖通過(guò)數(shù)據(jù)化的比較,用變形的柱狀圖等圖形,形象的展示了不同國(guó)家老師的收入水平,社會(huì)包括學(xué)生和公眾對(duì)其的尊重度。)

如何制作信息可視化?
第一步:確定表意正確明確信息圖表達(dá)內(nèi)容,確定最主要的表現(xiàn)內(nèi)容。
第二步:優(yōu)化展現(xiàn)形式內(nèi)容正確還不夠,還要易懂。我們需要在這個(gè)步驟里尋找信息圖最優(yōu)表現(xiàn)形式,讓讀者 一目了然,降低理解難度。
第三步:探索視覺(jué)風(fēng)格在探索視覺(jué)風(fēng)格時(shí)要注意抓大放小,先定下來(lái)最主要模塊的風(fēng)格,再做延展。
第四步:完善細(xì)節(jié)視覺(jué)風(fēng)格確定后,可根據(jù)需要添加、完善細(xì)節(jié)。
第五步:風(fēng)格延展“一致”的視覺(jué)設(shè)定有助于用戶理解,也能更好的提升品牌形象。所以主風(fēng)格確定后,我們需要把它延展到其它有需要的頁(yè)面上。

以上是分享了數(shù)據(jù)可視化和信息可視化相關(guān)內(nèi)容,不過(guò)信息可視化和數(shù)據(jù)可視化是兩個(gè)容易混淆的概念,基于數(shù)據(jù)生成的數(shù)據(jù)可視化和信息可視化這兩者在現(xiàn)實(shí)應(yīng)用中非常接近,并且有時(shí)能夠互相替換使用。但是這兩者其實(shí)是不同的,數(shù)據(jù)可視化是指那些用程序生成的圖形圖像,這個(gè)程序可以被應(yīng)用到很多不同的數(shù)據(jù)上。信息可視化是指為某一數(shù)據(jù)定制的圖形圖像,它往往是設(shè)計(jì)者手工定制的,只能應(yīng)用在那個(gè)數(shù)據(jù)中。信息可視化的代表特征:具體化的,自解釋性的和獨(dú)立的。為了滿足這些特征,這個(gè)圖是需要手工定制的。 并沒(méi)有任何一個(gè)可視化程序能夠基于任一數(shù)據(jù)生成這樣具體化的圖片并在上面標(biāo)注所有的解釋性文字。
數(shù)據(jù)可視化則是普適的,比如平行坐標(biāo)圖并不因?yàn)閿?shù)據(jù)的不同而改變自己的可視化設(shè)計(jì)??梢暬膹?qiáng)大的普適性能夠使用戶快速應(yīng)用某種可視化技術(shù)在一些新的數(shù)據(jù)上,并且通過(guò)可視化結(jié)果圖像理解新數(shù)據(jù),與針對(duì)已知特定數(shù)據(jù)進(jìn)行信息可視化設(shè)計(jì)繪制相比,用戶更像是通過(guò)對(duì)數(shù)據(jù)進(jìn)行可視化的應(yīng)用來(lái)學(xué)習(xí)和挖掘數(shù)據(jù),而普適性的數(shù)據(jù)可視化技術(shù)本身并沒(méi)有解釋數(shù)據(jù)的功能。

(感謝數(shù)據(jù)平臺(tái)組同仁們對(duì)此文章的貢獻(xiàn),感謝魏茜璐的視覺(jué)配圖。)

文章來(lái)源:京東設(shè)計(jì)中心

轉(zhuǎn)載請(qǐng)注明:學(xué)UI網(wǎng)》數(shù)據(jù)可視化與信息可視化淺談!

藍(lán)藍(lán)設(shè)計(jì)建立了UI設(shè)計(jì)分享群,每天會(huì)分享國(guó)內(nèi)外的一些優(yōu)秀設(shè)計(jì),如果有興趣的話,可以進(jìn)入一起成長(zhǎng)學(xué)習(xí),請(qǐng)加藍(lán)小助,微信號(hào):ben_lanlan,報(bào)下信息,藍(lán)小助會(huì)請(qǐng)您入群。歡迎您加入噢~~希望得到建議咨詢、商務(wù)合作,也請(qǐng)與我們聯(lián)系01063334945。


分享此文一切功德,皆悉回向給文章原作者及眾讀者.
免責(zé)聲明:藍(lán)藍(lán)設(shè)計(jì)尊重原作者,文章的版權(quán)歸原作者。如涉及版權(quán)問(wèn)題,請(qǐng)及時(shí)與我們?nèi)〉寐?lián)系,我們立即更正或刪除。


藍(lán)藍(lán)設(shè)計(jì)sillybuy.com )是一家專注而深入的界面設(shè)計(jì)公司,為期望卓越的國(guó)內(nèi)外企業(yè)提供卓越的UI界面設(shè)計(jì)、BS界面設(shè)計(jì) 、 cs界面設(shè)計(jì) 、 ipad界面設(shè)計(jì) 、 包裝設(shè)計(jì) 、 圖標(biāo)定制 、 用戶體驗(yàn) 、交互設(shè)計(jì)、 網(wǎng)站建設(shè) 平面設(shè)計(jì)服務(wù)、UI設(shè)計(jì)公司、界面設(shè)計(jì)公司、UI設(shè)計(jì)服務(wù)公司、數(shù)據(jù)可視化設(shè)計(jì)公司、UI交互設(shè)計(jì)公司、高端網(wǎng)站設(shè)計(jì)公司、UI咨詢、用戶體驗(yàn)公司、軟件界面設(shè)計(jì)公司



分享本文至:

日歷

鏈接

個(gè)人資料

存檔