百度商橋

在線咨詢

400-660-9989

uipower@uipower.com

UIPower大屏界面解決方案——為您打造不一樣的視界

發布時間:2018-02-02 11:16:16

title_qy.png


科技改變生活,也在改變我們看世界的視角。隨著通信、信息和顯示技術的高速發展,大屏行業已成為一個快速發展的新興產業,市場空間巨大,前景廣闊,廣泛應用于室內外需要進行服務和宣傳的公眾場所,數據也不再是存儲在電腦硬盤中冰冷的數字,也可以生動的展示給大眾,大屏顯示已成為城市亮化、現代化和信息化社會的一個重要標志。

UIPower經常會接到大屏設計的項目,比如卡斯柯大屏監測系統設計及開發、申能集團可視化大數據綜合展示平臺設計、視頻監控系統大屏界面設計、浙江運達風電信息化界面設計與開發等等。在項目過程中我們積累了大量的經驗,總結出大屏設計的特點及數據可視化的表達方式,今天就和大家一起分享交流~



title2.png


大屏顯示應用領域非常廣泛,有安防行業、數字標牌商用顯示、展覽、娛樂文化領域、演出和集會、體育領域、調度指揮中心信息顯示、證券交易、金融信息顯示,除此之外,在交通誘導系統,教育領域,機場航班、汽車站、港口、車站動態信息顯示等等也多有應用。


pic-1.png


調度指揮信息中心顯示



title3.png


隨著企業數據的海量積累,大屏數據可視化需求正在逐步擴大:一些監控中心、指揮調度中心需要依據實時數據快速做出決策;企業展廳、展覽中心需要數據展示平臺;電商平臺在大促活動時,通過對外公布實時銷售數據作為廣告手段;演示中心如會議廳、演播廳、購物中心、車站、機場需要通過大屏進行信息展示、宣傳廣告等等。數據大屏可視化的具體展示形式多種多樣,分為帶觸摸、交互式操作、單向信息展示等,已經被越來越多的企業應用。例如去年雙十一購物狂歡節,阿里采用的實時數據大屏,就帶給了觀眾更加準確、震撼和清晰的體驗。



title4.png


大屏幕顯示及大數據可視化的確有其特點,可以形成特定的設計語言。通過分析,確定設計的風格,有科技感,有的需要展示出豐富的信息層次、新穎的圖標和動效,有的是需要展示數據的權威性。

       1、布局柵格化

拼接的大屏尤其適合柵格化的設計。大屏上內容的模塊化可以任意拼接組成一屏畫面的形式,用柵格化的形式也可以發揮的很好。每一個模塊是一個單元格,彼此統一又獨立,可以放大和隨意擺放。每一模塊遵循統一的設計風格、UI規范。
       2 、色彩對比強,暗色為主
        在室內,如果色彩鮮艷、畫面動效不斷,就成了24小時長時間播放的電影,人的本能就會注意力集中在其上。在監控中心的工作人員,一排排桌椅直對著大屏,長期如此,工作人員會受不了的。因此,屏幕內容需要動靜之分;大屏以暗色為主,這樣人們的視覺更容易集中在亮色為主的信息之上。
        3 、地圖、線路圖及上面地點概況信息的設計、動效渲染。
        一個好的流程可以讓我們事半功倍,可視化的設計流程主要有分析數據、匹配圖形、優化圖形、檢查測試。

a)通過對原始數據進行標準化、結構化的處理,把它們整理成數據表。

b)將這些數值轉換成視覺結構(包括形狀、位置、尺寸、值、方向、色彩、紋理等),通過視覺的方式把它表現出來。例如將高中低的風險轉換成紅黃藍等色彩,數值轉換成大小。想要清楚地展現數據,就要先了解所要繪制的數據,如元數據、維度、元數據間關系、數據規模等。

c)將視覺結構進行組合,把它轉換成圖形傳遞給用戶,用戶通過人機交互的方式進行反向轉換,去更好地了解數據背后有什么問題和規律。這需要程序員和設計師配合。

d)大屏的實時效果是加入數據之后才能看到整體,是一個不斷的調整過程,進一步優化維度、動效和數量。

e)對于維度:每個維度,只用一種表現,清晰易懂;動效:考慮時間和情感的把控,從原來的1.5ms改為3.5ms。

f)最后還需要檢查測試,從頭到尾過一遍是否滿足需求;實地投放大屏幕后,用戶是否方便閱讀;動效能否達到預期,色差是否能接受;用戶能否理解。


newPic.png


科技感



title5.png


在真正了解PowerUI之前,先給大家介紹目前市面上主流的大屏開發技術:

1、首先要說的是WPF,WPF(Windows Presentation Foundation)是微軟推出的基于Windows 的用戶界面框架,一經上線就受到廣大程序員的熱烈追捧,雖然用WPF做出的界面效果可以很炫,但同時也伴隨著很多問題,我簡單說幾條:

a)   首先就是繪圖效率低。如果你使用WPF來做界面開發,肯定對這點痛心疾首,但又無可奈何,畢竟WPF的繪圖機制決定了它的渲染效率不會高,而且繪圖機制是不容易改變的。所以用WPF來制作界面,就意味著對大屏硬件設備有更高的要求,考慮到動輒成百上千萬的大屏硬件設備采購費用,可以說是非常不劃算的;

b)   其次WPF不支持Linux,畢竟WPF是微軟推出的,肯定是為微軟的Windows系統服務的,至于Linux系統完全不在他們的考慮之列。但是目前很多項目,包含科研院所、軍工類等,他們支持的系統只有Linux,因為安全是第一要素。Linux是開源的,在開源基礎上,可以做很多安全防護;而Windows系統,畢竟是M國的不是嗎,本文是技術討論,就不涉及政治了……要繼續強調的是,現階段除了上面提到的這些大型科研類或軍工類項目,也有很多公司為了適應客戶需要,采用Linux系統。

2、第二個要提到的技術就是現在很火的Html5,Html5技術現在這么火,我就不贅述了,涉及過或者正在使用Html5來做大屏UI開發的話,肯定會遇到這樣幾個問題:

a)    刷新效率低:大多數大屏界面開發都伴隨著大數據可視化,多數據多圖表展示,而Html5的數據獲取方式是基于web請求來獲取的,獲取的效率取決于后臺計算、網絡狀況等多個方面,很大程度上影響了數據刷新效率,從而影響數據展示的實時性,這一點是由于Html5自身機制決定的;

b)    展示效果單一、不靈活:Html5目前有Highcharts 和 Echarts ,提供了很多絢麗的“控件”,可以讓大屏展示更上一層樓。這里的“控件”我為什么要打上引號呢,原因很簡單,其實Highcharts 和 Echarts 里的控件并不是像我們理解的控件那樣靈活多變、效果豐富,他們使用起來沒那么靈活,而且性能低、也無法做到內存控制??丶摼哂械膶傩?,而他們都不具備,所以針對這些“控件”,如果你直接套用可以滿足最低要求,但是想做靈活定制,基本改變不了。

3、最后要給大家隆重介紹我們公司在大屏解決方案中運用的秘密武器—PowerUI,在大屏界面設計和開發過程中,它到底發揮了哪些強大的功能呢?

a)   強大控件庫:大屏界面展示需要復雜多樣的控件,PowerUI提供了上千種控件,任你挑選。與Highcharts 和 Echarts不同,PowerUI提供的所有控件都具有豐富的展示效果和界面樣式,并且可以根據需求靈活定制、隨意調整。接下來就給大家簡單地介紹幾種常用控件: 

   i.   地圖控件:大屏界面多數會采用地圖來展示數據,PowerUI提供多種地圖控件提升地圖展示效果;          


pic-3.png    


  ii.  圖表類控件:大屏界面數據化展示離不開圖表類控件展示,PowerUI的圖表類控件展示效果和界面樣式多樣;


pic-4.png


b)   渲染引擎:PowerUI具有自主研發的渲染引擎,繪圖采用純虛的圖像設備上下文對各種圖像宣傳引擎進行全面的支持;

c)    跨平臺:PowerUI SDK是界面運行支持庫,利用該SDK使得我們編輯完成的界面可以在不同的操作系統下運行,為這些界面和控件的運行提供支持;

d)   對WPF的支持:擁有PowerUI SDK ,我們可以支持Linux下界面開發,而且我們可以在一定程度上支持WPF,為WPF提供更多樣化的控件,必要的時候還可以遷移WPF控件,使WPF同樣具有跨平臺功能,可以支持Linux下界面開發;


PowerUI的功能太多太強大,我無法在這篇文章中一一介紹,如果想要詳細了解,可以直接上www.powerui.cn 官網查詢或者聯系UIPower客服。期待為您服務,打造不一樣的精彩視界!

{转码词},{转码词1},{转码词2},{转码词3}