您好,欢迎访问三七文档
1、可视化大屏设计指南相关概念设计原则设计步骤1.什么是数据可视化2.什么是大屏数据可视化1.字体使用2.字体选择3.背景色使用4.颜色搭配5.同类型的数据排列尽量均匀6.图表类型多样化,注重对比7.保持视觉一致性1.客户沟通,明确需求2.了解物理大屏,确定尺寸3.确定关键指标4.页面布局划分5.确定统计图类型6.定义设计风格7.可视化颜色搭配8.动效设置9.定稿通过信息图对数据进行描述而设计,以人们更易理解的形式展示出来的一系列手段叫做数据可视化,数据可视化是为了更形象地表达数据内在的信息和规律,促进数据信息的传播和应用。大屏数据可视化是以大屏为主要展示载体的数据可视化设计。也就是通过整个超大尺寸的屏幕来展示关键数据内容。字体优先使用系统默认字体,需要嵌入字体时考虑字体的可识别性、与当前设计风格是否融合、是否可免费商用。字体大小:字号不小于12号字,可以用于图表的标注,数据信息建议14号字以上,大屏字体可以适当的更大一些。灵活的字体:宽松的字母间距(字母之间的间距应小于字偶间距)和合适的中文字间距。中西文间隔:中西文混排时,要注意中文和西文间的间隔,一般排版的情况都是中文中混排有西文,。
2、所以需要在中西文间留有间隔,帮助用户更快速的扫视文字内容。颜色是可视化大屏中影响画面效果的重要元素。使用不当,会让读者分心。背景色的选择与可视化展示的设备相关,分为深色、浅色、彩色。色彩明度与饱和度差异显著、对比鲜明,尽量避免使用邻近色配色。使用用一种颜色去表达相同类型的数据,在图表中使用自然增量(0、5、10、15),而非不均匀的增量(0、3、5、16)排序要均匀。可视化让数据对比更直观,但是仅仅把两组图表紧挨着放在一起并不能达成这个目标,甚至更令人费解,所以要多用不同类型的图片进行对比。保持整体色彩感觉一致,配色风格一致,不同颜色之间搭配协调。不要一会黑白配,一会又来个红绿配。图标、图像的视觉风格以及尺寸一致,和整体风格保持一致。按钮的风格要统一,要么都是填充式的,要么都是中空式的,要么都是棱角分明,要么都是圆润光滑。例如下图,某公安行业可视化大屏(部分)是个很好的例子,配色统一,风格一致。可视化大屏开始设计之前,最重要的就是,跟客户进行沟通,明确用户的需求。大屏一般分辨率比较高,如果不事先确定物理大屏尺寸,设计稿设计出来的效果被投放到大屏上就会有偏差失真。关键指标是一些概括性词语。
3、,是对一组或者一系列数据的统称。一般情况下,一个指标在大屏上独占一块区域,所以通过关键指标定义,我们就知道大屏上大概会显示哪些内容以及大屏会被分为几块。尺寸和关键指标确立后,接下来要对大屏进行布局和页面的划分。这里的划分,主要根据我们之前定好的业务指标进行,核心业务指标安排在中间位置、占较大面积;其余的指标按优先级依次在核心指标周围展开。一般把有关联的指标让其相邻或靠近把图表类型相近的指标放一起,这样能减少观者认知上的负担并提高信息传递的效率。选定图表注意事项:易理解、易实现;图表类型选择,可以参考亿信华辰酷屏统计图,百余种统计图组件,任君选择。可视化大屏的设计风格主要根据行业类型、客户喜好、具体展示指标整体搭配,但总体一般以深色为主,这主要是因为大屏如果是浅色系长时间观看会造成眼睛疲劳、刺疼,还一点就是浅色上面不是很适合体现动感光线等特效的展示。当然大屏虽酷炫,但我们也不能忘记了为了炫酷而炫酷,实际我们还是要以展示具体指标为主要目的。平时的时候可以多看一下优秀的可视化大屏案例网站,也会对设计风格有良好的帮助。色彩是最能给人直观感受的,能够直接的牵引用户去寻找有效信息。整体色彩确定后,。
4、便运用色彩来划分信息的层级关系,用主色调强调重点内容,以引导用户能够清晰、明确、迅捷的识别重要信息。整个项目中有许多数据都是实时变化的,为了减少数据变化刷新时的突然性,动效设计必不可少。在整个动效设计的过程中,除过场动画、数据的变化外,动效还肩负起增添空间感、平衡画面和整合信息的作用。但是在增加动效的同时,仍需考虑服务器在承载大量数据涌入的同时,是否能够承载较多的动效,分析画面与数据量,对动效部分进行适当取舍。使动效不必喧宾夺主,明确画面中的重点进行展示。根据样图效果尝试五方面内容a.之前确立的布局在放入设计内容后是否依然合适;b.确立的图表类型带入数据后是否仍然客观准确;c.根据关键元素、色彩、结构、质感打造出的页面风格是否基本传达出了预期的氛围和感受;d.已有的样式、数据内容、动效等在开发实现方面是否存在问题;e.大屏是否存在色差、文字内容是否清晰可见、页面是否存在变形拉伸等现象。。
本文标题:可视化大屏设计指南
链接地址:https://www.777doc.com/doc-7338520 .html