|
|
# 21｜基于人因的美学设计：数学与心理学之美
|
|
|
|
|
|
你好，我是Rocky。
|
|
|
|
|
|
今天我们来谈谈美学设计。美学是一个极富争议性的话题，甚至被很多人称为玄学。很多大师都尝试去阐明这个概念，阐述的维度也各有不同。但迄今为止，仍很难达成一致的共识。美学大师蒋勋在大学教了美学几十年，最后离开了大学。他有一句非常经典的话是这么说的：“少谈些美学，多谈些美”。因为相当多的美学问题都难以形成一致的答案，比如：
|
|
|
|
|
|
* 美学和艺术的关系是什么？
|
|
|
* 如何看待美和时尚？
|
|
|
* 美是一种事物的客观存在，还是一种主观的认知？
|
|
|
* 美和欲望、愉悦的关系是什么？
|
|
|
* 什么叫更有品味？如何界定低俗的美和高雅的美学品味？
|
|
|
* 怎么评价一个设计是美还是不美？
|
|
|
* 如果受众是不确定的，如何兼顾不同人的美学标准？
|
|
|
|
|
|
既然我们这是人因系列课，那么我们谈的美学设计，一定也是基于人因来思考：美是怎么来的？
|
|
|
|
|
|
下图是一个理解美学的基础研究框架，这里面会有人的因素、思维逻辑因素、时间因素、跨文化因素、心理学和生理学因素，以及表达美学的载体：内容的因素。
|
|
|
|
|
|
|
|
|
|
|
|
介于这个话题的复杂性，今天这节课我不会明确告诉你什么样的设计才是美的。因为即便告诉你，你我之间其实也很难达成共识。如果你对于“什么设计是美的”或者“美是怎么来的”这一系列问题有自己的想法，欢迎在留言区留言，我们共同进一步探讨。
|
|
|
|
|
|
今天我们会从两个维度来谈美学：
|
|
|
|
|
|
第一，从心理学认知上，有没有对美学的共识？如果有，在设计中如何体现这种共识？
|
|
|
|
|
|
第二，大自然美学的东西有没有特殊的规律？如果有，我们如何掌握这种规律，在设计中体现这种美？
|
|
|
|
|
|
## 认知心理学意义上的美
|
|
|
|
|
|
我们首先来看看心理学上的美学认知。人对美的感知分为两个层面：
|
|
|
|
|
|
* 本能层的直观美的感受；
|
|
|
* 对内容或者上下文有深入理解的反思层美的感受。
|
|
|
|
|
|
比如看到樱花落下，这种视觉冲击的感受就是属于本能层对美的感受。但是当理解到樱花短暂的开放期以及日本的武士道壮烈赴死的一种精神内核，再接着对樱花产生深层次的美感，这就属于反思层美的感受了。
|
|
|
|
|
|
这两个层次都会受到不同的情绪和心境的影响，具体关系你可以参考下面这张图。
|
|
|
|
|
|
|
|
|
|
|
|
从心理学上来看，任何美的感受都是两个层次的综合体现。一个设计或者创作，如果只单纯追求感官刺激的表现，会容易被理解为低俗。而如果过于强调内容深层次的激发但缺乏感官刺激，就容易被认为是曲高和寡。
|
|
|
|
|
|
### 具象和抽象
|
|
|
|
|
|
不管是否有艺术修养和艺术品位，大多数人都会觉得文艺复兴时期的艺术是美的。一直到新古典主义，甚至在印象主义之前（比如大部分的浪漫主义、现实主义作品）的艺术里，大部分人还是可以感受到美。
|
|
|
|
|
|
|
|
|
|
|
|
但之后到了莫奈的《睡莲》、《日出·印象》，大众就有很多看不懂了。更不用说保罗塞尚那明显不符合透视学的《有苹果的静物》、亨利·马蒂斯寥寥数笔点彩的《奢华、平静和愉悦》，再到后来画《线》的巴尼特·纽曼、割画布的卢齐欧·封塔纳，甚至杜尚把小便池直接搬上了艺术展览会。
|
|
|
|
|
|
如果你对我抛出来的一系列作品没有直观感受，你可以参考下面的这个示例图片。
|
|
|
|
|
|
|
|
|
|
|
|
现在大部分人即便看不懂，也不太敢说这不算艺术，因为担心被嘲笑缺乏品味。巴尼特·纽曼的《线》，是世界上最贵的一条直线，拍卖价格是7.484亿美元。
|
|
|
|
|
|
不管怎么惊叹唏嘘，人们还是要不免小声问一个问题：这些作品真的美吗？为什么我们对文艺复兴作品有那么大的美的共识，而面对这些现代艺术形态的时候却彷徨了呢？
|
|
|
|
|
|
因为文艺复兴时期的作品严格遵循了自然的规律，风格上都是符合透视学、人体比例和自然色彩的映射，这使得整体作品更偏向于严谨的理性主义表达，符合常识和自然的规律。
|
|
|
|
|
|
这个在心理学上就属于具象模仿、现实映射的艺术表达手法。即便不思考、不了解画的任何背景，也能激活用户本能层美的体验，也更容易激活后续的反思层体验。
|
|
|
|
|
|
但到了现代艺术阶段，大部分艺术家不追求模仿，他们追求的是主观的表达，并不介意自己的画作是否被他人理解。这就导致了能欣赏这些艺术的，都是有特定美学教育的人群。在绝大多数情况下，激发的是反思层的认知美。如果你不了解艺术家创作背景，那就很难产生情感共鸣了。
|
|
|
|
|
|
对应到体验设计上，我们在开始创作海报、手机默认壁纸之前， 就会先面对一个方向性的选择：到底是具象还是抽象？
|
|
|
|
|
|
答案取决于你希望给用户一种直观的视觉冲击、拉近情感距离，还是希望营造一种有距离感的品味？如果是前者，请选用具象视觉表达方式。如果是后者，可以采用抽象表达。
|
|
|
|
|
|
|
|
|
|
|
|
比如上面这两幅杀死比尔的海报，左边和右边的海报设计手法完全不一样。
|
|
|
|
|
|
左边是具象化表达，女主角持武士刀，昂着头，下巴前倾，轻蔑挑衅的眼神与观者灵魂对视。采用了巨大的杀死比尔的无衬线字体标题，并在背后用一个黑色长条分割画面，做视觉的平衡。
|
|
|
|
|
|
右边的海报是抽象化表达，完美遵循了少就是多的表达手法，用硬朗粗狂的笔触，在一个黑色竖线的上面斜划过一道红线来映射快速挥刀的暴力美学。不同的人对这两款海报各有偏爱，前者更为直观，后者更为含蓄。
|
|
|
|
|
|
### 图形复杂度如何对第一印象的美产生影响
|
|
|
|
|
|
我们的大脑一直在寻找事物的规律和模式。如果事物很简单，那么我们的大脑很容易就会找到模式，接着很快失去兴趣觉得无聊。但是如果事物的复杂度太高或者杂乱无章，大脑就会不知所措，使我们沮丧和恼火。**美丽在于混乱与结构之间的最佳结合。**
|
|
|
|
|
|
大量心理学和人机交互的实验表明，人们对视觉复杂度的愉悦性认知是一个反U形曲线。人们不喜欢过于简单或者太过复杂的图案，复杂度适中的图案愉悦性最高。
|
|
|
|
|
|
|
|
|
|
|
|
我下面列了两种类型的图形，左半边的16个和右半边的16个图形，哪个部分给你的美学感受更强烈一些？
|
|
|
|
|
|
|
|
|
|
|
|
你可以再回想一下刚刚提过的杀死比尔抽象版海报的构图，其实没有那么简约。从那一竖一撇中，我们还是看出那粗狂的笔触里笔刷划过油布产生的细节。以此类推，为什么毛笔字写出来能比中规中矩的印刷体（比如黑体）更具美感？因为毛笔书法带有更多的运笔细节。
|
|
|
|
|
|
我再举一个例子。在进行圆角矩形控件设计的时候，很多应用都是直接一个圆拼上一个矩形的边，以此来画圆角矩形，或者用曲率半径一致的一些曲线来拼接。但这种圆角矩形就会看起来比较简单。
|
|
|
|
|
|
苹果的圆角采用的是不同曲率的10段曲线相连，这些曲线全部为 3 阶贝塞尔曲线，导致前后相连肉眼可辨别的曲率连续，这样也就产生了非常流畅的直线到曲线的过度。这种刻意复杂度的增加就是在提升视觉的愉悦度，所以苹果的圆角看起来会更美。
|
|
|
|
|
|
|
|
|
|
|
|
## 数学之美
|
|
|
|
|
|
刚才最后一个复杂度的这例子，恰巧也可以引出来另外一个我们要聊话题：美和数学有什么关系？
|
|
|
|
|
|
说到美和数学，很多人第一时间想到的可能就是黄金分割。黄金比例又叫斐波那契数列，确实有诸多美的自然界的案例能够印证这个比例规律，从螺纹、松果到向日葵和野雏菊的花朵……
|
|
|
|
|
|
但自然界呈现的数据之美不止于黄金比例，不要将黄金比例过度解读或者玄学化（比如用黄金比例来分析揣度所有的优秀摄影作品、名画作品和黄金分割之间的关系）。
|
|
|
|
|
|
数学公式本身就是从自然界发现的极致规律，如果将这些数据手段运用在设计中，会带来非常奇妙的美学感受。我在[05](https://time.geekbang.org/column/article/347116)里提到过，华为曾经做了一套符合黄金比例的桌面图标。不过对数学美学的运用远远不局限于此。我在这里再和你聊聊两种手法：分形和混沌。
|
|
|
|
|
|
### 分形
|
|
|
|
|
|
斐波那契数列本身就是一种分形。分形的魅力在于不管在多小的尺度上，都能表现出相似的无限演变、无穷嵌套的结构。它可能是完全自相似的无限分形，也可以是某些随机变量的模式的重复。正因为即便无限放大也无法找到整齐缩放和重复的片段，这也恰恰巧妙验证了一种极为复杂的表现手法与规律性的平衡。
|
|
|
|
|
|
|
|
|
|
|
|
我们在自然界能观测到的分形多为静态生成，比如树枝的生长、北方窗户上的冰晶、葵花籽的螺旋排序。任何动态或者夸张展示分形的艺术和设计，都会在人的认知层面给人非常强烈的魔幻、神秘、未来、哲学的反思层的体验激发。因此你也会在很多表达类似主题的场景中看到这种设计，例如漫威电影中的《奇幻博士》和《银河护卫队》。
|
|
|
|
|
|
|
|
|
|
|
|
### 混沌
|
|
|
|
|
|
混沌是自然界更为常见的一种规律。混沌貌似无序，但是还没有达到完全无序的状况（特别是在某种条件约束下的混沌）。某些贝壳表面貌似无序的花纹和烧制后带有碎纹的瓷器有异曲同工之妙。
|
|
|
|
|
|
|
|
|
|
|
|
这种混沌也是当代经常被使用的一种视觉表达手段。你会在非常多的手机壁纸里看到类似的作品。有边界、有约束的混沌，恰巧反映了有张力的自然之美。下图是华为的一系列壁纸，你可以感受一下。
|
|
|
|
|
|
|
|
|
|
|
|
我曾拜访过一家巴黎的摄影艺术家工作室，令我印象极其深刻。他的工作室在一个郊区别墅的地下，别墅里有各种五颜六色化学物质的瓶瓶罐罐，仿佛中欧神秘巫师的实验室。他在一架巨大可以垂直水平平稳移动的装备上放置了一台超微摄像装置，他通过这样的装置放大微距层面的混沌反应（或物理的、或化学的），这些照片影像都像极了星云运转和恒星爆炸的震撼。
|
|
|
|
|
|
除了自然和实验模拟的混沌，在大数据时代，海量的元数据本身就是一种混沌。这些元数据的视觉表达往往会传达意想不到的美学体验。比如下图就是创作者把气象图的原始数据进行叠加视觉处理，最终形成了绚丽的艺术作品。
|
|
|
|
|
|
|
|
|
|
|
|
## 总结
|
|
|
|
|
|
好了，讲到这里，今天的内容也就基本结束了。最后我来给你总结一下今天讲的要点。
|
|
|
|
|
|
今天我们先谈了美学研究的基础框架，以及影响美感的一系列复杂因素的整合。我们重点从认知心理学维度和数学之美两个维度来聊了一下美学的理解。
|
|
|
|
|
|
具象模仿表达美遵循自然规律，理性客观，更容易被多数人理解，能快速激发本能层美的体验。抽象含蓄表达美追求创新，观念突破，主观表达，比较难以被大众理解。前者容易拉近和用户的情感距离，后者会更能够塑造距离感和品味感。
|
|
|
|
|
|
人脑对复杂度有一个反U曲线的认知规律。我们不喜欢过于简单，也无法接受难以找到规律的复杂。适中的复杂度愉悦性最高，那么如何寻找适中的复杂性就变成了设计的关键。苹果的连续3阶贝塞尔曲线的圆角矩形，就是通过刻意增加复杂度来提升视觉愉悦度的很好例子。
|
|
|
|
|
|
黄金比例自然是非常好的表达设计的手段，但不要泛化和过度解读艺术品对黄金比例的遵循。自然界中的数据规律很多，分形和混沌同样会带来美学体验。
|
|
|
|
|
|
非自然或者动态分形设计会激发魔幻、神秘、未来、哲学的反思层的体验。而某种条件约束下的混沌，则恰巧反映了有张力的自然之美，后者在很多壁纸的设计中被广泛采用。大数据也可以通过混沌美学来直观生动地表达。
|
|
|
|
|
|
## 作业
|
|
|
|
|
|
最后，给你留了一个小作业，从今天我讲的内容，谈谈你如何运用心理美学的知识在你的设计中？当然，我们开篇提到的一系列有关于美学的问题，也欢迎你在留言区发表你的想法，我们共同探讨。
|
|
|
|