数据可视化大屏幕ui设计方向和技巧

设计营销   2021-07-16

伴随着人工智能的不断发展和HMI系统技术的不断进步,屏幕已经成为人们与机器互动的主要方式之一。使用屏幕时,逐渐向大屏幕、可视化方向发展。下面就为大家介绍一下大屏ui设计的几个主要方向,数据可视化大屏ui设计技巧。

大屏幕ui设计的几个方向:

1. 拼接大屏幕:
大屏幕几乎都是拼接屏幕。用户界面设计时,不需要考虑屏幕间隙影响内容的呈现,内容也不会丢失,但可能会影响视觉表现。比如一个很大的人物图像被间隙中间的两半分割,或者分割眼睛,看起来很不舒服,所以在设计时可以建立间隙位置的参考线,避免类似情况。(企业常用的有无间隙、1.7毫米间隙、3.5毫米间隙、三种拼接大屏幕,间隙越小越贵)

2. 设计尺寸:
拼接的每个小屏幕通常是16:9的高清屏幕。设计尺寸可以将上下高度设置为1080px,长度可以根据拼接屏幕的数量比例得到长度的设计尺寸。比如3×5的大屏幕,高度3的屏幕设置为1080,,每个屏幕的高度设置为360,360除9×16等640,640是一个屏幕的长度,640×5屏幕=3200。最后得出的设计稿尺寸是:1080px,3200px。

3. 视觉设计:
首先了解需求,整合数据,分析主要数据的次要数据、总数据的细分数据、每个数据的维度等。通过了解这些,可以先设计一个布局模板,也可以画在纸上,布局可以在设计过程中随时调整。

设计风格,背景色一般采用深色,深色紧张感强,视觉焦点更好,大屏幕暗色看起来更柔和舒适,不刺眼,节电。


大屏幕数据可视化ui设计技巧:

1. 区分层次:

您可以尝试使用组件的大小和位置来区分数据的层次结构。通过定义信息级别,用户可以清楚地知道什么是最重要的,并在左上角显示更重要的信息。沿着对角线方向,信息的重要性应该依次减弱。右下角的信息最重要,信息可以分为不同的类别,并在不同的视图中显示。


2. 简单易懂:

数据可视化的真正目的是以更容易理解和更简单的形式传达复杂的信息。不要放一些大多数用户无法理解的信息,用更少的列来显示信息,删除冗余内容来减少混乱。


3. 一致性:

采用一致布局设计的数据可视化界面看起来更好。为了使界面更容易阅读,可以在信息组之间使用类似的可视化效果。更接近相关信息,可视化分组相关内容。

4. 临近原则:

将相似的信息放在界面中可以帮助用户快速理解。将相关信息放得更近一些,不要把相关信息分散到界面上,对相关内容进行可视化分组。


5. 对齐:

可视化组件元素需要在视觉上对齐,保持视觉平衡。可视化组件元素可以在视觉上对齐,更好的组织界面,尝试设计网格组件元素,不对齐的界面会给用户带来不好的体验。


6. 留白:

留白是为了让界面有呼吸感,让用户在使用你的界面时有喘息的空间。当用户查看所需信息时,界面中的空白可以吸引用户的注意力,改善用户体验。减少空白会使用户的界面混乱,使用空白可以可视化分组信息。空白太少只是鼓励你的用户尽快离开。


7. 颜色:

使用有效的配色方案来吸引用户的注意力,帮助他们轻松浏览信息。仔细选择颜色的目的是让内容易读。使用大对比度来显示背景中的视觉元素。避免使用低对比度和低效率的渐变。

8. 字体:

标准字体是可视化界面中最好的字体,除非有特殊原因,否则一般不要使用其他字体。使用标准字体,因为它们更容易阅读和扫描。特殊的艺术字体可能看起来不错,但是很难理解,避免所有的大写字母,因为很难阅读,人脑需要时间来消化。使用合适的字体大小和风格,有效传达信息。不要使用影响可读性的字体。

9. 数字排版:

显示精度超过要求的数字使其难以阅读和理解。如有必要,使用整数,因为长数混淆用户,省去不必要的信息,让用户轻松简单的区分细节。

10. 标签:

使用能够快速有效地向用户传达所需信息的标签。避免使用旋转标签,因为很难阅读,尽量使用标准缩写,避免旋转标签。

用户对大屏幕的喜爱程度在不断提高,所以这就要求我们的ui设计者在大屏幕ui设计更多地站在使用者的角度思考和设计。


维好维可-用户体验体验创新设计

联系我们:

关注我们微信

关注我们,一起探索美好

+86-21-51115850
©2010-2021 维好维可 | 用户体验创新设计咨询公司-版权所有
沪ICP备19006116号-1

Hi,  认识一下
请留下需求和联系方式

合作咨询
+86-21-51115850
© 2010-2020  维好维可 | 用户体验创新设计咨询公司
沪ICP备19006116号-1
维好维可-微信二维码