資料視覺化大屏設計師，我不信你沒有這些困惑!(上)

作者：由 EasyV數字孿生視覺化發表于繪畫時間：2020-06-04

不知道大家做為資料大屏設計師，平時工作有沒有一些困惑。在去年畫了60多張大屏頁面之後，我失去了青春和頭髮，化解了一些對於資料視覺化工作的迷茫，我整理了其中的一些，希望能帶給大家一點啟發。我將主要圍繞這幾個方面來寫：

Let‘s go！

一、資料大屏究竟是什麼東西

——“沒有愧疚，真的太難定義了。”

身為一個數據視覺化產品的從業者，時常感到焦慮，因為這個行業一直都在發生著很快速的進化。

前一兩年，人們更多地使用“資料大屏”這個詞，可是近些時候，你再去觀察這個行業裡的優秀企業和入局者，他們都不約而同地弱化了“大屏”這個概念，取而代之是“數字孿生”、“大資料視覺化互動系統”之類的詞彙。相應地，產品形態也在發生著變化，從最開始“偏靜態的展示”，到現在的“強互動性”、“3D”、“影視級效果”、“遊戲化”。。。也許人類的終極目標就是像科幻電影裡一樣自如地操控資訊和資料吧。

2016年電視劇《人民的名義》；袋鼠雲大屏案例；2010年電影《鋼鐵俠2》

關於大屏，希望我們“資料視覺化設計師”，要有這樣的意識 —— 大屏只是一個硬體載體，我們可以往大屏上投放任何內容。我們真正在設計的，是一個“資料視覺化互動系統”，大屏、電腦、移動裝置、投影、VR。。。都可以成為這個“系統”的展示載體，而大屏，應該是目前大多數使用情景（監控、接待彙報）下最實用的。

不同大小的螢幕情景感受

當然，我們現在交流時還是習慣說“資料大屏”，但在2020年，“資料大屏”這個詞面背後所代表的產品設計形態，一定和以前有了很大的差別，其背後所包含的東西越來越豐富，早已不是“資訊圖表”這麼簡單了，我們要時常提醒自己，保持對資料視覺化產品的想象力。

最開始做資料大屏設計時，我經常在內心深處疑惑，為什麼企業會對“一群人圍著一塊巨大螢幕觀看炫酷PPT”的事情如此熱衷，現在的我“參悟”到，這件事情的本質是，如何更好地進行數字化建設成果的應用和展示，也就是如何跑好網上流傳的“

大資料的最後一公里

”。

關於“為什麼強烈地追求炫酷、科技感”，隨著業內一些宏大的、領先的概念產生，我漸漸理解，數字時代下的產品設計，本身就有無限可能，追求感官和互動體驗的升級沒有所謂的對錯。關於未來的數字產品，也許影視作品裡早就為我們勾勒了輪廓，從某種意義上來說，我們設計師掉光頭髮在畫的科技感介面，不過是在模仿“已有的想象”罷了。

2017年的電影《太空旅客》：大廳正在給男主全息演示星際路線

回到資料大屏的內容，當下流行的設計正規化是：一般以炫酷的地理空間資料視覺化為主體，周圍輔助以常規的圖表圖文。常規圖表的設計已經有了較為成熟的設計方法論和解決方案，目前各大廠商比拼得更多的是地理空間資料的視覺化效果，追求對真實世界的3D數字化重建，也成了視覺化大屏領域裡的一個趨勢。

圖片來源：袋鼠雲官網資料視覺化案例集合

我總問自己，中間為什麼總是地圖？也許正如視覺化領域流傳的那句話所說，“人類生活中所產生的資料，80%都和空間位置有關”，有了數字地圖，你就有了展示80%資料的載體。另外，感性點地說，只要有資料，在一塊螢幕裡，你可以從太空一直往下看地球，直到發現你小時候換下的扔在隔壁家房頂上的牙齒。這種一覽眾山小、世界盡在股掌之間的感覺，是不是很棒？這是用常規圖表做視覺主體不能達到的空間感的體驗。

之前用Easy［V］給一個客戶做的地圖下鑽效果的簡易demo

以上，便是我窺見的當下資料大屏設計的一面。

二、資料大屏設計效果如何落地

大家看到炫酷的設計效果，都會好奇發問“這怎麼開發落地啊”，我想說，其實天下設計師都是一樣的難，誰不是追著開發一起脫髮，但總有（暫時）實現不了的效果。

有一些觀點想和大家分享，首先，這是一個視覺化大屏專案的簡要流程：

其實，這就是普遍的網際網路產品的專案實施流程，簡單來說，就是產品經理出原型、設計師做好介面效果，逼著讓開發同事技術還原。對於普通的網頁應用、APP，這個流程並沒有太大的問題，一般設計師的設計效果都有了相對成熟的技術落地方案。但在資料大屏追求3D、高視效的設計趨勢下，傳統的網際網路產品專案流程就會存在類似這樣的問題：

你知道什麼叫做“黯然失色”嗎？這就是

設計師和開發之前會針對一些細節效果，反反覆覆地。。。撕扯，要承認，每一個細緻的效果，都需要時間去打磨，受限於技術手段、專案時間，我們往往對上線效果也有不少的無奈。有時候，也會用一些取巧的方式，例如，地圖部分不需要旋轉、縮放等互動時，對於一些流光、粒子的效果，會直接疊加圖片、影片上去，但在今天強調互動、動態地圖的行情下，這一招的弊端越來越大。

我想任何一個產品，從來都不只是設計的產物，而是市場、設計、技術、硬體等等因素綜合作用下的妥協產物。造成設計效果難以百分百落地的原因，我想根本源自設計和開發的隔閡，設計效果和技術方案無法完全重合，不帶技術邊界意識的設計，自然會有落地難的困境，技術當然可以探索突破，但專案是有時限的。

設計和開發合體全棧設計師，效果落地可能就事半功倍

面對這樣的困境，業內廠商的一個趨勢就是轉向遊戲開發的模式，設計師把控模型，與開發共同除錯把控渲染效果，在這種趨勢之下，廠商們開始研發自己的 3D 引擎或者啟用諸如Unity、Unreal等遊戲引擎，這樣往往能獲得更高效、更優質、更流暢的 3D 輸出。

對大多數大屏設計師而言，這樣的落地困境並不會很快被解決，但也不必懊惱，我想我們能做的有三點：

1、不斷精進自己的 3D 和動效設計技能來滿足行業要求。

任何炫酷的效果，只有先設計出來，才有被開發還原的可能。可以多關注一些基於 Web 的 3D 工具網站和技術，諸如 sketchfab、Vectary，瞭解當下 Web 端 3D 落地效果的行情，以此對設計軟體做出的效果和開發落地的效果有個差距感知。

2、保持對業內技術動態、工具的關注和了解。

例如webGL、three。js、3D 遊戲引擎、Ventuz等等，緊跟時代獲取靈感，如此一來你還可以鞭策推動開發同事 —— 我設計的這個效果，已經有公司/人實現了哦。

3、為什麼不借助第三方的資料視覺化大屏製作工具呢？

如果你在公司只是負責後臺UI設計、平面設計，甚至你都不是設計師，然後突然有一天公司來了個大屏需求，讓你一週搞出來上線，於是你加班補習資料大屏設計，但結果可能是效果勉強及格，開發實現也勉強及格。這樣偶爾一次的支援還好，但是你看見公司越來越多的地方出現了大屏、越來越多的部門說要要大屏，你感覺到了頭皮有點涼。

行業對視覺化設計師的要求越來越高，你難我難大家都難，與其硬剛白手起家，不如站在別人設計開發好的基礎上去設計吧！

突然插播的“安利”，但是相信我這不是一篇軟文！

關注我“資料視覺化EasyV”，帶你瞭解更多資料視覺化知識！

超好用的資料視覺化平臺EasyV免費試用

：點此申請免費試用

首先，這是袋鼠雲對外演示的最新案例集：

嫌影片太慢的我給大家截了一些圖：

重點來了！

這些大屏都是依託我們家的視覺化大屏製作平臺

EasyV

交付的：

關注我“資料視覺化EasyV”，帶你瞭解更多資料視覺化知識！

超好用的資料視覺化平臺EasyV免費試用

：點此申請免費試用

也就是，所有的地圖、圖表、互動都是透過這個平臺設計開發完成的，平臺提供了一套已經設計開發好的元件，直接供使用者新增、修改樣式、配置互動：

⬆︎ 元件工具一覽

⬆︎ 地圖元件下鑽

⬆︎ 自定義建模的模型地圖

為了減輕使用者的設計負擔，這些效果、風格，都是由設計師去一個個配置項調出來的。如果你基於這樣的基礎，再去做視覺化設計，我想你可以有更多的精力去研究指標和資料、去構思整個視覺化展示的故事結構，而不必總是去糾結某個樣式怎麼做才好看、設計出來了能不能落地，專案壓力瞬間減輕很多有木有？對於有設計能力的設計師，我想這些已經設計過一遍的元件，一定能減少你很多重複工作，讓你有更多參考和靈感去配置設計自己風格的大屏。

好了，收！再不停就真被當成廣告了，有興趣的盆友去試用探索吧~ 所有設計師和讀者，注意咯，EasyV的

免費試用

申請網址：

EasyV- 袋鼠雲

你以為打完廣告就結束了嗎？不！以下，是為了證明本文是乾貨，但很可能大家都去申請試用 Easy［V］而沒有被看到的更加精華的部分：

三、調研不積極，改稿到窒息

資料大屏的背後，是一個相對較新的行業，再加上面向企業的專案一般都會有保密要求，所以大家在做專案時都發現，找不到較成熟又對口的參考資料，這是資料視覺化設計師的困境，也是機遇，因為你在每一個專案中的探索，都是視覺化行業的先驅事蹟啊。基於這樣的背景，我想大家就要充分調研，仔細求證。

3.1現場調研：體感是感受出來而不是聽出來的

一般情況下，大屏設計是針對一塊位置、大小固定的螢幕進行設計，當使用場景一定時，我們就必須把硬體、空間資訊納入自己的設計考慮範疇，這方面，要像舞臺設計、PPT設計師一樣，充分考慮硬體和現場環境對螢幕內容的潛在影響。建議就是，如果硬體到位了（還有硬體沒到位的情況？是的，的確存在那種硬體都還沒定就被要求開始設計的情況），到現場出差，往那螢幕前一站，找找真實的體感。

其實，我剛開始也是很懼怕出差的，因為公司派我出差的時候，我腦子裡是這樣的畫面：