基于数据可视化的智能终端UI设计

姚广灿

（浙江横店影视职业学院，浙江 东阳 322118）

0 引言

数据可视化，是关于数据视觉表现形式的科学技术研究。智能终端UI设计逐渐倾向于数据可视化，如何将海量数据通过可视化图形语言向用户阐明，并增强数据可视化的体验感受效果，值得UI设计师深思。

1 数据可视化概述

数据可视化原理是综合运用UI（User Interface）技术，将采集或模拟的数据映射为可视化的图像、图形、三维动画或视频，并允许用户对数据进行交互分析的技术。智能终端UI设计中，数据可视化是极为重要的设计内容，主要是针对数据呈现方式的设计，包括静态背景图、动态数据演示、图标显示功能等。如果UI设计界面呈现出的数据可视化结果满足用户需求，那么用户的使用体验也会随之增强。反之，当数据可视化结果直观性较差时，即便给出了数据结果用户也很难快速理解数据含义。所以，数据可视化是基于应用层面的数据结果呈现，UI设计符合用户需求且具有较强的直观性时，方能满足基本设计要求，呈现体验度较高数据可视化结果。

2 数据可视化的UI设计标准

2.1 数据采集与识别

智能终端UI界面中呈现出的数据结果是一种基础数据的动态演化过程，在此之前需要完成对基础数据的采集和识别。一方面，数据采集方法可以采用业内归纳、模拟计算、取样调查等方式，以此来整理基础数据创造可视化语言的直观表达方向。另一方面，数据识别是为基础数据贴上标签，让抽象的数据内容具有可视化的形象感知条件。也就是将不易理解的数据单位转化为符合大众认知的图形标志，从而增强UI界面中数据结果的识别度和易读性。

2.2 数据优化与处理

设计智能终端的UI界面时，原始数据并不一定能够直接使用，主要是采集到的基础数据可能存在明显误差和噪音。此时，需要根据智能终端UI界面的应用方向来确定容错率，将数据误差值缩减到用户可接受范围之列。以菜鸟驿站App的智能终端界面为例，缩放地图可以呈现出感官距离数据，但是缩放比例本身就是存在误差的地理信息数据。然而用户并不介意货物与自己的空间距离长远，反而更介意快件何时才能配送到站。所以，基于功能导向的时间数据比路程数据要求更高，也非常有必要对配送时间数据反复精确。当时间数据从“日”精确到“小时”，需要在智能终端上提示用户剩余配送时间，其数据处理的可视化要求也就基本达到了用户预期的精确度。当数据瑕疵被抹除之后，数据特征的应用功能更为明显，用户理解起来更为便捷且直观，也就增强了数据可视化结果的呈现效果。

2.3 数据异同与风格

用户对数据的敏感度取决于UI界面是否带来了强烈的差异化区分，但是在过度差异化的设计中又很难形成统一风格。所以，UI设计的数据表现力实际上是在同一种设计风格下，尽量对数据可视化结果差异化和同族化的处理。一方面，同族化的要求是确定图标或数据表现形式风格统一。图标类型虽然有独特功能，但是在数据表现力上还是应以同一风格为设计前提。而数据表现形式则要求至少单位一致、数字规格一致、数据换算结构一致、数据位置和出现概率相对一致。当表现形式统一，且数据图标风格趋近，则达到了数据可视化的同族风格设计要求。另一方面，数据差异化的表现形式，主要是从标记方式或色彩结构上寻找UI设计灵感。这主要是因为数据的直观表达中必须具有一定的规律性，否则用户也很难区分数据图标所代表的隐含意义。所以，为了增强用户对可视化数据的直观理解，有必要在统一风格的形象设计上打造差异化的呈现规律，从而在数据异同中美化UI设计的呈现效果。

2.4 数据场景与体验

用户从可视化数据中提取到的信息属于假设数据场景，现实数据所代表的实物并不能在智能终端设备上完整呈现。所以，数据可视化的UI设计中，数据场景具有描述和阐释的双重作用。数据真实度越高，其呈现效果越需要场景化设计来体现。如果场景描述脱离现实，那么用户的感知体验则会大幅下降。反之，当数据场景与现实场景高度契合，即便是数据真实度存疑，用户体验效果也是极佳的。所以，在数据假设场景中，用户体验主要是来自UI设计的视觉指向性，而并非数据真实度。如果数据可视化的呈现效果不理想，不断优化数据呈现界面的场景化处理，从而增强用户体验度。

3 数据可视化的智能终端UI设计流程

3.1 定义目标并完成数据展示

后台界面首先是要有明确的目标，围绕用户需求展开设计。运营型和分析型后台界面也都是依据功能导向建立的数据可视化操作，而后便可对数据前台呈现效果进行设计加工。后台界面中的数据展示相对更为复杂，尤其数据类型较多时，无论是静态数据还是动态数据，都需要依据数据变化结果呈现在前台，展示出数据的指向性作用。

3.2 统一格式并完成结构性布局

后台界面所呈现的数据信息需注重细节处理，这主要是规范命名、日期格式以及数值单位等数据化处理的基础条件。当格式统一之后，UI设计框架也就基本定型，可以保证前台数据的一致性。数据操作栏中的命名方式相同，指向性也就非常明确，用户操作将更为便利。之后便可以定义UI界面的结构性布局，包括数据出现的顺序和优先级。

通常可以使用“隐形”线划分框架结构，对齐网格之后再填入设计元素也就形成了基本骨架。网格可以使得智能终端应用界面条理清晰，数据呈现的视觉效果也会更为规整。尤其在数据信息量较大时，相对更为紧凑的空间布局，可以让用户清晰识别出数据特征，这也是前台应用操作的引导功能之一。

3.3 优化组件并设计留白

定义网格的作用是划清界限，但是多组件情况下承载的数据信息量会逐渐增加，图表所牵涉的数据类型也会随之增加。如果排列方式可以优中选优，则尽量以统一的组件格式进行完整设计。通常可以使用统一规格的虚拟卡片，定义数据操作和响应时间，必要时可以增加拓展名，从而优化空间布局中组件结构的视效完整度。

优化组件之后还要为界面空间留白，而留白区域越大，用户视觉负担越小。这是用户在使用智能终端设备时的一个操作习惯，即便是数据特征较为明显的操作界面里，也不能让用户感觉数据满格且空间狭小。这就涉及排版的用途，如果用户对数据结果非常在意，数字必须大于空间留白；如果用户对于数据反馈结果的动态演示更为注重，那么动态图的画面可以尽量延伸，最后以滑动横排数据呈现所有结果即可。所以，空间留白的设计方案，也是依据用户对数据观感需求来设计的，需要设计师依据智能终端的应用功能来调整排版结构。

3.4 完整呈现数据信息并完成个性化设计

应用界面的功能性主要是为了快速获得数据信息，但如果涉及滚动的连续数据，在一定程度上会拖慢用户的使用效率。一般在金融类的UI设计中频繁出现大屏滚动式的数据信息，但是这种数据的演示性较强，对用户辨别数据走势具有一定的辅助作用。除此之外，设计其他应用界面并不需要采取隐藏数据信息的方式来构图，如果因此而弱化了用户使用效率也会得不偿失。

以往设计中能够发现，用户更希望直观看到与其个人需求息息相关的数据信息内容。但是这并不代表自定义数据类型就是个性化的设计，这种功能仅对小众用户简易操作具有直观引导作用。绝大多数的应用界面，是以对用户的ID识别来判断用户需求的，也以大数据识别来区分用户角色类型，从而提供相应的数据信息内容。所以，在系统结构的配置布局中，自定义选项不宜过多，前期可以直接提供全视域的数据信息，后期可以由用户自行删减辅助数据信息，以此来改变用户的数据体验方式，增强应用界面的实用性功能。

3.5 融合数据列表并简化视觉负担

少数智能终端应用界面的数据类型很多，此时用户很可能会对过于复杂的数据内容产生视觉干扰。这也可以理解为是一种面对复杂数据所产生的视觉负担，如果不能简化数据结果，就需要进一步简化数据表现方式。一方面，简化数据结果的方式主要是融合数据列表。将较为复杂的数据单位全部替换为百分比数据，通过后天验算生成简化后的数据结果，让用户一目了然的观察到最想要看到的数据。另一方面，简化数据表现方式，可以通过增强应用界面的空间利用率，或者是隐藏部分辅助性较弱的观察数据信息。在便于用户使用操作的前提下，将简化视觉负担作为突出数据呈现效果的主要设计方案。所以，数据可视化界面应总揽全局，重点体现关键数据信息，剔除掉绝大多数无用信息之后再增强数据的直观性。

4 基于数据可视化的智能终端UI设计优化策略

4.1 充分体现图形可视化的重要数据

数据信息本身也有主次之分，如果用户在应用界面上先看到次要数据，而后才看到主要数据，那么对应用界面的数据理解和体验效果则会大幅下降。在某款风电项目的应用界面中，为了将数据语言表达得更为清晰，便使用了图形表现方式来呈现数据结果。设计师依据读者对数据文字的理解方式，用风车表示风电机组的容量，用树叶和插座表示节能的概念，用房屋和灯泡表示电能到户的数量级别，用户可以直截了当理解图形含义，即便没有文字引导，也可以产生清晰的数字表示意图认知。所以，在UI设计后期，还要观察用户的观感反馈，尽量用简约的图形方式来进行数据可视化表达，增强用户理解效果。

4.2 用图形数据化的感知语言重组指标

烦琐数据虽然更为详细，但是并不会增强用户的可视化体验效果。所以，数据图形需要在后期对部分指标进行调整，通过重组指标的方式来强化图形语言的表达力。设计师可以通过不同的表现控件去展现，从而更好地体现可视化效果语言。诸如，墨迹天气App的应用界面中，线性图示结构可以反映出15日内的气温变化，再用常见的天气符号和温度数据表示即可。但是这种数据结果对理性用户的引导力较强，感性用户更希望看到一种对于温度的直观感受图示。所以，墨迹天气的制作团队，用卡通人物的着装来表示温度，棉衣代表低温，短袖代表高温。背景图中，将代表春夏秋冬的四季图片配合温度数据进行调整，同时用光线的明暗度来表示白天和夜晚的时间变化。那么这种具有指向性的感知数据表达力更强，所以用户体验效果也会随之增加，增强了数据可视化的表达力。

4.3 动态演示图表中的数据变化规律

静态图示能够呈现短期内不会变化的数据信息，但是很难体现出随时变化的数据内容。所以，UI设计中动态演示数据结果必不可少。比如，Keep App的跑步距离数据，便是用路程前进线来表示当然跑步的距离和时间，并以此推算出用户消耗的卡路里。值得注意的是动态演示结果中，路程、时间、配速、卡路里消耗等数据信息，都是在用户行进过程中产生的动态数据，且随时暂停也可以观察到停顿后当时的数据结果，故而用户感受更为真实。所以，这种动态演示数据结果的功能必不可少，需要用动态演示图表中的数据变化规律来体现可视化，并增强用户的直观感受。

5 结语

综上所述，数据可视化的UI设计标准主要包括，数据采集与识别、数据优化与处理、数据异同与风格及数据场景与体验。在具体的设计流程中，首先需要定义目标并完成数据展示，其次需要统一格式并完成结构性布局，再次需要优化组件并设计留白，最后需要完整呈现数据信息并完成个性化设计，此外还要融合数据列表并简化视觉负担。完成总体设计之后需要进一步优化，建议UI设计师综合考量应用界面数据可视化的视觉表现力，充分体现图形可视化的重要数据，用图形数据化的感知语言重组指标，动态演示图表中的数据变化规律。