大屏介绍

目录:

• 1. 描述
• 2. 布局排版
• 3. 配色
• 4. 点缀
• 5. 动效

1. 描述编辑

帆软为企业提供数字大屏解决方案，通过帆软的数据分析产品，用户可以构建强大、全面的“管理驾驶舱”，无需专门设计，就可以将企业的数据管理信息完美地投放在任何屏幕，比如交易大厅、管控中心、生产车间、展览中心等地的LED大屏上。

可以实现完美的自适应效果，对于大屏实时监控的信息，比如股价，双11类活动实时交易状况，都可以通过图表属性的自动刷新功能实时同步数据库数据。

也支持用户对于大屏的展现内容进行DIY的设计，持接近20种图表类型和延伸的多种图表样式，支持添加文本、图片、Web信息实现各种DIY的布局样式。

那么该如何制作一个好看又能体现功能的大屏呢？

2. 布局排版编辑

首先要遵循一个基准：不要为了做大屏而做大屏，不要为了展现而展现。就是说要明确大屏展现的目的，首要是服务于业务的。要让业务内容、数据合理的展现，就要避免误入疯狂堆砌指标，要分清主次。

主要指标：反应核心业务内容的。

次要指标：用于进一步阐述主要指标的。

下面推荐几种常用的布局：

上面几个布局，只是通常推荐的主次分布布局，能让信息一目了然。实际项目中，不一定使用主次分布，也可以使用平均分布，或者可以二者结合进行适当调整。

比如下图所示，指标很多很多，存在多个层级的，就根据上面所说的基本原则进行一些微调：

附上几个典型的主次分布布局的大屏效果图：

3. 配色编辑

合理的布局能让业务内容更富有层次，合理的配色能让观看者更舒适。

这里讲解一下背景色，背景色又分为整体背景以及单个元素的背景，无论是哪一个，都遵从两点基本原则：深色调&一致性。

一般大屏会选择深色系，主要是为了避免视觉刺激。浅色系的，投放到大屏上后会比较刺眼。

下图以两个驾驶舱页面深浅色对比来做说明：

整体背景深色系，一般还是以深蓝色系为主，如下所示是几个推荐的配色方案。

背景不一定要用颜色的，也可以用图片。图片的使用依旧遵从整体深色的原则，同时搭配其他一些现实特性可以让整体看着更有科技感。推荐使用一些带有星空、条纹、渐变线、点缀效果之类的图片。

单个元素的背景，首先是要和整体背景色系保持一致性，避免突兀。另外一个小技巧，就是透明度的使用。推荐为单个的组件元素搭配一些透明色，透明度设置在10%上下为宜，具体以实际效果微调。如下模板，组件增加透明效果后，整体效果有质的提升。

4. 点缀编辑

在大屏展现上，细节也会极大的影响整体效果，通过适当给元素、标题、数字等添加一些诸如边框、图画等在内的点缀效果，能帮助提升整体美观度。

如下图所示销售驾驶舱大屏，顶部的标题通过左右两个对称线条进行点缀，各个组件的细分标题通过不规则渐变色图片进行点缀，另外每个组件都搭配使用了简洁的边框以提升层次感。

比如下面图所示大屏，给组件及其标题增加一些不规则的渐变色边框，让整体看上去更富有科技感。

如下图所示的航空大屏，给元素增加一些飞机图标、图画之类的拟物效果，让大屏更真实生动。

5. 动效编辑

动效的范围很广，可以从很多角度解读，比如背景动画，比如刷新的加载动画，比如轮播动画，比如图表的闪烁动画，地图的流向动画等等，都属于动态效果的范畴。

动效的增加能让大屏看上去是活的，增加观感体验。但过分的动效极其容易喧宾夺主，让观看者的眼球不知道往哪里聚焦，反而丧失了业务展现价值。这个度很难把握，既要平衡酷炫效果，又要突出内容。

如下图所示销售大屏，核心指标车辆总价值以数字显示，通过FineReport 的数据监控功能，动态刷新数值。

再如下图所示IT运维大屏，中间地图上模拟的呼吸动画，底部的滚动消息等。

 

 

如下图所示金融大屏的轮播动画，借助轮播效果，来实现同一个位置滚动播放不同的指标内容，避免平铺展开所有指标把大屏界面挤满。

再比如这个销售驾驶舱，通过边框动画、地图流向动画，来增加大屏展示的整体活力。