欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

10款可视化大屏特效,酷炫又内涵! 可视化大屏数据分析数据可视化商业智能报表 

程序员文章站 2022-06-02 18:05:18
...

关于可视化数据大屏,之前已经讲了好多好多了,从大屏设计规范到大屏制作技巧、学习视频等等,我们做了很多的经验分享。

但还远远不够,用户始终在提出更高的要求,其中最重要的一点便是“更酷炫”。

但这里涉及到两方面难题:

一是诸如“好看”、“酷炫”这样的形容词,本身是很难定义清楚其范畴的,毕竟萝卜青菜各有所爱。

二是酷炫的度如何把握,在耍酷与数据价值之间如何平衡。

我们所见过许多眼花缭乱的效果,用华丽的视效堆叠起来博人眼球,然而经不起业务价值的推敲。从产品理念出发,我们不希望把用户带向一个歧途,始终希望“让数据成为生产力,”“数据之美”应该绽放在“数据价值体现”的基础上;在此基础上,我们也希望能提供更适用于各种普世场景下的产品,能够尽可能满足更多用户的大屏需求。

那么,到底该如何恰当的提供能包容多数人需要,同时又符合数据价值的“更酷炫”效果呢?

我们做了大量的用户调研,得出几个有意思的结论:

1、关注数据大屏的用户年龄段非常均衡,在20-40岁以每5个年龄作为一个区间,不同区间的占比高度接近。意味着数据大屏的设计应当具有很高的包容性,风格不可偏向性过重。

2、关于“科技酷炫”和“简约直观”的偏好调查中,用户重合度接近60%,也就是说大多数用户在两类风格间徘徊。

3、关于“科技炫酷”,绝大多数用户的选择特征是“蓝绿色系、动态效果、灵活多变”,可以理解为对色系和动态效果的要求是大屏的核心需求之一。

基于此,我们在FineReport 10.0中设计了新的大屏可视化效果,总计10个大屏3D特效、15种动态加载效果,在技能满足酷炫的同事又能醒目的体现数据价值。

新的可视化大屏图表,默认采用深色背景+荧光配色,符合浸入式的大屏体验;并根据图表类型和数据要求提供 '轮播'或'刷新'两种动画形式,满足用户不同场景下的业务需求。

同时我们还基于webgl等技术,对动画不断优化调整,为用户尽量提供简洁且酷炫的动态效果。

如下是部分大屏可视化的效果!

3D特效组件

全新设计的轮播gis点地图,根据用户预先录入数据,按序播放各个地理点的相关信息,3D视角和跳转动画如同身临其境。

(忽略图中错误的地理信息,只看效果)

10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 

新增加的指标卡,提供多种可选效果,如轮播、粒子技术器等,以'酷炫'和'简洁'的方式展示最基础的数据。

10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 

当然,很多效果这里不一一枚举~

动态加载效果

可视化的酷炫,除了图表本身,动态效果也很重要。我们对大屏布局中各个组件的动态效果也做了改进,新增了15种动态加载特效,简单来个GIF先睹为快:

10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 
10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 

通过组件加载动效,让每个组件模块舞动起来,让整个大屏界面化静为动。更为重要的一点是,组件加载动效可以与我们的监控刷新功能相结合。从原始数据哪里来、过时数据往那里去到新数据怎么进来,兼顾整个闭环的良好体验。

初始 -> 加载动效->判断数据过时 -> 消失动效 -> 动效完成 -> 获取新数据

10款可视化大屏特效,酷炫又内涵!
            
    
    
        可视化大屏数据分析数据可视化商业智能报表 

怎么样,是不是很有意思呢?

不要着急,大家可以自己下载体验。