本次項目的難點在於除了把繁雜的數據圖形化出來,還要結合場景,通過各台終端控制和指揮整個界面的交互呈現以及頁面切換方式。
本次項目的分享,在於整理自己做可視化項目的思路以及在項目中遇到一些實際情況的處理應對措施,不足之處,歡迎大家一起交流。
《量化信息的視覺表現》中概述了數據可視化最基本的設計原則:
圖表要簡潔,數據要簡潔。最好的大屏可視化不是數據的平鋪,不是設計的天馬行空,而是針對客戶場景,理解數據復雜性的基礎上,通過可視化的手段,形成一個高度提煉的故事。
我們在項目調研、設計階段都要以簡潔、場景化為出發點,在理解客戶復雜的場景、復雜的數據的基礎上,將故事簡化,為客戶真正解決問題。
大屏建設目標
為企業提供業務的更多可能性,通過展示讓客戶放心把項目交給我們。
大屏使用環境分析
◍ 場景照片:
◍ 使用場景:項目管理指揮中心展廳
◍ 場景光線:整體偏暗,頂棚橫排平行於屏幕雙排射燈,測光深藍
◍ 屏幕情況:非高清屏,拼接屏,中間對折
◍ 方法與結論:根據場景的整體情況,燈光對屏幕的影響比較大,關系到最終呈現的效果,中和射燈的反光、藍色的環境背景色,來決定設計的色調、純度和亮度。
目標用戶分析:
◍ 視覺感受需求:
數據可視化在目標用戶眼里大致歸為:藍色變動的點線數及地圖,並且一再強調要動,頁面數字動、餅狀圖動、折線圖動、柱狀圖動…總之在他們眼里,數據就應該是動的,一定要動的,所有的東西必須動起來,像美劇里那樣,動 動 動...
設計目標:
1、以谷歌地圖為場景布局,更快、更直觀、更高效,展示項目宏觀位置信息等內容。
2、采用真實的實時數據動態呈現,使異常項目處理更精准和及時,引起觀看人員的體驗共鳴。
3、數據歸類處理,減少信息干擾。
◍ 設計元素提取:
◍ 顏色·字體:
◍ 整體色調色系的定義:
整體色調選擇的是冷色系偏灰,預警項目顏色分別為飽和度較高的顏色,有助於異常報警項目、數據更加明顯易讀,不至於整個屏幕沒有視覺中心,突出主要數據的閱讀性。
定義全局色系時有幾方面的考慮:
1、根據用戶的使用場景(室內偏暗光線),整體顏色與整個室內環境有一定反差,把視覺關注點引入大屏區域內。
2、考慮到大屏面對的用戶年齡段跨度大,不同年齡段對顏色的接受程度不同,所以我們選擇了藍色,藍色也是適應人群比較廣的色。
3、環境內頂棚的射燈會對屏幕造成一定的反射光線影響,因此在整體顏色選擇上不能選用太灰的色調,否則會被射燈折射掉。
4、采用日常認知顏色(紅、橙、綠),通過不同的顏色與現實項目中傳達的信息概念吻合,降低用戶學習成本。
5、全局暗色調省電。
◍ 頁面布局
效果圖展示
◍ 地圖設計
地圖采用谷歌地圖為背景,實時動態數據、項目位置信息直觀展示:
◍ 部分效果圖展示
Ps:效果圖內數據及信息為非真實,如有商業為用,追究其法律責任。