心灵之眼——数据可视化心理学

已发表: 2022-03-11

数据可视化是讲述数据故事的好方法。 但是最好的方法是什么? 对人类感知和认知的理解可以帮助设计师有效地做到这一点。

数千年来,人们一直使用视觉来帮助讲述故事并说明基本问题的答案。 数据可视化最早的例子可能是大约 27,000 年前的地图,在很长一段时间内,很少看到除地理以外的任何数据可视化。

我们的大脑是专门用来识别模式和联系的吗? 今天,我们生活在数据可视化的黄金时代。 有效地传达数据可能具有挑战性,虽然图表可以帮助我们理解复杂的数据,甚至可以从新的角度看待它,但在向受众正确传达信息或根据数据做出业务决策时,可视化可能是一种关键方式来完成它。 但是数据可视化的力量背后什么?

数据可视化设计的历史脉络

数据可视化历史悠久,在 17 世纪和 19 世纪之间取得了重大进展。 以图形方式呈现定量数据的想法出现在 18 世纪,当时 Rene Descartes 发明了一个二维坐标系来显示数学运算的值。 当 William Playfair 开创了我们今天所知的图形形式时,该系统得到了改进。 他因发明了折线图和条形图而闻名,后来又发明了饼图和圆形图。

数据可视化示例:Playfair 的 1801 饼圆折线图
Playfair 的 1801 年饼圆折线图,比较了几个国家的人口和税收。

多年来,使用定量图变得越来越普遍。 随着雅克·贝尔廷 (Jacques Bertin) 的著作《图形符号学》 (The Semiology of Graphics ) 的出版,他们的方法论和有效性在 20 世纪下半叶显着提高。 他的工作至关重要,因为他发现为了直观、清晰、高效地呈现信息,视觉感知是根据可以遵循的规则和模式进行操作的。

Bertin 研究了不同类型图表的有效性。 在下面的示例中,饼图显示了几个国家各种肉类的生产情况。 Bertin 认为这些是“无用的”。 在中间——通过使用矩阵可视化,高级模式变得更加直观。 在右边,由于国家和肉类生产没有自然顺序,因此可以生成许多其他矩阵(包括所示示例),这提供了更加清晰的信息。 在这种情况下,类别的重新排序显着改善了数据的呈现方式。

数据可视化设计
La Graphique(Bertin,1977 年)一书的草稿,由 EHESS/AN 参考提供。 20010291/36。

心理学与数据可视化有什么关系?

视觉感知是观察、解释和组织我们环境的能力。 数据可视化可以非常有效,因为它利用了人脑的自然能力。 它快速高效。

美国有影响力的数学家和理论统计学家约翰·图基(John Tukey)说:“一幅画的最大价值在于它迫使我们注意到我们从未期望看到的东西。”

由大脑皮层处理的认知要慢得多,并且需要更多的努力来处理信息。 以视觉方式呈现数据可以加速我们的感知,并有助于减少认知负担。

在下面的示例中,该表让我们可以看到精确的数字。 但是,我们能否快速得出可再生水资源的最高和最低数据? 不容易,但是当在右侧的条形图中直观地呈现相同的数据时,会变得更加清晰和易于理解。

数据可视化原则

与其他感官相比,视觉感知的主要影响在丹麦物理学家 Tor Norretranders 的一个例子中得到了恰当的说明。 他通过将人类感官的能力转化为标准的计算机吞吐量来展示视觉的力量。 Sight 名列前茅,因为它具有与计算机网络相同的带宽。 它的通道容量比触觉高10倍,比听觉或嗅觉强100倍。 右下角的小方块是我们认知感知感官体验的地方。

数据可视化心理学
Tor Norretranders 我们的感官带宽。

预处理

视觉处理不仅主导感官输入,我们处理的数据量和速度也远高于我们的意识。 这种现象被称为“前注意处理”。 这是潜意识的,快速的。 眼睛传输需要 200-500 毫秒,大脑处理视觉刺激的预注意特性(这比大脑处理电子表格数据的速度要快得多)。

“注意力前处理是对环境信息的潜意识积累。 所有可用信息都经过预先处理。 然后,大脑过滤并处理重要的事情。 通过有意识(专心)处理选择具有最高显着性(最突出的刺激)或与一个人正在思考的内容相关的信息,以进行进一步和更完整的分析。” ——来自维基百科

预先注意的处理对设计师来说是一个福音,因为它巧妙的部署可以让人们更快地理解所呈现的内容。 一个称职的设计师可以帮助查看数据可视化的人更快、更省力地吸收更多信息,因为它减轻了有意识的处理并减少了记忆负荷。

预处理的优点:

  • 快速/自动
  • 情绪化的
  • 冲动/驱动
  • 习惯
  • 信念
  • 刻板印象
  • 潜意识

许多视觉变量会触发预先注意的反应。 通过了解自动强调哪些视觉元素,然后将它们整合到仪表板中,我们可以设计可视化来有效地讲述数据的故事。

视觉变量

由 Jacques Bertin 介绍,视觉变量是人眼感知的元素之间的差异。 经过长期研究,这些变量提供了理解人类大脑如何处理和导航视觉信息的方法。 最初的一组“视网膜变量”由七个变量组成:位置、大小、形状、值、色调、方向和纹理。

根据 Bertin 的说法,下面的图表显示了可用于显示定性或定量差异的视觉变量示例。 它们还展示了一种通过点、线或区域呈现属性的方法。

威廉克利夫兰和罗伯特麦吉尔在 1984 年的一项研究根据人脑检测它们之间差异的难易程度,对两种形状可能具有的最常见方面进行了排名。 他们从最准确到最不准确对以下视觉特征进行了排序:

沿共同尺度定位

因为我们共享一个共同的空间参考系统,所以位置是最容易识别和评估空间元素的特征。

示例:条形图、散点图

数据可视化设计中的视觉变量

沿非对齐、相同比例的位置

即使它们没有对齐,也很容易比较使用同一轴重复的单独比例。 面板图表或“小倍数”就是一个很好的例子。 结果是一个图表网格,它们都遵循相同的视觉格式,但显示不同的数据集。 与单个较大的图表相比,小倍数有助于过度绘制,因为数据可能会因为绘制的项目太多而变得模糊或被遮挡。

示例:小倍数(又名 Rellis、Lattice、Grid 和 Panel 图)

小倍数的数据可视化最佳实践示例

长度

长度可以有效地表示定量信息,因为元素的长度可以缩放到它们表示的数据值。 即使物体没有对齐,人脑也很容易识别比例并评估长度。

示例:条形图

条形图是最好的数据可视化技术之一

方向

方向很容易被人眼识别。 例如,它可以使用折线图和趋势图来呈现随时间变化的数据。

示例:趋势图

趋势图在数据可视化设计中被大量使用

角度

角度通过提供比例感来帮助进行比较。 研究表明,角度比长度或位置更难评估。 但是,饼图与堆叠条形图一样有效,除非整体的部分超过三个。

示例:饼图

饼图可能是一种有效的数据可视化技术

区域

面积的相对大小与线的长度相比更难比较。 第二个方向需要更多的努力去处理和解释。

示例:气泡图

气泡图非常适合直观地呈现数据

体积

体积是指在二维空间中使用 3D 对象,这使得它们更难评估。 然而,研究表明,当比较相同维度的两种形状时,可以更准确地感知 3D 对象。

示例:3D 条形图

3D 条形图非常适合数据的可视化呈现

颜色饱和度

颜色饱和度是指单一色调的强度。 可以直观地将颜色强度的增加视为增加值的数量。 但是,很难准确地评估结果。

示例:热图

热图适用于大数据展示
(来源:我们的数据世界)

了解视觉变量的排名对于创建引人注目的数据可视化至关重要。 但是,这并不意味着设计人员需要将自己限制在条形图和散点图上。 Cleveland 和 McGill 指出,“排序不会导致显示数据的精确处方,而是一个可以在其中工作的框架。”

颜色

根据威廉·克利夫兰的说法,当涉及到模式和行为的感知时,色彩饱和度和阴影是最不准确的。 尽管如此,颜色仍然可以成为数据可视化设计人员在显示数据时传达意义和清晰度的强大工具。 然而,至关重要的是,设计师要了解颜色的工作原理以及它的作用和不好的地方。

上下文中的颜色

我们对颜色的感知取决于上下文、颜色及其与周围物体的对比。

一个很好的例子是日本立命馆大学心理学系教授 Akiyoshi Kitaoka 的一项实验,他将一张灰色纸滑过黑白渐变。 纸张似乎在左右移动时会改变颜色。 在每一刻,我们都会以不同的方式感知颜色,因为它周围有不同的灰色阴影。 请看下面的视频:

在他的文章在图表中使用颜色的实用规则中,Stephen Few 从这些观察中得出了一些实用规则:

  1. 如果您希望表格或图表中相同颜色的不同对象看起来相同,请确保背景(它们周围的颜色)一致。
  2. 如果您希望表格或图表中的对象易于查看,请使用与对象充分对比的背景颜色。

颜色讲故事

颜色不仅仅是装饰。 有意义和战略性地使用它是最好的。 颜色应该有助于讲述故事并传达所呈现数据集的目标。 俗话说“少即是多”。

对比色应仅应用于数据中含义的差异,以减少认知负担。 颜色还可以强调可视化的主要元素。

没有颜色并不会降低一个好的图表的效果。 灰色是构思阶段的一个很好的起点,一旦确定了一个焦点,颜色的应用就会强调那些部分。

数据可视化心理学利用良好的颜色组合
灰色条中的蓝色条清楚地向观众传达了焦点。

定义调色板

数据可视化设计师应用的一组颜色可以完全改变数据的含义。 许多工具可以帮助选择有意义的调色板,具体取决于数据的性质。 这里有一对:

  • 颜色布鲁尔。 调色板分为三种类型:
    • 分类(用于将项目分成不同的组)
    • 顺序(用于编码数量差异)
    • 发散
  • 即调色板。 Viz Palette 负责可访问性、针对色盲的设计以及感知上均匀分布的色调。 它包括一个“颜色报告”,用于识别在各种情况下可能看起来相同的色调。

将格式塔原理应用于数据可视化

感知的格式塔原则可以帮助阐明大脑在试图理解视觉信息时如何根据共同特征组织元素。 格式塔理论的基础是人类大脑将通过下意识地将各个部分排列成一个有组织的系统来创建一个整体,而不仅仅是一系列不同的元素,从而试图简化和组织由许多元素组成的复杂图像或设计。

相似

相似性原则表明,我们的大脑会自动将具有共享视觉属性的元素归为“相似”。 相似的颜色、相似的形状、相似的大小和相似的方向被视为一个群体。 下图说明了这一原则。

与左侧的图表不同颜色的条形相反,它们在右侧是相同的蓝色。 鉴于只有一个变量(成本/收入),这是有道理的。 使用相同颜色的条形可以更容易地理解数据,并消除由于在左侧使用不同颜色而造成的额外认知压力。

格式塔原则常用于数据可视化原则

接近

接近比相似更有效,因为人眼根据元素彼此之间的接近程度来感知元素之间的相关性。

在下面的图表中,目的是按国家/地区比较三个季度的销售额。 虽然很容易在一个季度内比较每个国家/地区的销售额,因为它们很接近,但按国家/地区分析销售额将具有挑战性。

通过采用最佳数据可视化工具使用的邻近原则来实现良好的分析

修改后的图表更清楚地传达了这一点。 在这种情况下,信息优先关注可视化目标,因为它使主要数据点更靠近在一起。

接近度是数据可视化原则之一

外壳

由 Palmer 于 1992 年引入的公共区域原则表明,如果元素共享一个公共区域,则具有明确定义边界的元素如何被视为一个组。

在下面的示例中,灰色阴影区域内的三个条似乎是一个组的一部分。 此技术可帮助查看者专注于图表中的一组对象。

数据可视化设计可以利用公共区域原则

结论

了解人类感知和认知过程的关键要素是设计出色数据可视化的重要部分。 在开发具有数据可视化需求的产品时——无论是 B2B 仪表板还是金融应用程序——设计师需要注意人脑的视觉感知过程和基本的数据可视化设计原则。

熟悉视觉感知的著名格式塔原则对设计师来说是一个很大的好处,并帮助他们了解大脑如何将复杂的图像转换为模式。 在设计数据可视化和设计更有效的图表时,牢记这些原则在实现更明确的视觉层次结构的过程中很有价值。

此外,了解预先注意的处理和视觉变量,以及颜色的正确应用,将使设计师能够创建更有效的数据可视化。


让我们知道您的想法! 请在下方留下您的想法、评论和反馈。

• • •

进一步阅读 Toptal 设计博客:

  • 最佳数据可视化工具的完整概述
  • 数据可视化——最佳实践和基础
  • 顶级数据可视化示例和仪表板设计
  • 仪表板设计 - 注意事项和最佳实践
  • COVID-19:终极设计思维用例