产品需求、定位、品牌化、使用场景等等，如何做到最小化设计做到最大化利益？那必须有过硬的设计功底，让抽象的内容经过一些列加工，推敲，处理，呈现出不可思议的作品。

1.系统尺寸

当了解产品需求后，开始对系统硬件进行量身打造，寻找适合它的分辨率。

常见到的大屏其实是拼接屏，2个16:9或3个16:9拼接而来。

eg:7680*4320时，设计稿分辨率应为3840*1260或1920*1080导出2倍图，总体分辨率控制在4K左右。 

我猜你搞清楚了，很多大屏为什么尺寸不同的，并且他们之间的隐藏规则了。那就回归主题。常用的大屏界面布局结构有哪几种？使用过哪几种？

2.页面布局

以16:9（1920*1080）为例，常用的布局：左右结果、上下结构、左中右结构等等。那么，当遇到它的二倍图、三倍图功能增加，数据增加后，你该如何合理布局呢？

还可以延伸很多，主要根据客户喜好来定...

了解界面布局之后，就是数据统计图表的选择啦，数据是整个页面的核心元素，也相当于灵魂元素。

那么就要了解各类图表的使用意义啦！

3.统计图表

我们在设计大屏界面时，会遇到很多数据统计图表，数据是整个页面的核心元素。

当我们翻阅在各类书籍寻找什么是图表？你就会惊奇的发现，它们对于图表标准答案为：“图表设计的构成要素包括三部分：具象的要素，抽象的要素，文字与数字”

其实图表，也是语言的一种重要形式。它能让我们更快的洞悉数据背后的真相。它借助于各种可视化的组件，通过展示数据间的对比，来达到传递信息、表达观点或者发现数据背后的趋势等目的。

换句话说，就是图表设计既要保证图表本身数据清晰准确、直观易懂，又要在找准用户关注的核心内容进行适当的突显，帮助用户通过数据进行决策。

那么今天我们针对折线图、柱状图、这两类统计图表进行分析。

<<1.折线图

适用场景: 折线图适合二维的大数据集，还适合多个二维数据集的比较。

优势：容易反应出数据变化的趋势。

劣势：数据集太小时显示不直观。

适用数据：时间序列类数据、关联类数据。

<<2.柱状图

理想很丰满，现实很骨感，很多次系统呈现的数据图表，跟设计完全不一样。

适用场景：适用场合是二维数据集（每个数据点包括两个值x和y）。

优势：柱状图利用柱子的高度，反映数据的差异，肉眼对高度差异很敏感。

劣势：柱状图的局限在于只适用中小规模的数据集。维数太多柱形会挤在一起，使其效果变差。X轴标签文字过长后，倾斜排列、上下排列、换行排列影响视觉效果

适用数据： 数据集不大， 二维数据。

---------------------------------------------------------------------------

坐标轴的标签文字最好能水平排列，当X轴标签文字过多时，不建议倾斜排列、上下排列、换行排列文字多了这样的展示大大降低了阅读性！

下图给出两个解决方案，大大提高标签文字的阅读性！

<<3.图表设计总结

一定是越简单越好、重点数据突出、采用对比配色、增加阅读性，减少冗余。

4.案例展示

界面仅供交流学习！

以往常规界面都是静态页面，但是随着大数据可视化越来越普及，大众审美不断提升，出现了交互设计师，为了就是让界面出现动静结合。

“大面积、炫酷动效、丰富色彩”，大屏易在观感上给人留下震撼印象，便于营造某些独特氛围、打造仪式感。

4.动效设计

需要公司为了让自己的产品有差异性，建立起固定心智，抢占市场，设计师们真的是绞尽脑汁想出一招，让品牌在界面中动起来。

动效最妙的地方，就是在它不但可以承担起品牌宣传的作用，凸显品牌价值强化产品的优势。同时还可以给用户带来愉悦又美妙的体验，促进商业价值与用户价值的融合，带来双赢的结果。

因此使用图表、图形和设计元素，数据可视化可以帮你更容易的解释数据模式、趋势、统计数据和数据相关性，而这些内容在其他呈现方式下可能难以被发现。

(非常无奈，gif大于要求，上传不了)

只能来站酷看吧：https://www.zcool.com.cn/article/ZMTI1NDIzMg==.html

微信公众号：随心系

Powered by Froala Editor