大屏可視化現(xiàn)在在很多公司都廣泛應(yīng)用，下面雖是一篇老文，但是方法論還是不錯，可以借鑒的

下圖為參與過的項目大屏主要部分

圖中數(shù)據(jù)由于安全保密性，具體文案都作了處理

先給大家講下大屏自身的特點：
1.面積巨大——用戶站遠才能看全內(nèi)容（所以字也不能設(shè)計很?。?br>2.深色背景——緊張感強，讓視覺更好的聚焦，省電
3.不可操作——大屏主要用來給來賓觀看的。來賓一般不會直接操作大屏
4.空間局限——大屏不像網(wǎng)頁有滾動條，它的長寬都是固定的
5.單獨主題——每塊大屏都有具體想給來賓表達某個主題

知道了這些，如果我們遇到一個具體的大屏項目，要怎么來設(shè)計呢？下面我將自己經(jīng)歷過的項目和思考過程和大家分享下

第一步、調(diào)查研究
需要調(diào)研的點：
1.大屏的主題——這個屏要個來賓看什么信息（要規(guī)避哪些信息）
2.數(shù)據(jù)的權(quán)威和準(zhǔn)確性——對具體要展示的信息進行數(shù)據(jù)的核對正常數(shù)據(jù)是多少，歷史上極限數(shù)據(jù)是多少
3.用戶的其他需求點——用戶說要用TOP10，但有時候只是用戶只知道TOP能表達，還有很多形式也能表示TOP的信息。

案例：
部門準(zhǔn)備做一系列專門描述特定業(yè)務(wù)場景的大屏。他們即統(tǒng)一（整體大風(fēng)格），又有區(qū)別（每個業(yè)務(wù)要有自己的特點）
我們?yōu)榱吮苊庠诤笃诖蠹矣酗L(fēng)格上的分歧而不斷修改造成項目的延期。決定盡快讓需求方確定風(fēng)格。
我們使用的快速可行性測試。目的是讓大家快速確定風(fēng)格。保證大家的目標(biāo)統(tǒng)一。

最后我們確定了緊張，科技，權(quán)威，豐富。并且會每個關(guān)鍵詞進行了專門的理解。
緊張：數(shù)據(jù)的實時，動效的變化
科技：新穎的圖表，新穎的動效
豐富：數(shù)據(jù)豐富，豐富層次感，圖表類型多，強烈的空間感
權(quán)威：安全元素。

接下來是對每個數(shù)據(jù)的check，知道每個數(shù)據(jù)代表什么，用什么展現(xiàn)最好。
從和業(yè)務(wù)溝通了解到，他們需要地圖，top10，餅圖，列表，數(shù)字，趨勢，這些圖表。這些能滿足他們目前所有的需求。

但是如果在所有的屏上都只放這些元素，展現(xiàn)上會缺乏很多新意，業(yè)務(wù)差別性也不好體現(xiàn)。所以需要對每個需求再剖析。

第二步、拆合分析
在這一步，需要重點做到以下幾點，幫助我們分析，理清思路。
1.拆分維度——將需求拆分到最小維度
2.確定優(yōu)先——選擇最佳數(shù)據(jù)來說明觀點。
3.合并維度——對維度元素進行歸類，化繁為簡。
4.最佳表現(xiàn)——確定用哪種表現(xiàn)形式來體現(xiàn)數(shù)據(jù)。

舉例：在做這一系列的具體某一個屏?xí)rA業(yè)務(wù)需要大屏展示的內(nèi)容：我們的業(yè)務(wù)針對特定區(qū)域的保護，正在實時防御著世界各地多類型的攻擊。能看到每個攻擊類型的當(dāng)天累加值和趨勢。
對于這個內(nèi)容，我們先進行拆分維度。你們能看到多少維度呢？（一定要拆到最小維度）

因為重點要表達的是我們防住了這些攻擊——表達這種自豪的情感。所以我們在來確定這些維度的主次優(yōu)先級。

看這些主要的維度有沒有可能進行合并呢？對這些信息進行相似度歸類，化繁為簡。關(guān)聯(lián)性最多的維度用同一種顏色表示，畫出所有的關(guān)系。

上圖表示，所有的維度互相關(guān)系。我們可以發(fā)現(xiàn)時間維度和所有的內(nèi)容都有聯(lián)系。但是時間又是個隱形的內(nèi)容，大屏上的數(shù)據(jù)為了表示緊張性，時間如果是實時展現(xiàn)的。那么這個維度在設(shè)計的時候不必要用某個具體的視覺元素來表現(xiàn)，是通過在時間節(jié)點上的動效變化來表現(xiàn)的。所以我們把這時間線去掉看效果。

效果清爽了不少，但是線還是很交錯的不方便閱讀和理解。對交錯關(guān)系的維度進行位置的調(diào)整。
攻擊類型：他和次要維度都有關(guān)聯(lián)
攻擊仿效：和保護點和地域有交錯

我們可以看到主圖的關(guān)系中。攻擊點是所有維度中關(guān)聯(lián)性最強的。供給量和攻擊類型可以是他的屬性。地獄是攻擊點和保護點的屬性。
這樣重點就是攻擊點到被攻擊點的過程了。

各類型日累計量可以通過計數(shù)器來表達。各攻擊趨勢可以通過趨勢圖來表現(xiàn)。剩下的就是怎么來設(shè)計這張地圖了。

第三步、規(guī)劃設(shè)計
在第二步的時候已經(jīng)將大部分分析工作都做完了，現(xiàn)在要做的是如何對這張地圖來表達我們的想給來賓傳達的信息。
在這塊主要是細節(jié)和感受的設(shè)計。設(shè)計順序：
1.模塊設(shè)計——長久考慮的模塊縱橫柵格布局設(shè)計還是不顧延展性把只為這一個屏的精致。
2.維度表現(xiàn)——具體維度用什么表現(xiàn)的確定。
3.動效設(shè)計——時間的把握和情感的控制。
4.數(shù)量控制——對實施數(shù)據(jù)的不可控性進行展現(xiàn)上的控制。考慮頁面最后出現(xiàn)的時候太密或太疏是用戶的感受。

大屏和其他顯示屏一樣，本身都是有固定分辨率的。一般是4*3的比例。在設(shè)計時考慮到通用性，可以優(yōu)先考慮1024*768。如果設(shè)計師追求更加極致的表現(xiàn)，可以根據(jù)每個大屏本身的像素塊的多少來設(shè)計。比如：1400*1050或5600*3150
考慮到同系列的屏幕會有相同展現(xiàn)形式，使用相同組件，可以對大屏進行柵格。

大屏是橫縱都固定的，可以采用橫縱都12柵格的方式。

在第二步中我們已經(jīng)確定只要重點在地圖上表現(xiàn)出不同緯度：地域，攻擊點，保護點，方向，攻擊大小，攻擊類型。
這些內(nèi)容就要運用到數(shù)據(jù)可視化的知識了。詳見如何設(shè)計數(shù)據(jù)信息圖
基本的表現(xiàn)形式有：大小，位置，形狀，顏色

對每個表現(xiàn)進行思考：
位置——地域：顯而易見。但是什么樣的地圖符合我們的場景呢？

如上圖，在考慮使用世界地圖還是中國地圖的時候發(fā)現(xiàn)業(yè)務(wù)上，國內(nèi)攻擊很多，而國外很少。而且需要看到的國內(nèi)的能到地級市，國外的到洲或者國家就行了，最后我們創(chuàng)新出了第三種，以中國為主的世界地圖來展現(xiàn)。

形狀——攻擊點，保護點，方向：作為體現(xiàn)情感的重點體現(xiàn)，可以對保護點做盾牌的形狀；攻擊點用普通的用戶能第一時間理解的感覺到的形狀比如圓（因為數(shù)量過多時展現(xiàn)最為清晰）；用有方向感的連線連接攻擊點和保護點來表示方向。
大小，顏色——怎么來處理呢？放在哪個維度上表現(xiàn)呢？

圓的視覺沖擊力最強，可以清晰的同時表現(xiàn)大小和顏色。所有把方案一、三、五排除掉了。
當(dāng)數(shù)據(jù)量很大的情況下，會有很多線出現(xiàn)，這是很難分清楚這些線是那些哪個線，線需要有顏色區(qū)別。所以排除方案二。
現(xiàn)在只剩下方案四和方案六：

上圖可以看出：方案六的情況下在看圓的時候會受連線粗細的干擾，連線之間也會被遮住從而干擾視線，所以確定用方案四。
確定好了這些表現(xiàn)方式之后，對每個表現(xiàn)方式做數(shù)據(jù)量化變現(xiàn)和動效的處理：

結(jié)論：每個維度，只用一種表現(xiàn)。即清晰又易懂。

第四步、檢查測試
1.REVIEW需求——過一遍需求是不是能夠滿足。
2.實地測試——將效果放上大屏，看是否方便閱讀，動效是否達到預(yù)期，色差是否能接受。
3.可信性測試——當(dāng)自己的講解員，給用戶講解大屏。能否一句話描述大屏，同時用戶能夠理解。
設(shè)計大屏一定是一個長期跟進的過程。有很多問題會在真正數(shù)據(jù)進來了，放在大屏上顯示才能發(fā)現(xiàn)。
在這個屏中我們改過的細節(jié)：
① tab的展現(xiàn)和圖例結(jié)合，省空間，同時方便理解。
② 線到達保護點之前攻擊點不消失（讓用戶能夠回述到攻擊源）
③ 保護點更加有動感，情感更加豐富，攻擊到達的時候才瞬間出現(xiàn)盾牌，攻擊結(jié)束后才漸變消失。
④ 在電腦上看整體地圖顏色偏暗，但是到了大屏上看效果正好。所以對地圖背景進行調(diào)暗。

希望這篇文章能幫助到做可視化設(shè)計，大屏設(shè)計的同學(xué)們。