Question

Dashboard设计

Answer 1

1.Dashboard含义

Dashboard的中文是“仪表盘”，与汽车仪表盘相同——反映车辆各系统工作状况的装置，有车速里程表、转速表、燃油表等。同时，还会有各种各样的指示灯或警报灯，例如冷却液面报警灯、燃油量指示灯、充电指示灯等。司机可以很方彪地从汽车仪表盘中获得整体状况。在我们UI设计里引申为后台系统或信息分析系统。

2.Dashboard所担负的功能

监控： 对系统进行监控，如果有异常仪表应该反映出警报的指示。

分析： 可视化的进行数据的分析，让我们进行分析时有依据。

查找： 提供关键数据可以进行查找

3.我们的用户是谁呢？

运维人员： 业务是否在正常运行

财务人员： 账户每个阶段的收支情况

老板： 可视化数据

4.数据可视化的功能

筛选功能： 允许用户根据需要筛选Dashboard数据的范围，可以是全局性的（在整个概览页范围内选择），也可以是局部的（在特定图标或是规范范围你选择）。特别涉及到时间的筛选，可以从记录历史（回溯过往数据趋势）、快照（显示单点数据）、实时（监控新进活动）和预测（预估未来走向）等这些更细粒度角度考虑数值呈现，让用户获得精确数据。

比较功能： 指示数值的对比，能够并列比较两个或多个数据集。例如折线图、面积与等能提供数据集对比功能。

报警功能： 根据预设的条件高亮显示，当指标超出特定界限时就触发警报。

定制功能： 允许用户根须需求定制不同的内容

导出功能： 为用户提供Dashboard中导出数据的功能

4.重点设计部分：

登录界面

左侧栏： a单独式（单排设计）  b二级（双排设计）  c树形结构（电脑里C盘）

顶部栏

面包屑设计: 有效传递用户所在页面深度信息

表单设计: a.帮助信息位置  b.Hover状态  c.错误提示

编辑器： a.问清实现方法  b.注意字符提示

5.页面中的数据展现形式

图解Diagram： 柱状图、图解更容易看出趋势

曲线图Curve: 有直线曲线图和曲线曲线图两种；左右一般会有X和Y轴刻度

雷达Redar： 雷达图表示该内容在不同维度的占比

图标Chart: 图标包括曲线图，但是图标的定义是一个完整的刻度和说明

表格Table： 最常见的数据样式就是表格

统计图Graph: 统计图可以用纯色和渐变来设计

饼状图Pie chart/Doughnut chart; 通过数值变化表示趋势

地图Map： 使用地图的方式表达数据与地域的关系

6.常见错误设计

信息混淆不清（颜色区别不清楚……）；程序员做不出来；容易串形（上下间距拉大或颜色变化）

以上笔记内容来源于烯鉴老师的课程