【笔记 | 翻译】Information Dashboard Design

《Information Dashboard Design》是2006年出的一本关于dashboard设计的书籍,全书系统系地介绍了信息类dashboard的设计方法,从什么是dashboard,dashboard的用途和数据类型有哪些,常见的设计误区,设计dashboard的原则方法,以及最终如何整体审视dashboard的可用性都给出了理论性的说明。虽然时间有一些久远,但是其中涉及的dashboard类型,常见的设计错误以及设计原则在现在的大多数web dashboard场景下还是非常适用的。

1、关于dashboard

Dashboard的信息是可视化的,通常是文本和图形的组合,但重点是图形且高度图形化。设计的基本挑战是需要将大量信息压缩到少量空间中,从而得到易于理解的显示。

Dashboard用于给特定用户传递特定的信息。尽管几乎任何信息都可以适当地显示在dashboard中,但用户无法一眼看到所有信息的细节,所以至少有一个目标信息,它以摘要或异常的形式缩写。dashboard必须能够迅速指出某些事情值得您关注,并且可能需要您采取行动,它不需要提供采取行动所需的所有细节。

Dashboard真正价值在于将数据库类型的底层数据转换为可视的有用信息,帮助人们直观地识别趋势、模式和异常,解释他们看到了什么,并帮助引导他们做出有效的决策。

2、dashboard的分类

作者在当时的年代将dashboard分为三类:

策略目标类型:为业务管理者提供业务健康状况和机会点的概览,我个人理解而言,策略目标类型的dashboard类似于现在的大屏,如天猫双十一大屏,直接显示数据的结果。

分析目标类型:和策略目标型相比数据的显示更加复杂,有更多的数据趋势,不仅要看到发生了什么,还需要了解为什么会发生,异常的节点出现在哪里,方便用户的进一步探索。

操作目标类型:与战略指示板不同,如果某个操作超出了可接受的性能阈值,操作型必须能够立即抓住您的注意力。此外,出现在操作指示板上的信息通常更具体,提供了更深层次的细节。如果一个关键的货物有可能错过最后期限,一个高水平的统计数据是不行的;你需要知道订单号,谁在处理它,它在仓库的什么地方。这样的细节可能会自动出现在操作仪表板上,或者可以通过向下钻取或将鼠标悬停在更高级别的数据上来访问它们,因此交互性通常很有用。

Dashboard的数据类型则可以分为数据与非数据两种类型,比如:网站近一个月访问量和购买量最多个10个用户账号。

但是就实际的设计场景来说,除了一些特定的场景,如大屏显示是其中的单一类型面板。大多数使用情况下,策略/分析/操作对于toB的用户来说大多是在一起进行的,如商家的后台dashboard。

3、dashboard设计的13个误区(后续单独用一篇文章来举例子说明)

1、超出一个屏幕的界限

2、为数据提供不充分的上下文

3、显示过多的细节或精确性

4、提供了一个有错误的操作

5、选择不适当的显示媒体

6、介绍各种毫无意义的信息

7、使用设计不佳的显示媒体

8、不准确地编码定量数据

9、数据整理不当

10、完全不突出显示重要数据

11、无用的装饰信息

12、滥用或过度使用颜色

13、设计一个不吸引人的视觉

4、dashboard设计原则

4.1 合理的视觉设计原则

当我们开始理解一些东西时,我们说“我看到了”并不是偶然的。不是“我听见了”或“我闻到了”,而是“我看见了”。视觉主宰着我们的感官。作为一个智者,我珍惜生活在我们世界中的丰富的声音、气味、味道和纹理,但这些都不能提供我通过视觉感知到的丰富的信息量。我们身体中大约70%的感觉感受器是专门用于视觉的,我怀疑在我们人类共同进化的广泛的智力和视觉优势之间有很强的相关性。我们如何看与我们如何思考息息相关。通常,当数据以某种方式呈现时很容易被察觉。如果我们能理解感知是如何工作的,我们的知识就能转化为显示信息的规则。根据基于感知的规则,我们可以以一种重要的、信息丰富的模式脱颖而出的方式显示数据。如果我们违反规则,我们的数据将是不可理解或误导。

4.1.1 短期记忆具有局限性

短期内存的有限容量也是为什么属于一起的信息不应该被分割成多个仪表盘的原因,而且不应该要求滚动来查看所有信息。一旦信息不再可见,除非它是存储在短期内存中的少数信息块之一,否则它就不再可用。

4.1.2 通过进行数据视觉编码,快速感知

视觉感知的属性可以分为四类:颜色(不同颜色划分/深浅划分)、形式(加粗/斜体/长短/大小/形状)、空间位置和运动。


4.1.3 格式塔原理

接近/相似/连续性/连接/封闭

4.2通过简单的方式传达信息

仪表板设计的基本挑战是在很小的空间中有效地显示大量通常完全不同的数据。仪表盘告诉人们正在发生什么,应该帮助他们立即意识到什么需要他们的关注。就像汽车的仪表盘,它提供了轻松监控措施的速度、剩余燃料、油位,电池强度、引擎故障,等等,业务信息仪表板提供了概述,但并不一定给你所有的信息。

要确定如何对仪表板上收集的数据进行响应的完整诊断,通常需要额外的信息。这是应该的,因为一个仪表板试图给你做你的工作所需的一切,包括所有细节,是不可读的。相反,指示板应该提供一个广泛而高级的概述,可以立即通知您事情的状态,将广泛的信息压缩到仪表板上的最佳方式是概览和异常信息,要做到简洁地传递信息有两个手段。

1、消除所有不必要的非数据像素,对剩余的非数据像素进行降级和规范化。

比如,在所有饼状图和上面的条形图上的3D效果,条形图中的网格线,背景图片装饰,渐变等等。

2、增强数据信息的展示。

通过删除任何不必要的信息,你会自动增加对剩余信息的关注。除非存在需要采取行动的问题或机会,否则就不需要呈现某种状态。尽可能多地将始终非常重要的信息放在仪表板的左上角或中间区域。使用比标准更大的视觉样式(例如,更亮或更暗的颜色)。使用与规范简单对比的视觉属性表达式(例如,当规范为黑色或灰色时的蓝色文本)。


4.3有效的显示媒介载体

仪表板必须能够将大量信息压缩到单个屏幕上,并在不牺牲任何重要或有损清晰度的情况下一目了然地呈现出来。因此,它们需要有效的承载样式,仪表板上的每一段数据都应该以最清晰、最丰富的方式显示,通常是在很小的空间内。这需要一个可用的显示样式库,这些库已经被选择、定制,有时是专门为仪表板创建。一个专业的设计师需要知道在什么样的场景下用条形图,什么场景下用折线图来表现数据。有效的指示板需要结合文本和图形,以支持丰富和有意义的数据显示,以及所需的定量精度水平,以一种可以有效感知的方式。对于每个度量或一组相关度量,您必须询问查看器需要什么、如何使用数据以及数据必须传递什么消息,然后混合使用文本和图形来实现这些通信目标。

其中尤其要注意的,虽然饼形图可能是这个图表库中最常用的图表,使用条形图可以更清楚地传达部分到整体的信息,非特定场景下不建议使用。

5、dashboard的可用性

仪表板的设计还有其他几个重要方面需要考虑。最具挑战性的一件事是,需要安排许多信息,而这些信息往往只与观看者监控它们的需要有关,而不会导致混乱,这种安排必须支持各种信息之间的内在关系。

5.1 组织信息以支持其含义和使用,根据业务功能、实体和使用组织组。共同定位属于同一组的项目。支持有意义的比较。

5.2 保持一致性,帮助用户养成使用习惯,可以快速准确的定位信息。

5.3 提高视觉可用性;使用低明度的颜色,只使用它们来突出显示需要注意的数据;除了需要注意的内容外,使用一些不太饱和的颜色,比如自然界中占主导地位的颜色(例如,地球和天空的颜色);


5.4 发挥dashboard作为信息节点的作用,它们可以提供高层监测所需要的初步概况,但它们可能需要补充更多的信息,以便更全面地了解和作出反应。所以仪表板几乎应该总是可操作的,从而深入了解细节,对数据进行切片以缩小焦点范围。

最后

要设计真正有效的仪表板,必须始终关注基本目标:沟通。最重要的是,必须关心使用仪表板的人能够简单、清楚和快速地查看和理解它们。为任何其他原因而设计的仪表盘,不管它给人的印象多么深刻或者多么有趣,在几天内都会变得令人厌烦,在几周内就会被丢弃。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 214,313评论 6 496
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 91,369评论 3 389
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 159,916评论 0 349
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 57,333评论 1 288
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 66,425评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 50,481评论 1 292
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,491评论 3 412
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 38,268评论 0 269
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,719评论 1 307
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 37,004评论 2 328
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 39,179评论 1 342
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,832评论 4 337
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 40,510评论 3 322
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 31,153评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,402评论 1 268
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 47,045评论 2 365
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 44,071评论 2 352