說到大屏，雙十一的大屏肯定不陌生吧！

接下來，我們來討論討論，數據可視化大屏如何設計吧！

拼接大屏：大屏幾乎都是拼接屏，UI設計時不用考慮屏幕縫隙影響內容的呈現，內容不會丟失，但有可能影響視覺的表現，例如一個很大的人物圖像被縫隙正中“劈成”兩半，或者“劈中”了眼睛，看起來很不舒服，所以設計時可以建立縫隙位置的參考線避免類似情況發生。（現在企業常用的有無縫隙、1.7mm縫隙、3.5mm縫隙、三種拼接大屏，縫隙越小越貴）

設計尺寸：拼接的每塊小屏一般是16:9的高清屏，設計尺寸可以把上下高度設定為1080px，長度按照拼接屏的數量比例得出長度的設計尺寸。例如3乘5的一塊大屏幕，高度3塊屏設為1080，每塊高就是360，360除9乘16等640，640就是一塊屏幕的長度，640乘5塊屏＝3200最后得出設計稿尺寸就是：高1080px乘寬3200px（在這里感謝我的數學老師）

拼接屏設計尺寸圖解
視覺設計：首先了解需求，整合數據，分析出主要數據次要數據、總量數據細分數據、各數據的維度等等，通過了解這些可以先設計出一個布局模版，也可以在紙上畫出來，布局可以在設計過程中隨時調整。

設計的風格，背景色一般用深色調，深色調緊張感強，讓視覺更好的聚焦，大屏暗色調看上去更柔和舒服不刺眼，也會較省電。

大屏設計跟網頁不一樣，頁面不能有滾動條，大屏的長寬都是固定的。

字號跟網頁設計一樣不小于12號字，可以用于圖表的標注，數據信息建議14號字以上，大屏觀者遠距離才能看全內容，所以字號可以稍大一點。字體不一定只用一種，可以用到一些科技感強的字體，這里要注意，記得把字體給開發一份。

設計完成先去大屏上看一下效果，大屏的品質不一樣色調也會有很大的差別，要根據自家的大屏呈現效果做調整。
交互設計

我把大數據可視化大屏分為兩種，一種“純展示型”另一種“展示＋功能型”，具體怎么區分！

純展示型幾乎沒有交互，后臺錄入數據，在大屏上展示就行了。

展示＋功能型，例如實時監控數據、采集數據、數據對比功能、云計算數據、分析與預警等等。

這里就著重說一下帶有功能型的大屏產品的結構層（信息架構）。一切功能結構都要圍繞核心數據主頁面來架構，因為大屏展示的核心就是將一些業務的關鍵指標數據以數據可視化的方式展示出來。

1. 設計稿投到大屏上顯示效果不佳怎么辦？
大屏的分辨率、比例、使用環境、投射方式等均會對設計造成影響。理想情況下，我們應該在設計開始前，就能打開大屏系統做一些簡單測試。我們可以從網上收集不同設計師不同風格的大屏設計作品，然后投上去查看實際效果。

因為大多數時候大屏都會存在色彩偏差，這時通過測試我們就能發現漸變色、鄰近色等不同類型的色彩搭配是否可以在目標大屏上良好呈現。如果不可以，那我們設計進行時就不要使用顯示效果不佳的色彩搭配。另一方面，樣圖溝通環節及時測試也很重要。

2. 大屏設計定稿后，切圖切幾倍圖？
由于是將我們電腦屏幕投射到了大屏，大屏上的內容是運行在我們電腦瀏覽器上的頁面。所以切圖根據我們電腦的分辨率，正常切1倍圖就可以。

3. 1920*1080的設計稿，投到9000*4320的屏幕上，文字圖片會發虛么？
看情況，視大屏系統硬件規格與觀看距離來定。這塊有四個概念需要跟大家交流下：大屏邏輯分辨率（設計稿尺寸）——顯卡輸出分辨率——視頻矩陣切換器（DVI）支持分辨率——大屏實際物理分辨率。

一般后兩個是沒問題的，大屏跟矩陣切換器是由大屏廠商提供，一般剛好配套大屏。容易問題的是顯卡輸出分辨率，我們電腦屏幕分辨率并不是最終顯卡傳遞到DVI接口的分辨率，傳遞到DVI接口的分辨率是電腦顯卡所能輸出的最大分辨率（部分電腦可設置或自定義輸出分辨率）。

輸出分辨率等于DVI支持分辨率時顯示效果最佳；輸出分辨率低于DVI支持分辨率，DVI會將信號放大后傳遞到大屏，放大的過程中就有圖像信息丟失，雖然此過程中有各種算法支持去保證圖像盡可能清晰，但算法再好，跟真實圖形還是有差距的。

此外，多信號源投射效果優于單個信號源投射。對于現場直播數據大屏，一般至少有兩個信號源，一個投屏，另一個也投屏但是處于備用狀態。

離大屏的距離也影響觀感，一般離得近，顆粒感明顯，距離稍遠，會顯的較為清晰。

4. 設計稿完成開發后，發現在大屏上頁面有被拉伸或者壓縮的情況，怎么補救？
一般來講，開發只需要對設計圖做還原即可。但特殊情況下，比如顯示器擴展不正確導致頁面被拉伸或壓縮，這時就需做處理：我們可以先得到被拉伸/壓縮的比例，然后對整體視圖做壓縮/拉伸處理，再由其拉伸/壓縮，這樣被拉伸/壓縮的瑕疵就可以得到一定程度上的矯正。

另外，了解被投電腦硬件特點，有的電腦可以通過自定義分辨率解決這部分問題。

5. 除自行開發可視化大屏外，還可以通過哪些第三方服務來快速實現？
比如億信華辰數據可視化平臺的酷屏。

6. 數據可視化的圖表樣式可以在那些地方找到參考？
所有的圖表樣式都是基于代碼實現的，可以作為我們設計圖表的參考，也可以讓開發拿代碼去用，或者在這些圖表的基礎修改

工具類的需要有一定的代碼基礎，里面同樣有豐富的圖表，所以跟開發的溝通也很重要，因為他們可能會了解多一些更新的前沿的圖表形式是我們設計師不知道的，所以彼此多溝通交流是在太重要了。
所以，大屏應該怎么做，你知道了嗎！