首页 > 其他分享 >建议收藏!数据可视化大屏设计必备步骤

建议收藏!数据可视化大屏设计必备步骤

时间:2023-04-18 14:04:11浏览次数:45  
标签:展示 必备 可视化 大屏 设计 看板 对应

相信对于从事大数据相关的人员来说,数据的可视化大屏是最能展现自己工作价值的一个途径。可视化大屏就是数据分析的最后成果的展示,而如果能设计出更直观、更酷炫、更具有科技感的大屏,更能获得客户的青睐。
那么客户喜欢的究竟是怎样的可视化?类似下图这种的:

建议收藏!数据可视化大屏设计必备步骤_数据

还是这种的:

建议收藏!数据可视化大屏设计必备步骤_帮助文档_02

那好看的,令客户满意的可视化大屏究竟应该如何制作呢,下面我们就来一起了解和学习一下设计可视化大屏的几大必备步骤,保你设计无忧,工作越干越得劲。
1、和客户及时沟通,明确对应的需求
可视化大屏最重要的一步也是第一步就是和用户进行沟通,明确用户的需求,只有明确了用户的需求,才可以设计出令用户满意的仪表板。

建议收藏!数据可视化大屏设计必备步骤_帮助文档_03

2、确定物理大屏尺寸,明确设计稿的尺寸
看板设计好后均是要在大屏上进行展示,所以要提前确定好对应的物理大屏尺寸,这样设计出来的大屏才能获得最好的视觉体验,也会展示的更加完美。注意:若物流大屏分辨率过高时,可以采用分辨率减半的设计方法去进行设计。
3、确定大屏展示的关键指标
确定好大屏尺寸后,就需要确定大屏展示的关键指标内容,那什么是关键指标呢?一般情况下,为了数据显眼,我们通常会将对应的特别数据独占看板的一块区域,这个区域的数据就是关键指标。所以通过对关键指标的理解,我们就会知道大屏上有几个区域,以及对应的区域内容是什么,更容易理解这个大屏。
以下面这个智慧校园管理综合大屏为例,这里的关键指标是看板中间的自定义地图、招生就业、师资教学、科研预算、科研投入、项目情况、专利数量、能耗管理和安全管理这几方面。

建议收藏!数据可视化大屏设计必备步骤_看板_04

4、页面布局的划分
确定好看板的尺寸和指标后,接下来需要对大屏进行页面的划分,划分可以参考这个几个原则:

建议收藏!数据可视化大屏设计必备步骤_看板_05

5、确定图表展示类型
布局确定后,这下就需要选择对应的图表去进行数据展示了,那在选定图表时需要注意,要选择容易理解,容易实现的图表,这样在设计时才可以更快,设计好后用户理解才会更加容易。这里给大家推荐wyn(商业智能软件),它对应的帮助文档里针对各个组件进行详细的描述,这样大家在使用时就可以更方便的进行选择啦。

建议收藏!数据可视化大屏设计必备步骤_帮助文档_06

6、确定大屏的设计风格
大屏的设计风格需要依旧对应的行业类型、指标数据、客户需求等进行整体搭配,总体分为两种风格:

建议收藏!数据可视化大屏设计必备步骤_数据_07

那针对大屏设计给大家推荐一个公开课,保证让你看完受益匪浅,除此之外,联系对应的小助手,还有免费的素材包可以领取呢~
7、大屏颜色搭配
人们最直观的感受就是颜色,可以用主色去强调重点内容,让用户可以更快速的识别重要信息,我们也一起了解一下不同行业的色彩属性:

建议收藏!数据可视化大屏设计必备步骤_看板_08

8、大屏的动效设置
使用带动态效果的一些组件,或者使用一些动态效果装饰图,可以让你的大屏看起来更加的高级和酷炫。

建议收藏!数据可视化大屏设计必备步骤_看板_09

建议收藏!数据可视化大屏设计必备步骤_看板_10

9、确定大屏
上面步骤均完成时,一个初稿看板就设计完成了,此时需要对它的细节进行检查调整,如果说我们不知道如何检查,可以从这几个方面去检查,比如检查看板的页面布局是否合理;组件是否发生变形拉伸;组件数据展示是否正确;看板色彩搭配是否合理等细节问题,也可以找看板设计的专家帮忙进行检查,检查调整确认无误后,此时就到了最激动人心的时刻,那就是定稿,提交看板。

建议收藏!数据可视化大屏设计必备步骤_帮助文档_11

那设计看板的几大步骤到这里就结束了,这里给大家提供一个地址,该地址是一些大屏看板的示例素材,大家可以点进去查看对应行业的看板设计,如果有需要也可以参考使用呢~

免费获取100张数据可视化大屏模板:
https://www.grapecity.com.cn/solutions/wyn/demo 嵌入式BI分析体验:http://wyn.grapecity.com.cn/playground/index.html 产品帮助文档: https://help.grapecity.com.cn/display/wyn600



本文是由葡萄城技术开发团队发布,转载请注明出处:葡萄城官网




标签:展示,必备,可视化,大屏,设计,看板,对应
From: https://blog.51cto.com/powertoolsteam/6203238

相关文章

  • 如何在移动端数据可视化大屏实现分析?
    本文由葡萄城技术团队于原创并首发转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具、解决方案和服务,赋能开发者。项目想做数据可视化,想同时在PC端、手机端查看数据怎么办?业务主要关心的数据包括:销售数据、业绩达成、同比、环比,各产品销售情况及潜客商机、未来收入预测等......
  • VsCode常用设置(新手必备!)
    很多同学会有疑问,为什么我看到很多大牛的视频里面敲代码的时候,输入一个template,就会出现一大块代码。为什么我输入一个​​template​​,只有这一个单词,啥也没出来别墨迹,快解决闲话不多说,我们就来聊一聊如何--懒省事(在VsCode里面设置自定义的模板)首先:我们要找到这个模板设置的......
  • 使用强大的可视化工具redislive来监控我们的redis,别让自己死的太惨~~~
    作为玩windows的码农,在centos上面装点东西,真的会崩溃的要死,,,我想大家也知道,在centos上面,你下载的是各种源代码,需要自己编译。。。而使用yum的话,这个吊软件包有点想nuget,不过yum上面都是老的掉牙的软件。。。有时候还要升级,比如我在安装redis的另一种监控re......
  • VsCode常用设置(新手必备!)
    很多同学会有疑问,为什么我看到很多大牛的视频里面敲代码的时候,输入一个template,就会出现一大块代码。为什么我输入一个template,只有这一个单词,啥也没出来别墨迹,快解决闲话不多说,我们就来聊一聊如何--懒省事(在VsCode里面设置自定义的模板)首先:我们要找到这个模板设置的入口在文件->......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(十八)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十四)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十三)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十二)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(二十五)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......
  • Arcgis 与 Claygl 可视化 glsl 特效篇(三)
    我决定不从claygl基础来讲了直接整合arcgis与claygl可视化来讲关于整合clagyl有兴趣看我这篇文章arcgis与claygl引擎结合做地图可视化我整合一个类库后续不断更新中npmi@haibalai/gismap4-claygl 初始化gismap4-claygl类库,view是arcgis的sceneView对象import......