前面三步做得再好，布局做不好，功虧一簣?。▌澲攸c(diǎn)?。。?/span>由此可見(jiàn)可視化布局及設(shè)計(jì)的重要性。如何做好可視化設(shè)計(jì)的頁(yè)面布局呢？

（1）聚焦：設(shè)計(jì)者應(yīng)該通過(guò)適當(dāng)?shù)呐虐娌季?，將用戶的注意力集中到可視化結(jié)果中最重要的區(qū)域，從而將重要的數(shù)據(jù)信息凸顯出來(lái)，抓住用戶的注意力，提升用戶信息解讀的效率。

（3）簡(jiǎn)潔：在可視化整體布局中，要突出重點(diǎn)，避免過(guò)于復(fù)雜或影響數(shù)據(jù)呈現(xiàn)效果的冗余元素。

   基于這三點(diǎn)精髓，再去著手設(shè)計(jì)與布局，方能收獲好的結(jié)果。在這里已經(jīng)整理出了7種大屏的設(shè)計(jì)與布局思路，同大家一起分享。

常規(guī)布局

左右布局

1. 常規(guī)布局

（1）布局要點(diǎn)：左中右。中間為主要指標(biāo)，占據(jù)頁(yè)面較大面積；左右兩邊為次要指標(biāo)，面積較小，較集中，展現(xiàn)指標(biāo)數(shù)量較多

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)

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)主次分明

三、異形屏

類型定義：比例不是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)多而全面