報表設計的目的是利用各類圖表組件，來呈現不同維度的數據，讓數據直觀美觀的展示出來，并通過數據挖掘數據背后的價值。

報表可視化設計需要結合業務邏輯，設計符合業務需求、頁面布局合理的界面，可視化報表要具備可用性、易用性、好用性的特點。

可視化報表設計規范

一個完整項目的UI視覺規范，通常包含以下幾個方面：

基礎配色、頁面布局、文字規范、圖標樣式、按鈕樣式、默認圖樣式、組件樣式。

在可視化報表設計中，我們把重點聚焦在頁面布局、色彩搭配、文字樣式和組件樣式上。

（視覺規范流程圖）

1.頁面布局：

根據實際需求，對頁面組件、元素進行排列組合，使頁面整潔美觀，設計時一般遵守以下四個原則:

①對比：避免元素太過相似。如果元素不同，就讓他們截然不同；

②重復：視覺要素在作品中重復出現，增加條理性和統一性；

③對齊：每一元素與另一元素有某種視覺聯系。另外觀清晰、精巧、清爽；

④親密性：彼此相關的項歸組在一起，建立一個視覺單元。組織信息、減少混亂、結構清晰親密性。

好的排版布局，可以清晰地看到組件之間的關聯關系，突出核心數據指標。

2.色彩搭配：

配色采用“1主2輔3其他”的原則，主色根據頁面風格確定，突出主題印象。

輔色選擇主色的對比色、平衡色，對比突出主色的特點，同時可以隱藏兩者的缺點，使畫面平衡。

最深色用在底部或陰影部分，增加頁面的厚重感。最淺色是光的部分，讓頁面有空氣感，輕薄透氣。

同頻色是選取與主色相近的顏色，豐富畫面的色彩構成，使畫面生動活潑，具有層次感。在畫面色彩的運用上，注意色彩的調和、對比、平衡、節奏與韻律。

3.字體樣式：

一般選擇方便閱讀的常規字體，中文字體如思源黑體、蘋方等；英文字體如Arial、HelveticaNeue等；避免選擇一些過于個性化的藝術字體，不便于閱讀，且有版權糾紛問題。

如要使用一些個性化的字體，請先關注一下是否有版權限制。系統中常用字體大小為：14px、16px、18px、20px、24px、26px、28px、30px、36px......常規默認的系統字體規范最小為12px。

4.組件樣式：

根據內容及整體布局，來調整組件內部的樣式，使整個布局和諧統一。

組件選擇上要符合業務需求，可以直觀快捷的展示數據內容。組件內部調整和整體風格保持一致，重點數據、核心內容要突出。

（產品部分主題效果圖）

可視化報表設計流程

1.溝通需求：

通過現場與客戶及項目負責人溝通，了解項目需求。結合企業特點、官網配色等、了解具體設計需求，進行案例展示。

2.初版設計：

進行設計構思，初步制定設計方案，開始做視覺設計。開始實施設計（確定配色、布局等風格）。

3.確認方案：

對細節進行調整優化后，跟客戶確認方案，收集反饋意見，進行修改。

4.制定規范：

制定統一的UI設計規范，同實施人員對接設計規范，其他頁面的風格效果圖參照模板進行設計。

可視化報表案例展示

基于可視化的設計規范和流程，用Desktop制作出來的數據可視化大屏案例：

（產品落地效果圖）

數據可視化的需求在不斷增加，好的可視化展現可以準確、高效地傳遞信息，方便用戶提取信息，降低用戶的決策成本，釋放出數據價值。