天天看點

資料可視化大屏設計思路,内附實際操作示範及模闆

當看到螢幕上一個個炫酷,具有科技感的資料大屏時,很多人都會好奇這是怎麼做出來的。自己在制作大屏時明明按着需求做了,可是做出來後總是覺得畫面不好看,不夠炫,感覺很糟糕。

那要如何才能設計出那樣的資料可視化大屏呢?本文以迪賽智慧數平台模闆大屏《職場薪酬情況》為例,介紹資料可視化大屏的制作步驟。

假設個人已經了解大屏的業務場景需求,由美工提供的設計稿或者是大屏整體展示效果圖,如下圖。

資料可視化大屏設計思路,内附實際操作示範及模闆

(職場薪酬情況-電腦端)

那就開始動手了,在制作大屏之前要準備相關的工作。一般來說,需要以下幾個步驟。

一、準備資料

我們需要準備好資料,通過分析圖表将其展示出來。這些資料包括要展示的業務場景的資料源及各分析圖表所需要的資料集等。準備好之後,在設計平台上傳或者設定路徑等,友善制作時調用資料。

資料可視化大屏設計思路,内附實際操作示範及模闆

【資料】欄裡,專業配置模式可支援從各種資料庫、表、檔案中選擇資料使用。

資料可視化大屏設計思路,内附實際操作示範及模闆

簡單配置使用,在右邊直接輸入或修改資料即可。

資料可視化大屏設計思路,内附實際操作示範及模闆

二、整理素材

即大屏所需要用到的圖檔,音頻、視訊及其它類型素材。比如背景圖檔,元件圖檔,标題裝飾圖等等。準備好這些,可以在平台系統管理頁的素材子產品裡上傳。

資料可視化大屏設計思路,内附實際操作示範及模闆

在制作時可以直接選擇使用。

資料可視化大屏設計思路,内附實際操作示範及模闆

三、排版布局和主題風格

根據設計圖,配置設定好大屏各資料子產品的布局和位置。

資料可視化大屏設計思路,内附實際操作示範及模闆

在主題風格方面,資料大屏平台會内置了豐富的主題樣式,使用者隻需要根據需求進行選用修改。

四、元件美化

将大屏架構和主題風格弄好之後,就可以對元件進行美化,綁定資料,設定元件外觀等。這樣可以使我們制作的可視化大屏更加美觀,更加酷炫。

因為資料大屏的主題風格主要以深色居多,是以在元件和文字配色上,應該用稍微明亮一點,淺色的顔色可以使圖表和文字更明顯,可以給觀衆醒目的視覺沖擊。

資料可視化大屏設計思路,内附實際操作示範及模闆

每個元件都可以在右邊的【屬性】欄裡使用調色版進行自定義顔色。

資料可視化大屏設計思路,内附實際操作示範及模闆

另外還可以給各個元件的小标題,添加增加多個裝飾性素材,合适的背景。這裡又從事先準備好的素材庫裡挑了個元素出來,效果如下。

資料可視化大屏設計思路,内附實際操作示範及模闆

其他元件也是使用相關的制作方法。根據設計圖一路拖拽下來,一張完美炫酷,具有科技感的資料大屏就做好了,下面展示資料大屏的手機版。

資料可視化大屏設計思路,内附實際操作示範及模闆

(職場薪酬情況-移動端)

如果你對大屏資料可視化感興趣,可以給我們點個關注哦,我們會繼續更新有關資料可視化的知識。

繼續閱讀