數(shù)據(jù)可視化如何豐富頁面

此文章編寫的初衷是，很多群里小伙伴會問我踩萎，做可視化設(shè)計時畫面很空很钓，是如何處理履怯？本篇文章我會從四個角度進行分析~

前言

有許多小伙伴經(jīng)常會有這種疑問叹洲，我做的可視化設(shè)計為什么按著需求做了运提，可是為什么畫面卻被吐槽空闻葵，太簡單槽畔，不夠炫。因為在可視化領(lǐng)域會經(jīng)常存在誤區(qū)鳞尔，要把他們跟平面或者UI區(qū)分開寥假，拆解開來講霞扬∮髌裕可視化領(lǐng)域所注重的小伙伴們一定不陌生：字要大，顏色多一點乒疏，要酷炫怕吴，要科技感。沒錯這就是老板口中的設(shè)計伟件，但并不否認(rèn)斧账，這些點都說在了可視化的關(guān)鍵點上煞肾，但是想要更了解可視化如何制作籍救，我們需要從以下幾個方面去解讀數(shù)據(jù)可視化。

畫面裝飾線

靈活運用點線面構(gòu)成（可以單獨去找一下三大構(gòu)成中的平面構(gòu)成內(nèi)容）闪萄，科技感線條败去，不可太過顯眼而喧賓奪主圆裕，只求使畫面豐富荆几，透氣伴郁，不影響整體畫面效果。

下圖就是我選用的一種畫面裝飾線剂陡，并通過點線面等元素來設(shè)計成的一個畫面鸭栖。

模塊邊框

邊框的樣式很大程度決定了畫面的整體協(xié)調(diào)性，在邊框融入整體畫面的時候溅话，要考慮到與主視覺的協(xié)調(diào)性。一般邊框的顏色可以根據(jù)主視覺所展現(xiàn)出來的色彩傾向砚哆，從而進行選擇屑墨，最大程度上保持協(xié)調(diào)統(tǒng)一卵史。

分級邊框

分級邊框可以很大程度上切割大的模塊以躯，獨立的同時融于整體寸潦。由各種方塊分割社痛，同時選取最適合畫面的切割比例蒜哀。（大框套小框）

主視覺彈框

主要包括：主視覺撒點撵儿，地圖彈框淀歇，主視覺數(shù)字指標(biāo)，以及懸浮于地圖之上的分級菜單以及圖例牡直。

圖表的使用方式

文字加數(shù)字碰逸，文字是數(shù)字的描述饵史，數(shù)字是對文字的統(tǒng)計（可以著重展示數(shù)字，數(shù)字大湃番，文字小牵辣，一般可以上下結(jié)構(gòu)奴饮，或者結(jié)合圖形戴卜，特殊情況特殊對待）

凡是出現(xiàn)對比投剥，占比或者其他需要做對比的東西江锨，一般推薦用餅圖

出現(xiàn)多條數(shù)據(jù)啄育，多個維度，多角度進行比較的時候安券，一般推薦用柱狀圖（包含柱折圖）侯勉，出現(xiàn)趨勢铝阐，走勢等字眼時徘键，一般采用折線圖啊鸭。

圖表的表現(xiàn)形式

描邊，描邊可以虛線赂摆，虛線可以調(diào)整間距烟号，間距可以調(diào)圓角和直角。

發(fā)光达传，發(fā)光可以外發(fā)光宪赶，可以內(nèi)發(fā)光脯燃。

漸變辕棚，漸變可以線性漸變，角度漸變扁瓢，鏡像漸變引几。

填充赚哗，可以漸變填充屿储，可以純色填充够掠，可以填充有透明茄菊，透明度沒有透明面殖。

圖表的組件化

在你嘔心瀝血做完一兩個圖表的時候相叁，如果想讓他有更多的同風(fēng)格的東西，就好比做字體設(shè)計一樣椿访，所有字體都要寫完成玫，才是一套完整的拳喻，所以需要提煉該“字體”的細(xì)節(jié)舞蔽，或者說是與正常字體不同的地方渗柿，提煉出他的特殊樣式，再運用到其他的圖表當(dāng)中去颊亮，這個從0到1的過程终惑，我把它叫做組件化的過程门扇。在你多做了幾套組件的時候擦耀，就會覺得圖表可以千變?nèi)f化，但你還是能夠知道他是怎么利用基礎(chǔ)圖形變形而來的吉拳。看多了煤惩，做多了魄揉，網(wǎng)上看到好看的圖表洛退，一眼就能提煉出他的特殊點，再運用組件化思維降铸，真正的化為己用推掸。

再教大家一個方法驻仅，設(shè)計出一套組件的時候噪服，只有運用到項目中粘优，實現(xiàn)出來，才是一個成功的商業(yè)組件化過程（我自己做項目就是丹墨，看到好的設(shè)計贩挣，我下次做項目怎么我都要用上去）王财。此處指的不是抄襲裕便，而是提煉不同點闪金，運用到自己的組件中哎垦。