“數(shù)據(jù)可視化在本質(zhì)上是直接給到用戶探索分析的結(jié)果而不是讓用戶感受分析過(guò)程”
在現(xiàn)今數(shù)據(jù)驅(qū)動(dòng)的時(shí)代，可視化已逐漸成為數(shù)據(jù)分析的主要途徑，可視化大屏的廣泛使用便應(yīng)運(yùn)而生。很多公司及政務(wù)機(jī)構(gòu)，常利用大屏的手段展現(xiàn)其實(shí)力或演示業(yè)務(wù)，可視化的效果能讓觀者更快速的理解結(jié)果并直觀的看到數(shù)據(jù)展現(xiàn)。 因此，可視化大屏的優(yōu)勢(shì)顯而易見(jiàn)。
那么一個(gè)完整的數(shù)據(jù)的可視化，是如何完成的呢？
包括以下4個(gè)步驟：
1. 確定數(shù)據(jù)可視化的主題
2. 提煉可視化主題的數(shù)據(jù)
3. 根據(jù)數(shù)據(jù)關(guān)系確定圖表
4. 進(jìn)行可視化布局及設(shè)計(jì)

前面三步做的再好，布局做不好，功虧一簣?。▌澲攸c(diǎn)！?。?br> 由此可見(jiàn)可視化布局及設(shè)計(jì)的重要性。
如何做好可視化設(shè)計(jì)的頁(yè)面布局呢？
我們要遵循以下三個(gè)原則：
（1）聚焦
設(shè)計(jì)者應(yīng)該通過(guò)適當(dāng)?shù)呐虐娌季?，將用戶的注意力集中到可視化結(jié)果中最重要的區(qū)域，從而將重要的數(shù)據(jù)信息凸顯出來(lái)，抓住用戶的注意力，提升用戶信息解讀的效率。
（2）平衡
要合理的利用可視化的設(shè)計(jì)空間，在確保重要信息位于可視化空間視覺(jué)中心的情況下，保證整個(gè)頁(yè)面的不同元素在空間位置上處于平衡，提升設(shè)計(jì)美感。
（3）簡(jiǎn)潔
在可視化整體布局中，要突出重點(diǎn)，避免過(guò)于復(fù)雜或影響數(shù)據(jù)呈現(xiàn)效果的冗余元素。
基于這三點(diǎn)精髓，再去著手設(shè)計(jì)與布局，方能收獲好的結(jié)果。
小億在這里已經(jīng)整理出了7種大屏的設(shè)計(jì)與布局思路，同大家一起分享。
我們先按尺寸將大屏的類(lèi)型歸結(jié)為三大類(lèi)：標(biāo)準(zhǔn)大屏、超大屏、異性屏，再對(duì)每類(lèi)大屏的幾種布局方式進(jìn)行分類(lèi)展示：
? 標(biāo)準(zhǔn)大屏
? 常規(guī)布局
? 左右布局
? 超大屏
? 均等布局
? 故事布局
? 君臣布局
? 異性屏
? 縱向布局
? 繁星布局

一、標(biāo)準(zhǔn)大屏
類(lèi)型定義：分辨率1920*1080，比例16：9?
布局思路×2：

1. 常規(guī)布局

（1）布局要點(diǎn)：左中右。中間為主要指標(biāo)，占據(jù)頁(yè)面較大面積；左右兩邊為次要指標(biāo)，面積較小，較集中，展現(xiàn)指標(biāo)數(shù)量較多
（2）應(yīng)用場(chǎng)景：多數(shù)適用。如教育、房地產(chǎn)、政務(wù)等行業(yè)的數(shù)據(jù)分析展示，需要展示多項(xiàng)指標(biāo)，并突出某些關(guān)鍵指標(biāo)時(shí)適用
（3）優(yōu)勢(shì)：清晰展現(xiàn)較多的指標(biāo)，主次分明

2. 左右布局
（1）布局要點(diǎn)：重點(diǎn)區(qū)域擴(kuò)大，左或右放置少量指標(biāo)，不易展示大量指標(biāo)
（2）應(yīng)用場(chǎng)景：常用于地圖展示、三維模型展示，將重點(diǎn)區(qū)域擴(kuò)大。如智慧園區(qū)、智慧工廠、智慧城市等
（3）優(yōu)勢(shì)：能夠展現(xiàn)更多的圖像區(qū)域，三維模型的立體感更強(qiáng)

二、超大屏
類(lèi)型定義：比例16：9 ，面積更大，標(biāo)準(zhǔn)屏拼接或延展而來(lái)

布局思路×3：

1. 均等布局

（1）布局要點(diǎn)：按照1：1：1平均分配每一塊的展示區(qū)域
（2）應(yīng)用場(chǎng)景：常用于展示平級(jí)指標(biāo)
（3）優(yōu)勢(shì)：無(wú)明顯主次區(qū)分的指標(biāo)需要展現(xiàn)時(shí)，劃分區(qū)域，在視覺(jué)上不會(huì)過(guò)多干擾，平級(jí)展現(xiàn)時(shí)適用

2. 故事布局

（1）布局要點(diǎn)：沒(méi)有明顯的分割區(qū)域
（2）應(yīng)用場(chǎng)景：常用于講述一個(gè)完成的故事線
（3）優(yōu)勢(shì)：數(shù)據(jù)連貫性強(qiáng)，當(dāng)指標(biāo)間有關(guān)聯(lián)關(guān)系時(shí)，可以有邏輯地遞進(jìn)去展現(xiàn)

3. 君臣布局

（1）布局要點(diǎn)：中間大，兩邊小。中間為主要指標(biāo)，占據(jù)頁(yè)面較大面積，通常放置三維大圖；左右兩邊為次要指標(biāo)，面積較小，較集中，展現(xiàn)指標(biāo)較多
（2）應(yīng)用場(chǎng)景：需要展示多項(xiàng)指標(biāo)，并突出某些關(guān)鍵指標(biāo)或三維圖像時(shí)適用
（3）優(yōu)勢(shì)：圖像更大更清晰立體，指標(biāo)主次分明

三、異形屏
類(lèi)型定義：比例不是16：9?
布局思路×2：

1. 縱向布局

（1）布局要點(diǎn)：由于屏幕的原因，將頁(yè)面分割為上中下部分，中間區(qū)域較大，上下較小，重點(diǎn)突出中間區(qū)域
（2）應(yīng)用場(chǎng)景：在一些特殊的展會(huì)上使用
（3）優(yōu)勢(shì)：很好的適配特殊場(chǎng)景下的屏幕，主次分明，突出重點(diǎn)

2. 繁星布局

（1）布局要點(diǎn)：布局較為隨意，滿屏都是各種各樣的指標(biāo)，盡可能多地展現(xiàn)
（2）應(yīng)用場(chǎng)景：常用于日常運(yùn)維、監(jiān)管人員使用
（3）優(yōu)勢(shì)：展現(xiàn)指標(biāo)多而全面

以上，就是小億為大家?guī)?lái)的七種大屏設(shè)計(jì)與布局的思路。其實(shí)，大屏的設(shè)計(jì)是一個(gè)新興的設(shè)計(jì)學(xué)科，它同于APP頁(yè)面的設(shè)計(jì)，都需要考慮使用場(chǎng)景，再去確定布局方式，卻不同于網(wǎng)頁(yè)設(shè)計(jì)，需要結(jié)合它獨(dú)有的特征，定義布局設(shè)計(jì)流程及規(guī)范。大家學(xué)到了嗎？
上面介紹的這些布局中炫酷的大屏是怎樣制作的呢，想必一定會(huì)有人產(chǎn)生好奇。在這里，小億就向大家推薦這個(gè)好用的數(shù)據(jù)可視化平臺(tái)——酷屏。
酷屏是億信華辰自主研發(fā)的新一代數(shù)據(jù)可視化產(chǎn)品，可靈活、快捷地制作各類(lèi)交互式常規(guī)屏和大屏可視化，內(nèi)置百余種炫酷組件和3D特效，讓數(shù)據(jù)“躍然屏上”，得到更形象、更直觀的可視化呈現(xiàn)。
對(duì)于設(shè)計(jì)和布局方面，酷屏的一個(gè)重要優(yōu)勢(shì)就在于：能夠真正達(dá)到設(shè)計(jì)走多遠(yuǎn)，展現(xiàn)就能到多遠(yuǎn)的境界。方便開(kāi)發(fā)和實(shí)施人員快捷的完成頁(yè)面需求并最終得到好的展現(xiàn)。任何類(lèi)型的用戶想要達(dá)到的頁(yè)面效果及布局都可以使用酷屏分析快捷地制作實(shí)現(xiàn)。
我們的酷屏市場(chǎng)上現(xiàn)已有很多易用的模板，且配有完善的“保姆級(jí)”社區(qū)學(xué)習(xí)文檔，上手簡(jiǎn)單，完全不會(huì)做的同學(xué)也可以直接套用模板。總之，讓你分分鐘get炫酷大屏！

想要了解更多酷屏的功能和用法嗎，想要嘗試運(yùn)用不同的設(shè)計(jì)與布局思路作出適合于你的炫酷大屏嗎？快來(lái)我們的官網(wǎng)免費(fèi)體驗(yàn)SaaS版酷屏吧~