數據可視化大屏設計-金螳螂項目管理指揮中心-大數據項目

本次項目的難點在於除了把繁雜的數據圖形化出來，還要結合場景，經過各臺終端控制和指揮整個界面的交互呈現以及頁面切換方式。

本次項目的分享，在於整理本身作可視化項目的思路以及在項目中遇到一些實際狀況的處理應對措施，不足之處，歡迎你們一塊兒交流。

 

 

 

《量化信息的視覺表現》中概述了數據可視化最基本的設計原則：

 

圖表要簡潔，數據要簡潔。最好的大屏可視化不是數據的平鋪，不是設計的天馬行空，而是針對客戶場景，理解數據複雜性的基礎上，經過可視化的手段，造成一個高度提煉的故事。

 

咱們在項目調研、設計階段都要以簡潔、場景化爲出發點，在理解客戶複雜的場景、複雜的數據的基礎上，將故事簡化，爲客戶真正解決問題。

 

 

 

大屏建設目標

 

爲企業提供業務的更多可能性，經過展現讓客戶放心把項目交給咱們。

 

 

 

大屏使用環境分析

 

◍ 場景照片：

 

 

 

 

◍ 使用場景：項目管理指揮中心展廳

 

◍ 場景光線：總體偏暗，頂棚橫排平行於屏幕雙排射燈，測光深藍

 

◍ 屏幕狀況：非高清屏，拼接屏，中間對摺

 

◍ 方法與結論：根據場景的總體狀況，燈光對屏幕的影響比較大，關係到最終呈現的效果，中和射燈的反光、藍色的環境背景色，來決定設計的色調、純度和亮度。

 

 

 

目標用戶分析：

 

 

◍ 視覺感覺需求：

 

數據可視化在目標用戶眼裏大體歸爲：藍色變更的點線數及地圖，而且一再強調要動，頁面數字動、餅狀圖動、折線圖動、柱狀圖動…總之在他們眼裏，數據就應該是動的，必定要動的，全部的東西必須動起來，像美劇裏那樣，動 動 動...

 

 

 

 

 

設計目標：

 

一、以谷歌地圖爲場景佈局，更快、更直觀、更高效，展現項目宏觀位置信息等內容。

 

二、採用真實的實時數據動態呈現，使異常項目處理更精準和及時，引發觀看人員的體驗共鳴。

 

三、數據歸類處理，減小信息干擾。

 

 

 

◍ 設計元素提取：

 

 

◍ 顏色·字體:

 

 

 

 

◍ 總體色調色系的定義：

 

 

 

總體色調選擇的是冷色系偏灰，預警項目顏色分別爲飽和度較高的顏色，有助於異常報警項目、數據更加明顯易讀，不至於整個屏幕沒有視覺中心，突出主要數據的閱讀性。

 

定義全局色系時有幾方面的考慮：

 

一、根據用戶的使用場景（室內偏暗光線），總體顏色與整個室內環境有必定反差，把視覺關注點引入大屏區域內。

 

二、考慮到大屏面對的用戶年齡段跨度大，不一樣年齡段對顏色的接受程度不一樣，因此咱們選擇了藍色，藍色也是適應人羣比較廣的色。

 

三、環境內頂棚的射燈會對屏幕形成必定的反射光線影響，所以在總體顏色選擇上不能選用太灰的色調，不然會被射燈折射掉。

 

四、採用平常認知顏色（紅、橙、綠），經過不一樣的顏色與現實項目中傳達的信息概念吻合，下降用戶學習成本。

 

五、全局暗色調省電。

 

 

 

◍ 頁面佈局

 

 

 

 

 

 

效果圖展現

 

◍ 地圖設計

 

地圖採用谷歌地圖爲背景，實時動態數據、項目位置信息直觀展現：

 

 

 

 

 

 

 

 

◍ 部分效果圖展現

 

 

 

 

 

 

 

 

Ps:效果圖內數據及信息爲非真實，若有商業爲用，追究其法律責任。