数据可视化太重要了

用户头像
杭州/设计爱好者/235天前/51浏览
数据可视化太重要了
用户头像
三悠
数据可视化类的页面通过一系列图表展现及辅助解读,用户通过浏览和操作数据图表,来实现特定分析目的,制定数据驱动型决策。
设计目标
让使用者快速、清晰地理解数据意义,快速分析趋势,驱动决策。
设计原则
组织性
有逻辑地定义布局,有组织地排布内容。通常使用从上到下和从左到右的结构排列,或递进的交互形式,来凸显常用分析思路:概览第一,聚焦过滤,再按需查看详情。
突出重点
将最重要的视图、最关键的指标放在此类型页面的顶部或左上方。
信息准确
保证数据的准确性、清晰度和完整性。
使用正确的图表类型。
在必要的时候对数据的定义作出解释。
Do & Don't
在对数据进行高度概括时,展示指标卡+数值,比图表更直接。
数据可视化太重要了(图ZMTUzMTYzNDg=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
尽量在一屏中突出核心指标,将总模块数量控制在5-9个,避免信息过载。
数据可视化太重要了(图ZMTUzMTYzNTI=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
善于使用筛选、过滤功能,让用户在观察全局的同时,还可以查看数据细节,从而让用户在有疑问时能够快速找到方向。
数据可视化太重要了(图ZMTUzMTYzNTY=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
模板
概览
将全局视角中最关键的指标,以平铺的方式展现在整个页面中,帮助决策者做决策。当指标重要性平均时采用左图布局,需要强调主题时采用右图布局。
数据可视化太重要了(图ZMTUzMTYzNjA=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
模板-指标大盘
什么时候用
决策层用户用来监控全局数据,并附带图表来辅助解读。
涉及哪些功能
核心数据、指标卡模块、筛选器、图表区。
数据可视化太重要了(图ZMTUzMTYzNjQ=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
模板-监控
什么时候用
决策层用户用来监控全局数据,通常是围绕着一个主题,展现多个维度的关键指标,并帮助用户快速发现异常。
涉及哪些功能
核心数据、指标卡模块、图表区、地图、仪表盘。
数据可视化太重要了(图ZMTUzMTYzNjg=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
分析
将数据分析类型页面拆解为多个部分,通常为“总-分”的结构,多维度地展示数据的全貌,帮助使用者发现当前问题。
数据可视化太重要了(图ZMTUzMTYzNzI=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
模板-多维分析
什么时候用
针对同一主题的多个维度分析。
涉及哪些模块
核心数据、指标卡模块、筛选器、图表区。
数据可视化太重要了(图ZMTUzMTYzNzY=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
明细
数据明细用来展示单个指标总览和明细。常用于数据报表细节信息的展示,根据业务诉求可配置文本、列表、可视化图表等。
数据可视化太重要了(图ZMTUzMTYzODA=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
模板-数据明细
什么时候用
常用于数据报表细节信息的展示。
涉及哪些模块
筛选器、图表区、数据明细表。
数据可视化太重要了(图ZMTUzMTYzODQ=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
设计建议
串联分析思路
明确此类页面的使用者身份,以及分析目的,从而选择对应的页面类型、划分用户。不同业务线间,关注的核心指标不同,常见的指标类型有:宏观的大盘数据,具体的业务指标。
  • 针对决策者,可以选择描述型的指标结果页面。
  • 针对执行者,可以选择有更多分析功能的分析、详情页面。
确定核心指标间的联系及优先级,合理地进行页面布局,把结论和最重要的指标放在最醒目的位置。
请记住,您可以将以上页面通过交互方式串联起来,讲述你的数据故事。
数据可视化太重要了(图ZMTUzMTYzODg=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
卡片的组合方式
  • 一张卡片放置一个主题内容。
数据可视化太重要了(图ZMTUzMTYzOTI=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
  • 也可将相关性高的数据组合呈现在一个卡片中,并使用通栏分割线区隔。
数据可视化太重要了(图ZMTUzMTYzOTY=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
选择正确的可视化组件
当设计者对页面的结构有初步的思路之后,可根据信息粒度的大小来选择不同的可视化组件。信息粒度从大到小对应:指标卡和排行榜、图表、文本明细。
数据可视化太重要了(图ZMTUzMTY0MDA=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
选择正确的色板
数据可视化太重要了(图ZMTUzMTY0MDQ=) - 观点 - 站酷设计师三悠原创素材 - 站酷ZCOOL
收藏
结语
以上就是今天分享的全部内容,我们下期再见!
注:以上文中配图均来自于网络或应用截图,仅作学习分享使用。
1
举报
|
1
分享
相关推荐
评论
用户头像
评论你的想法~
表情
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
推荐素材
【新年UI图标】积分icon
科技医疗透明柜UI界面设计
【新年UI图标】银行卡icon
盲盒APP UI设计
3D渐变流体抽象矢量UI背景图
【新年UI图标】活动icon
【新年UI图标】旅行icon
新能源APP应用UIKit
APP/小程序商业项目UI模板|99个高保真UI+79个原型
高级感金属拟物 UI设计组件库
【新年UI图标】相机icon
UI界面 组件
UI通用设计素材1
【新年UI图标】礼物/活动icon
钱包ui模板
原创UIUX交互橙红渐变炫酷视觉平面设计作品集模板PSD
UI 登录界面设计模板包
手表表盘UI系列
【新年UI图标】体育icon
我的钱包-UI界面设计-app
新拟态风格 UI设计组件库
高级表盘系列UI源文件
Security Camera UI kit
户外旅行飞机情侣假日出行
你可能喜欢
相关收藏夹
地产VI
地产VI
地产VI
地产VI
大家都在看
登录注册