百度商桥

在线咨询

400-660-9989

uipower@uipower.com

数据可视化UI设计方法研究

发布时间:2020-01-02 13:44:18

数据可视化,是关于数据视觉表现形式的科学技术研究。那如何将海量数据通过可视化图形语言最为直观的反映给大众呢?我们凭借多年数据可视化设计的经验,降低了使用者阅读理解数据的门槛,同时用更为形象化的方式增强了企业的品牌竞争力与影响力。

一.数据可视化基础原理

数据可视化原理是综合运用UI(User Interface)、UE(User Experience)等技术,将采集或模拟的数据映射为可视化的图形、图像、三维、视频或动画,并允许用户对数据进行交互分析的理论方法和技术。

二.数据可视化UI设计方法

1.数据分析与建设:我们将数据作为可视化语言的基本对象,通过取样调查、模拟计算、业内归纳等方式对数据进行采集,最后提出相应的可视化解决方案,将数据表现形式重组,变得更为直观、易读。

2.数据变化与处理:原始数据含有一定的噪音和误差,我们需要人为的对其进行优化,将数据瑕疵去除,提取数据核心特征,从而让用户更好地理解数据的含义。

3.数据可视化:将数据的数值、坐标、不同位置间的联系等,通过不同的语言、标记、位置、形状和颜色等元素展现出来,最终让用户通过可视化洞察数据来探索数据背后隐含的现象和规律。

4.用户体验:用户从可视化数据中提取到的信息与相关的数据假设场景是要息息相关的,这些也可以帮助专家向公众展示数据中较为重要与关键的信息。

三.结合案例谈谈数据可视化实现步骤

1.图形可视化重要的数据

我们在表现重要的数据指标时,可以将与之有联系的图形语言作为表达基础式。比如之前我们做的某厂风电项目中,我们将数据语言与图表图形相结合,直截了当的告诉阅读者数据文字的意义与方向是什么。

UIPower案列-风电可视化项目.

2.用图形化语言重组指标

我们在某市风电项目中,将原本繁琐的数据通过不同的表现控件去展现,从而更好的体现可视化效果语言。

UIPower案列-风电可视化项目

3.图形可视化指标之间的关系

我们可以将数据的关系放在场景中展现来表现数据之间的关联特征,比如在此类数据图表中,为了体现不同地区之间数据的关系联系,我们将其统一置放于地图中,这样可以更为直观的理解数据之间的场景关系。

UIPower案列-风电可视化项目

4.可视化时间和空间

通过时间与地域的维度来呈现不同控件下的信息,比如下图中的地图空间可视化再现,地图作为主背景呈现了全部数据的信息点。

UIPower案列-风电可视化项目

5.动态表现图表数据

我们用完上述的可视化方法以后,也要想着让我们的静态图像尽可能的“动”起来。通常情况下,我们使用交互和动画两种方式来使得图表变得更加动态化。在交互上,我们会使得整体页面的鼠标浮动、点击、跳转等有一定的联动效应;在动画中,我们会尽可能的将所有静态视觉语言动效化,即在页面载入之后,将图表的三维效果展现出一个从0到1生长变化的过程,从而取代进度条等常规等待语言。

四.数据可视化总结

数据可视化作为让大众更为直观的感知图形图表数据的方式,拥有很大的战略意义。它不仅能够降低大众阅读数据的门槛,也可以让企业通过自身的形象更为精准化的做企业品牌战略的营销。在以下案例中,我们通过丰富的可视化语言,将某企业能源行业的风采最为直观的展现给了大众,使得他们的专业力、技术力能够更直观的被大众理解。

UIPower案列-风电可视化项目

数据可视化,需要以用户为中心,以用户体验为基础,输出可视化报表,为业务赋能。在公司不具备或者没有必要进行可视化工具自研的情况下,大量的可视化工具可供诸君选用,正所谓:君子生非异也,善假于物也。UIPower提供的数据可视化整体解决方案,包含可视化界面的高端定制设计及开发、可视化工具PowerUI,欢迎各位前来了解沟通。