数据可视化中的格式塔心理学

╰+攻爆jí腚メ 2022-11-15 11:37 178阅读 0赞

> 全文共2850字，预计学习时长8分钟

![数据可视化中的格式塔心理学][1c68af5213201bff0b79c4e13b8cb7e8.png]

图源：Google

数据可视化不只是把数据整合成直观漂亮的图表那么简单。想要把数据可视化做得出色，你需要掌握一些基础知识。了解特定的数据可视化技术比其他技术更有效的原因可从心理方面入手。不知你是否觉察到，每次创建可视化视图像时都可以应用各种心理学原理。

格式塔是20世纪初由德国心理学家马克斯·韦特海默（Max Wertheimer）(1880-1943)及其同事库尔特·考夫卡（Kurt Koffka）(1886-1941)和沃尔夫冈·柯勒（Wolfgang Kohler）(1887- 1967)发展起来的一种有影响力的人类心理学理论。

该理论研究了大脑如何在默认情况下创建结构。它对所呈现信息的含义影响深远。德语单词“gestalt”在英语中意为“统一的整体”，往往能让人联想到“整体大于其各个部分之和”这一概念。

· 简单原则——我们的眼睛在复杂的形状中寻求简单，避免被信息过载淹没。

· 接近原则——我们将彼此靠近的对象视为一个群组。

· 相似原则——我们寻找相似之处和不同之处，并将相似元素组合在一起。

· 图形与背景关系原则——我们倾向于将视觉世界分为图形和背景。图形是焦点元素，背景是指图形背后的底板。

· 视觉焦点原则——视觉上突出的内容将得到更高的关注。

你看到的画面和脑海中感知到的图像是不一样的。格式塔原则适用于视觉感知，这些原则详细阐释了大脑如何在默认情况下创建结构。

剑桥大学的研究表明，单词中字母顺序如何排列并不重要，重要的是第一个和最后一个字母的位置是否正确。其余部分可能完全混乱，但不影响阅读。这是因为人类大脑并不是逐个字母阅读，而是把单词作为一个整体来看。

格式塔原则通过科学验证解释了寻找图像这种与生俱来的人类行为，视觉艺术家可以用其设计传递信息最有效的图像。设计师们并不是仅凭直觉和想象力来创建图形和满足用户体验。不管他们自己是否意识到，大多数设计师都遵循格式塔原则。

![数据可视化中的格式塔心理学][acc50f6b8726639f4ced3d96ab629507.png]

摘自2020年数据可视化竞赛Ironvizzes，图源于Will Sutton的博客。

简单原则

简单原则也被称为the Law of Prägnanz。在德语中，Prägnanz的意思是精辟简洁，指简洁而有意义的行为。

![数据可视化中的格式塔心理学][a2aefe431d7c07265f68d3a606d17da2.png]

![数据可视化中的格式塔心理学][3f377d349f83ae43282b3d82e497f366.png]

数据可视化中的简单原则应用案例。

A图和B图哪个更容易读懂?——进行排序的图B更清晰。

简单原则是指用最少的认知努力去感知视觉意义的能力。因此，这一原则也被称为优图原则（the Law of GoodFigure）。为了避免信息过载，人类在复杂形状中寻求简单性。

简单的图表更适合传达数据，比视觉上复杂的图表更容易处理和记忆。设计者应采用诸如项目分类、取消使用多种颜色、简化或减少行话等办法，以减轻认知负担。

接近原则

![数据可视化中的格式塔心理学][539a4a2ac487ab12c783158dac3034ee.png]

![数据可视化中的格式塔心理学][389f652d3c706e882fe82f42a5e47d52.png]

接近原则在数据可视化中的应用案例。

A图和B图内可以关联多少个标签？当标签靠近图形元素（此处指Chinstrap 34 g）时，很容易将其标识为B图内。

相较于间距较远的元素，位置彼此接近的元素会被看作是一个整体的一部分，在这些不同元素之间的距离比其他元素更近时更是如此。视觉相关的元素至关重要，有利于观众浏览已知信息并尽可能轻松地加以理解。接近原则用于传达关系。设计者可以通过组织每个群体周围的空间来帮助观众构建信息并更好地感知意义。

相似原则

根据这一原则，相似的元素在视觉上进行分组，而不管它们彼此是否位置接近。分组可以发生在视觉和听觉刺激中。人们倾向于寻求同质性。在下面A图数据可视化（dataviz）中，有多少组？

![数据可视化中的格式塔心理学][af5defe0a695ea178507db1a1e3bb617.png]

相似原则在数据可视化中的应用案例。

现在，看下面的数据可视化，能看到有多少组？

![数据可视化中的格式塔心理学][10a7c2607017a73f6d0d7b70f49fadaa.png]

相似原则在数据可视化中的应用案例。

看，添加颜色后，你的大脑现在可以识别不同的群组(对于视力正常的人而言)。设计者可以使用相似的特征和属性(颜色、大小、形状等)来建立物体之间的联系并明确分组。

图形与背景关系原则

图形与背景关系原则阐释了通过感知形式和周围空间之间的关系从而创建意义的能力。整体感或统一感取决于如何看待一个物体与其所在区域之间的关系。“图形”是视觉焦点元素，“背景”是指图形背后的底板。

此原则的核心要义在于，眼睛会将整个图形从背景中分离出来以理解内容。这是人们在观察任何图像时要做的第一件事。人类不可能单单从视觉上组织信息，主体需要一种特殊的对比，才能从数据中获取信息。

以下，A图和B图哪个更易读？

![数据可视化中的格式塔心理学][b3340b53f5f1fcfecc7e357185185431.png]

![数据可视化中的格式塔心理学][5c9ec652cc83f4984fdd47f73a3eb62a.png]

图形与背景关系原则在数据可视化中的应用案例。

A图中图形(面积图)和背景(纸张颜色)之间的对比度低，需要额外的认知负荷。更改或者增加对比度(如B图)可以提高可读性。图形与背景关系原则是指从背景切换到前景从而创造整体的能力。在dataviz工作中实现这一点有以下方法：

· 模糊性:图形中物体趋向于清晰分明，而背景中的物体则模糊不清。

· 大小:看起来较大的图像被视为更近，是图形的一部分，而较小的图像看起来更远，是背景的一部分。

· 对比度:高对比度可以更易区分两种类型的物体，因此物体之间具有高对比度会更易感知图形和背景。

想想奥克塔维奥·奥坎波（Octavio Ocampo）的作品，其广泛运用了这一理念。

![数据可视化中的格式塔心理学][b9b4670234d753610feff08a11ece6de.png]

奥克塔维奥·奥坎波的《海之吻》（Kiss of the Sea）

如上图，你要么看到一对情侣，要么看到一棵树，取决于是把深色看作图形，蓝色看作底色，还是相反。图形与背景的关系原则是logo设计中常用的原则。设计者应该使用此原则来引导观众看到可视化的焦点。

视觉焦点原则

视觉焦点原则指出，任何视觉上突出的元素都将得到受众的优先关注。换句话说，与其周围环境不同的元素更引人注目。

![数据可视化中的格式塔心理学][67ec0f46057d486d656d9c0f06bb9caa.png]

![数据可视化中的格式塔心理学][06bb730a1d3d348fcb4e162ae37877d0.png]

数据可视化中的视觉焦点原则应用案例。

你对A图和B图的注意力都集中在哪里？B图中，用颜色突出显示的委内瑞拉可能更引人注意。

视觉焦点原则和相似原则密切相关。为了吸引注意力，周围的元素应该是相似的。

数据可视化师可以通过有针对性地设置焦点来吸引受众的注意力。设计者可以使用高亮显示和来自其他图表元素中不熟悉的形状或颜色等方法来突出一个焦点。而且，不必只局限于一个焦点。然而，不同的焦点会分散观众的注意力，所以本文建议简单化，关注单一图像中的一个或两个焦点。

格式塔原则是在头脑里，而不是眼睛中。通过了解人们如何看待图表和布局，可以构建心理稳定的视觉效果，从而有效地传达信息。下次你看到某个图像时，不妨问问自己：这里是否应用了格式塔原则？这些原则是单独使用还是组合使用？

![数据可视化中的格式塔心理学][829c3a816b6b24cdce43d3a4255d9252.png]

**一起分享AI学习与发展的干货**

**欢迎关注全平台AI垂类自媒体 “读芯术”**

![format_png][]

（添加小编微信：dxsxbb，加入读者圈，一起讨论最新鲜的人工智能科技哦～）

[1c68af5213201bff0b79c4e13b8cb7e8.png]: /images/20221022/e4fb5bccdd764ed98cf2935802eaf18a.png
[acc50f6b8726639f4ced3d96ab629507.png]: /images/20221022/24b6b205293b46fc9a5924bb2dcec515.png
[a2aefe431d7c07265f68d3a606d17da2.png]: /images/20221022/a6d1f793510a4ba280c51319f2e7cb7d.png
[3f377d349f83ae43282b3d82e497f366.png]: https://img-blog.csdnimg.cn/img_convert/3f377d349f83ae43282b3d82e497f366.png
[539a4a2ac487ab12c783158dac3034ee.png]: https://img-blog.csdnimg.cn/img_convert/539a4a2ac487ab12c783158dac3034ee.png
[389f652d3c706e882fe82f42a5e47d52.png]: https://img-blog.csdnimg.cn/img_convert/389f652d3c706e882fe82f42a5e47d52.png
[af5defe0a695ea178507db1a1e3bb617.png]: https://img-blog.csdnimg.cn/img_convert/af5defe0a695ea178507db1a1e3bb617.png
[10a7c2607017a73f6d0d7b70f49fadaa.png]: https://img-blog.csdnimg.cn/img_convert/10a7c2607017a73f6d0d7b70f49fadaa.png
[b3340b53f5f1fcfecc7e357185185431.png]: https://img-blog.csdnimg.cn/img_convert/b3340b53f5f1fcfecc7e357185185431.png
[5c9ec652cc83f4984fdd47f73a3eb62a.png]: https://img-blog.csdnimg.cn/img_convert/5c9ec652cc83f4984fdd47f73a3eb62a.png
[b9b4670234d753610feff08a11ece6de.png]: https://img-blog.csdnimg.cn/img_convert/b9b4670234d753610feff08a11ece6de.png
[67ec0f46057d486d656d9c0f06bb9caa.png]: https://img-blog.csdnimg.cn/img_convert/67ec0f46057d486d656d9c0f06bb9caa.png
[06bb730a1d3d348fcb4e162ae37877d0.png]: https://img-blog.csdnimg.cn/img_convert/06bb730a1d3d348fcb4e162ae37877d0.png
[829c3a816b6b24cdce43d3a4255d9252.png]: https://img-blog.csdnimg.cn/img_convert/829c3a816b6b24cdce43d3a4255d9252.png
[format_png]: https://imgconvert.csdnimg.cn/aHR0cHM6Ly91c2VyLWdvbGQtY2RuLnhpdHUuaW8vMjAxOS85LzEwLzE2ZDE5NjEzMjBmMTY5YmM?x-oss-process=image/format,png