一提到數(shù)據(jù)大屏，腦海中閃現(xiàn)的詞都是酷炫、科技感甚至賽博朋克，一個(gè)好的數(shù)據(jù)大屏除了要貼近業(yè)務(wù)挖掘數(shù)據(jù)價(jià)值，“高顏值”也是基本要求。 本著“我為人人”的原則，小億死皮賴臉求著咱們?cè)O(shè)計(jì)大神寫下這一篇大屏設(shè)計(jì)的保姆級(jí)教程，看了的人無(wú)不感動(dòng)落淚，受益匪淺。

布局篇開篇立意很重要 對(duì)于數(shù)據(jù)大屏來(lái)說(shuō)，布局一定是最先要考慮的，就像寫文章一樣，我們得先理清大綱和框架，從整體出發(fā)，結(jié)構(gòu)和功能分區(qū)都了然于胸，這就跨出了成功的第一步。 前期調(diào)研準(zhǔn)備

大屏可視化由于承載體的特殊性，有時(shí)候一個(gè)小小的差錯(cuò)會(huì)使得效果千差萬(wàn)別，如果客戶是4:3的屏，你大筆一揮設(shè)計(jì)成16:9的，那個(gè)壓縮效果不忍直視，怕是需求方要追著你打。所以做好前期調(diào)研很重要，包括大屏比例、材質(zhì)，在哪里演示，對(duì)何人演示，有什么目的等。 下圖是不同比例大屏的分布策略，可供參考：

構(gòu)圖布局走向

再者，設(shè)計(jì)人員需要明確大屏的視覺(jué)路線即展示路線，這條線能講出怎樣的故事跟你的布局構(gòu)圖密切相關(guān)。下面提供幾種常見(jiàn)的構(gòu)圖思路，希望對(duì)大家有所啟發(fā)和幫助。 1、中心放射型 以中間核心內(nèi)容向周圍放射，正中多以地圖和給人視覺(jué)沖擊的主視覺(jué)為主，起到聚焦凸顯的作用，層次明晰，主次分明。 2、故事線型 該類型主要是依靠建設(shè)一條完整的視覺(jué)導(dǎo)線，引導(dǎo)觀看者從一端往另一端吸收信息，該構(gòu)圖簡(jiǎn)單易懂，比較適合有嚴(yán)格順序的數(shù)據(jù)信息，例如企業(yè)的展示大屏等。 3、數(shù)據(jù)平鋪型 這是一種最為普遍的構(gòu)圖手法，一般是將同級(jí)別的數(shù)據(jù)信息一起展示出來(lái)，區(qū)塊清晰明確一目了然。但即使是平鋪，也是有輕有重，一般以板塊劃分的大小來(lái)界定分配。 配色篇亂花漸欲迷人眼

配色對(duì)于大屏來(lái)說(shuō)也格外重要，做得好就是神來(lái)之筆，做的不好就辣眼睛了；而且在做配色方案時(shí)還要充分考慮到行業(yè)特性及特定人群對(duì)數(shù)據(jù)圖表的可讀性。

對(duì)比明顯，展示清晰 在大屏設(shè)備中普遍用深色作為背景色，以減少屏幕拖尾，觀眾在視覺(jué)上也不會(huì)覺(jué)得刺眼。所有圖表的配色需要以深色背景為基礎(chǔ)，匹配以豐富的色系，滿足各類圖表的應(yīng)用場(chǎng)景。

除了與背景的配色對(duì)比外，圖表本身的顏色選擇也很重要，要利于業(yè)務(wù)信息傳達(dá)。選擇的顏色不要過(guò)于相近，這樣不利于數(shù)據(jù)間的區(qū)分，會(huì)降低閱讀舒適感。

色相選擇，拒絕迷惑

如果大屏需要的顏色較少時(shí)，避免使用相近的色相，即同類色和相近色；盡量選擇對(duì)比色或互補(bǔ)色，這樣可以使不同含義的數(shù)據(jù)在圖表中展示更加清晰。

當(dāng)圖表需要的顏色較多時(shí)，建議最多不超過(guò)12種色相。通常情況下人在不連續(xù)的區(qū)域內(nèi)可以分辨6~12種不同色相。過(guò)多的顏色對(duì)傳達(dá)數(shù)據(jù)是沒(méi)有作用的，反而會(huì)讓人產(chǎn)生迷惑。

善用漸變，創(chuàng)造光影

如果純色的配色方案都不太好的時(shí)候，我們還可考慮創(chuàng)建色調(diào)與明度變化都足夠大的自然漸變。

但是，使用漸變色時(shí)不要選擇一系列固定顏色，漸變配色結(jié)合不同色調(diào)會(huì)比較自然。無(wú)論你需要2種顏色還是10種，漸變中都能提取出這些顏色，讓可視化圖表感覺(jué)自然流暢，同時(shí)保有足夠的色調(diào)與明度差異。最后，還可加入一些粒子和流光的效果，讓整體更加炫酷。

細(xì)分行業(yè)，配色推薦

關(guān)于各細(xì)分行業(yè)的配色推薦，小億早在2018年就做過(guò)推薦，怕新來(lái)的朋友錯(cuò)過(guò)精彩內(nèi)容，再次把壓箱底的寶貝分享出來(lái)，不論是大屏可視化還是領(lǐng)導(dǎo)駕駛艙均可參考。

1、金融行業(yè)

億信華辰服務(wù)于銀行、證券、信托、金融租賃等金融細(xì)分領(lǐng)域，精耕細(xì)作15載，薈聚了超多的解決方案和案例，金融行業(yè)的配色可與金色相近，并盡可能選擇低飽和度的顏色，凸顯其專業(yè)和睿智。

2、保險(xiǎn)行業(yè)

保險(xiǎn)行業(yè)數(shù)據(jù)圖表需要有穩(wěn)定感、保障感，選用高亮度的圖表顏色可以產(chǎn)生安全放心，值得信賴的感覺(jué)。

3、稅務(wù)行業(yè)

億信華辰自2003年就與國(guó)家稅務(wù)總局聯(lián)手打造了涉稅數(shù)據(jù)應(yīng)用平臺(tái)，并實(shí)現(xiàn)了全國(guó)范圍內(nèi)100%覆蓋。在此，我們也給出了稅務(wù)方面的數(shù)據(jù)圖表搭配方案，用更加大氣、鮮艷的顏色來(lái)體現(xiàn)稅務(wù)數(shù)據(jù)的專業(yè)和專注。

加分篇3D可視化錦上添花

目前行業(yè)內(nèi)的大屏可視化產(chǎn)品，大致可以分為二維可視化和3D可視化。所謂3D可視化通常是通過(guò)游戲引擎來(lái)制作的可視化項(xiàng)目，能夠更直觀的展示立體數(shù)據(jù)，科技感極強(qiáng)，但制作成本也相對(duì)較高，要求我們具備視覺(jué)設(shè)計(jì)能力、數(shù)據(jù)表達(dá)能力、三維空間交互能力等。

從設(shè)計(jì)流程上來(lái)講，一般需先進(jìn)行靜態(tài)效果圖的設(shè)計(jì)生成初步的設(shè)計(jì)稿，這一部分需要視覺(jué)設(shè)計(jì)和建模相配合，然后再由3D建模師依據(jù)設(shè)計(jì)稿進(jìn)行實(shí)景的搭建，之后再進(jìn)行UI層面的設(shè)計(jì)調(diào)整，最后輸出視頻demo用于客戶演示和講解，最后付諸實(shí)施得以整體展現(xiàn)。