美文网首页
Dashboard设计

Dashboard设计

作者: 潘潘_panpan | 来源:发表于2018-02-05 10:21 被阅读270次

    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.常见错误设计

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


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

    相关文章

      网友评论

          本文标题:Dashboard设计

          本文链接:https://www.haomeiwen.com/subject/iijbzxtx.html