其它优秀文章推荐:

中文、西文字体基础应用方式讲解

快速避免【视觉无障碍设计】中的雷

非科班设计师的出路:抛弃切尔诺贝利式思维

文字编排、排版中那些实用的小技巧!

设计当中的图形与照片的区别与应用案例

视觉设计:15条科学上的设计法则讲解

Aesthetic Usability Effect 美即好用效应

当界面被设计得足够美观时,用户往往会容忍一些较为轻微、影响较小的可用性问题。

背景故事

1995年,日立设计中心的研究员Massaki Kurosu和Kaori Kashimura通过26种不同的ATM交互界面对252位参与者进行详细的用户体验测试,并对界面中表观可用性的决定因素(比如数字键布局、操作流程等)进行了评估。结果发现,这些因素中很大一部分对真实可用性的影响微乎其微,反而界面美观度对真实可用性的影响出乎预料的大。
注:文献中的数据表明,表观可用性的决定因素对真实可用性的影响系数大多在0.000-0.310之间,而界面美观度这个数据达到了0.589。

美即好用效应应用

很多手机厂商的都会在宣传广告上大力宣传自己手机的拍摄效果。大部分中国的年轻人更喜爱自拍效果好的手机。主打美颜镜头拍摄功能。人人都希望自拍美美的,都不太愿意看到自己的缺陷。
增长迅速的oppo、vivo这类手机,抓住了年轻人的心理,基本上每次找代言人的都是当红的,年轻人最喜欢的。这就是在产品设计中,正向地运用了美即好用效应。

视觉设计:15条科学上的设计法则讲解

美即好用效应应用

网红直播通过分享自己每天做了什么,分享喜欢吃的东西,并且教人化妆穿衣,迅速催生一大批粉丝。美即适用效应对经济产生了很大的促进作用。加入直播类附加功能的电商产品培养了大批量的网红博主进行卖货,可见美即适用是非常容易产生消费者的购买冲动的。
小红书通过打代购电商类产品的差异化,引进了明星来做网红直播这个概念又成功获取了大批量用户。同样是美即好效应的经典案例。

视觉设计:15条科学上的设计法则讲解

美即好用效应应用

微信读书首页使用横向滑动的卡片,一屏一张卡片一个主题,相比较其他读书类APP而言,这种界面的组织方式浏览效率不高,且浪费大量屏幕空间,但简洁、优雅的设计,就有了让我们多花一点耐心和操作成本看下去的欲望。
我们需要对具体的页面进行评估,强调视觉带来的体验是否能超过牺牲掉的交互体验。如果一味强调美观性,以此作为设计的主旨,是得不偿失的,也不是「美即好用效应的本意。

视觉设计:15条科学上的设计法则讲解

 

Attractiveness Bias魅力偏见

人们往往认为有魅力的人一定具备聪明、能干、高尚和友善说这些优点。

背景故事

当你需要在设计中运用人物元素的时候,就可以考虑借用魅力偏见的特征来强化整体的设计效果了。
如果是要使用女性形象的时候,有魅力的女性会更容易吸引用户,而在多数文化背景下,腰臀比为0.7的女性更加性感,而如果要使用男性形象的时候,腰臀比为0.9的男性会更加吸引人。
根据魅力偏见的规律,女性突出社会认知中的性象征(比如用口红来强调嘴唇),而男性表现出财富和地位的时候(比如手表、车和昂贵的服饰),会显得更有魅力。

魅力偏见应用

经典案例:1960年,理查德·尼克松与约翰·肯尼迪在竞选总统时进行的第一次辩论(也是美国历史上首次电视直播总统辩论),就是魅力偏见的典型案例,当时尼克松生病了,穿着浅色西装,脸色苍白也没有理容。而他的对手肯尼迪则穿着深色西装,进行了理容,并于辩论前特意在摄影棚演练了演讲稿、通过广播收听了总统辩论的人会认为尼克松赢得了辩论,但电视观众得出的结论却完全相反。

视觉设计:15条科学上的设计法则讲解

魅力偏见应用

当市场营销和广告涉及人的外貌时,设计师会考虑在设计语境中使用“魅力偏见”法则。
如果是用女性形象作为关键元素,有魅力的女性会更容易吸引用户,而在多数文化背景下,腰臀比为0.7的女性更加性感,根据魅力偏见的规律,女性突出社会认知中的性象征。

视觉设计:15条科学上的设计法则讲解

魅力偏见应用

当市场营销和广告涉及人的外貌时,设计师会考虑在设计语境中使用“魅力偏见”法则。
当设计重点是呈现一位有魅力的男人时,会展现其丰厚的财富和显赫的社会地位(比如让他穿上昂贵的服饰)。

视觉设计:15条科学上的设计法则讲解

 

Baby-Face Bias  娃娃脸偏见

我们看到娃娃脸的人或物,会感觉比成熟的脸庞更天真无邪,诚实无助。

背景故事

长着圆脸、大眼睛、小鼻子的人物常常会给人一种特别Q的感觉,更通俗的讲是具有娃娃脸的特征,这样的特征会让人觉得惹人怜爱、无助、诚实、真诚。这就是娃娃脸偏见,从某种程度上算是曲线偏见的一种外化延伸。
具有娃娃脸特征的人物形象,在日本动漫当中出现的比例极高,我们现在很难预估日本动漫依靠娃娃脸偏见到底挣了多少钱….扯远了。娃娃脸偏见并不只存在于日漫或者玩偶,在需要强调纯真、可爱这样的广告当中,选用娃娃脸的代言人,会非常有效果,而强调权威性的广告当中,选用娃娃脸的代言人效果会大打折扣。

娃娃脸偏见定义

娃娃脸的面部特征有:额头大,眼睛大,鼻子小,下巴小,嘴唇饱满。娃娃脸的相对面是成熟脸,具体特征有:高额骨,脸距窄等等。心理学上有一个现象叫“娃娃脸偏见”,就是说长得娃娃脸的人,会容易被人当做拥有小孩子的性格特点。比如说:不负责任、软弱、无辜、热情、容易疏忽犯错。同理,长得成熟的人,也会容易被当做拥有成熟的性格特点。比如说:强大、有能力、有威胁性、会故意加害于人。
视觉设计:15条科学上的设计法则讲解

娃娃脸偏见应用

设计产品或角色,如果需要明确的五官特征(如卡通角色或小孩),就要考虑到“娃娃脸偏见”。夸大新生儿特征(如大而圆的眼睛),可以使这种角色更有魅力。
案例:迪士尼公主

 

视觉设计:15条科学上的设计法则讲解

娃娃脸偏见应用

设计产品或角色,如果需要明确的五官特征(如卡通角色或小孩),就要考虑到“娃娃脸偏见”。夸大新生儿特征(如大而圆的眼睛),可以使这种角色更有魅力。
案例:Kakao Friends、Line Friends

视觉设计:15条科学上的设计法则讲解

 

Anthropomorphism  拟人化

人们喜欢赋予事物以人的外貌或性格特征。

背景故事

人们习惯于将事物拟人化,变成和人一样具有动作和表情的样子,这样就导致了拟人化外形的偏好。
具备拟人化外形的产品更能引发人们的情感共鸣,决定购买时往往忽略了产品的某些负面信息。而人们在购买非拟人化外形的产品时,更多地要理性地去评价该产品。
波状或沙漏状外形能让人联想到女性的身体;圆形能让人联想到婴儿的脸;有棱角的外形能让人联想到强健的肌肉和好斗的性格。
拟人化外形能引人注目,并容易与人建立起情感纽带。

拟人化应用

在过去的100年里,可口可乐的瓶子经历了不断的改进,更加拟人化的瓶子因其造型美观,且极富情感感召力得以脱引而出。

视觉设计:15条科学上的设计法则讲解

Classic Conditioning  条件反射

把某一刺激和某种身体或情感的反应联系起来的一种技巧。

背景故事

条件反射是指:两样本来没有任何联系的东西,因为长期一起出现,以后,当其中一样东西出现的时候,便无可避免地联想到另外一样东西,是有机体因信号的刺激而发生的反应。例如铃声本来不会使狗分泌唾液,但是如果在每次喂食物之前打铃,经过若干次之后,狗听到铃响就会分泌唾液,这种因铃声这个信号的刺激而发生的反应叫做条件反射,铃声叫做条件刺激。
利用条件反射来影响情感诉求,在设计中植入恰当的刺激因素以产生正面或负面的情感联想。

条件反射应用

案例:酒驾广告
Jacqueline Saburino的勇气,使这个抵制酒后驾驶的宣传更加震撼。她分享了她被酒后驾车的司机撞倒后的生命。看到Jacqueline收到的严重伤害,情感上的强烈反应会让我们联想到造成这种后果的行为。如果这个反醉驾宣传还不能让人在酒后开车前三思,那么就再没有别的方法能阻止这种行为了。

视觉设计:15条科学上的设计法则讲解

 

Face-ism Ratio  脸部主义比率

脸部与身体的比率,会影响对一个人的认识。

背景故事

比例高也就是脸部占了影像大部分空间,会让人专注于人物的智慧和个性特质。比例低也就是身体占了影像大部分空间,会让人专注于人物的身体和感官特质。高面子主义比例可用于设计目标需要有深度解读和联想时。
低面子主义比例可用于设计目标需要修饰性解读和联想。杂志,电影,和其他媒体中的男性形象,脸部主义比率要比女性高得多。这种情况在大多数文化中都会出现,一般认为,这反应了人们对男女性别的思维定势,至于为什么会这样,却没有定论可能是生理因素与文化因素混合作用。

脸部主义比率的应用

第一张的乔布斯更加具有智慧和气魄。如果一个比例是头顶到下颚的距离比上头顶到能看到身体最下面的距离。那上面乔布斯的三张图的比例刚好不断降低的。

视觉设计:15条科学上的设计法则讲解

脸部主义比率的应用

案例:杂志封面。多数杂志媒体中男士多数为脸部特写,而女士相对包含更多的身体部位。

视觉设计:15条科学上的设计法则讲解

Fibonacci Sequence  斐波那契数列

一个数列中的每个数字都是前两个数字之和。

背景故事
1,1,2,3,5,8,13…
斐波那契数列在自然界中也很常见。比如植物的花瓣、银河系中的漩涡星系、人手的骨头、人们由此推断出以斐波那契数列为基础的图案具有公认的美感。
斐波那契数列中后一个数与前一个数的比值越来越逼近黄金分割比例。
在设计构图、绘制几何图形或有机团,特别是需要表现多元素之间的和谐和韵律时,可以考虑运用斐波那契数列。

Golden Ratio 黄金比例

一个形状的两部分的比(如长宽比)约为0.6181。

背景故事

黄金比例是一个比较特殊的数学比例,通常我们会用线段分割来解释这个比例:把一条线段分割为两部分,较短部分与较长部分长度之比等于较长部分与整体长度之比,其比值是一个无理数,取其前三位数字的近似值是0.618。黄金比例之所以被冠名以“黄金”二字,自然是因为这个比例带来的和谐与美感。当你应用到设计作品中的时候,这种比例会营造出艺术感。

黄金比例的应用

《蒙娜丽莎》被人们喻为“永恒的微笑”。科学家们把这幅画放大30倍之后,恍然大悟,终于找到了这幅画迷人的原因所在一—这幅画,每个地方都保持着1:1.618这个黄金比例。
蒙娜丽莎的脸型接近于黄金矩形,头宽和肩宽的比接近于黄金比例。如果我们画一条黄金螺旋,这条黄金螺旋可以经过蒙娜丽莎的鼻孔、下巴、头顶和手等重要部位。这些设计,不知道是达芬奇有意为之,还是一种巧合?

视觉设计:15条科学上的设计法则讲解

黄金比例的应用

案例:自然生物

这条美丽的螺旋曲线出现在自然界很多的物种当中——藏类植物、花卉、贝壳,甚至飓风——这也许就是为什么我们会觉得他们具有强烈的视觉吸引力。因为毕竟,天然的就是最好的。

视觉设计:15条科学上的设计法则讲解

黄金比例的应用

使用黄金分割圆不仅能创建和谐、均衡的设计,也能保持格式的一致性。
Twitter的标志基于几何结构并重点利用了圆的完美。从下面这张图我们可以看出,它确实是运用黄金比例绘制的,但不完全精确。百事可乐的标志基于两个按照黄金比例相交的圆。

视觉设计:15条科学上的设计法则讲解

黄金比例的应用

案例:《神探夏洛克》
除了抓人的剧情,高智商的男主,还有精妙的构图,有一条无形的螺线引领着你的眼睛。
以黄金螺旋分割画面,或将拍摄主体放在螺旋紧处,是符合审美观的一种构图方法。宽屏画面的黄金分割,需先将构造出黄金矩形,截图中用白色粗线调标示

视觉设计:15条科学上的设计法则讲解

Rule of Thirds  三分定律

把媒介分为三部分,把设计的主元素放在网格中的一个交叉点。

背景故事

三分法,有时也称作井字构图法,是一种在摄影、绘画、设计等艺术中经常使用的构图手段,这是最基本又最稳妥的构图手法,一般情况下都适用。在这种方法中,摄影师需要将场景用两条竖线和两条横线分割,就如同是书写中文的“井”字。
把主体放置在分界线或点上,又或将画面以三份作分配,使主体突出之余,亦保留了恰当的空间感,让人看得舒服。另外,如果把空间分成三份来分配,也会得到很舒服的效果。这是在一般风景摄影或建筑摄影常用的构图法。

三分定律的应用

案例:摄影构图

视觉设计:15条科学上的设计法则讲解

三分定律的应用

案例:网站设计:Adobe、MUJI

视觉设计:15条科学上的设计法则讲解

Top-Down Lighting Bias由上而下的光源偏见

人们倾向于接受被顶端单一光源由上至下照耀的物体。

背景故事

人类普遍认为物体是由上方的单一光源照射而来。在不同的年龄和文化层中,都存在这种偏见,原因很可能在于人类是在太阳照射下的环境演化而来。如果人类是在超过一个太阳的太阳系中演化,这项偏见就会不一样了。
人们的偏见在于认为,暗色或阴影区常离光源最远,而浅色区离光源最近。因此,上面颜色浅、底下颜色深的物体,会被视为凸起的;上面颜色深、底下颜色浅的物体,会被视为是凹陷的。在这两个例子中,明暗区域的对比增强,深度也会增加。如果物体对阴影的提示很模糊,大脑的认知就会在凹凸之间来回转换。

由上而下的光源偏见的应用

同样的两个人,一个光源在左上角显得很正常,一个光源在下方显得很诡异可怕。

视觉设计:15条科学上的设计法则讲解

由上而下的光源偏见的应用

案例:万圣节/恐怖电影

视觉设计:15条科学上的设计法则讲解

Gloss Bias偏爱光泽

人们倾向于偏爱有光泽的物体胜于暗淡的物体。

背景故事

人们发现色彩亮丽的物体比色彩暗淡的物体更有趣、更有吸引力。例如人们通常会喜欢亮色口红、闪闪发光的珠宝、光亮的纸张、鲜艳的色彩等,即使是小孩子,也喜欢选择有光泽的东西来舔食啃咬。
这种偏好可能是人类在不断进化过程中形成的,具备寻找到水源的能力是人类得以生存繁衍的优势,而有光泽的表面预示着附近有水源。
为设计作品选择罩面漆时要考虑到人们偏爱光泽的特性,这一偏好几乎适用于所有物品和形象设计。大部分观众对亮丽色彩有很强的偏好,但也有少部分人没有这种偏好。

偏爱光泽的应用

案例:化妆品

视觉设计:15条科学上的设计法则讲解

偏爱光泽的应用

案例:汽车

视觉设计:15条科学上的设计法则讲解

偏爱光泽的应用

案例:3C产品

视觉设计:15条科学上的设计法则讲解

Horror Vacui恐惧留白
人们倾向于渴望用物品将空白处填满,而不留任何剩余空间。

背景故事

恐惧留白 – 来自于拉丁语和希腊语,意思是用细节填充整个空间或艺术品的表面。就风格而言,正好与极简主义相反。
高端品牌的橱窗,更倾向于以创意取胜,并不会展示很多的产品,而且产品不会有明显的价格标牌;而一些连锁店更倾向于在橱窗中摆放大量的模特和很多很多的产品,这个就是「恐惧留白,的感知研究。研究表明:恐惧留白和价值感受之间存在一定反比关系,恐惧留白越高,价值感就越低。

恐惧留白的应用

案例:维多利亚风格
在维多利亚时代,英国的政治、经济、社会皆飞速变化,其最显著的结果就是富裕的中产阶级的剧增。财富的拥有及身份的提升唤起了中产阶级改变居住环境和室内装饰样式的意识,他们急于在住宅建筑上明确和标榜他们的成就。于是,以装饰为主的「维多利亚风格]应运而生。意大利艺术评论家兼学者Mario Praz用「恐惧留白」描述维多利亚时代令人窒息的风格和室内杂乱的设计。

视觉设计:15条科学上的设计法则讲解

 

恐惧留白的应用

案例:《凯尔斯书》
“恐惧留白”的代表作——《凯尔斯书》(Book of Kells)是爱尔兰中世纪手抄本中最精美的一部。其中美丽的插图作品代表了中世纪爱尔兰凯尔特美术的最高成就。这些书法与绘画以法琅工艺品般的密集形式作于暗色羊皮纸上,看上去仿佛是由几个画匠合作的成果。这些作品以其完美纹饰以及美轮美奂的色彩而达到动人心魄的效果。其绘画之精细,装饰之繁复,使观者必须借助放大镜才能看清全部画面。

视觉设计:15条科学上的设计法则讲解

“恐惧留白”和“价值”的关系

高端品牌的橱窗,更倾向于以创意取胜,并不会展示很多的产品,而且产品不会有明显的价格标牌。
而一些连锁店更倾向于在橱窗中摆放大量的模特和很多很多的产品,这个就是“恐惧留白”的感知研究。
恐惧留白和价值感受之间存在一定反比关系,恐惧留白越高,价值感就越低。

视觉设计:15条科学上的设计法则讲解

Wabi-Sabi  残缺之美

崇尚自然、朴实和略有瑕疵的一种审美风格。

背景故事

Wabi是指以略有瑕疵的方式呈现出来的美,Sabi是指岁月流逝所产生的美。
残缺之美和许多人们固有的偏好和审美习惯相悖。残缺之美能够满足某些具有复杂设计敏感性人群的需求,在设计中可以对能体现无常、瑕疵、不完整性的元素加以利用;想要表现残缺之美,造型应以有机形状为首选,而对于颜色的选择要偏重于自然色、天然颜料。
它承认三个简单的事实:没有什么能长存,没有什么是完成的,没有什么是完美的。接受这三样事实,就能接受满足是一种成熟的快乐。

残缺之美的应用

案例:日式庭院

视觉设计:15条科学上的设计法则讲解

残缺之美的应用

案例:器皿

视觉设计:15条科学上的设计法则讲解

Syummetry  对称

对称是指各元素间的视觉等效性。

背景故事

对称是自然界中普遍存在的特性,是美最基本、最经久的一个方面。
对称分为三种基本类型:镜像对称、旋转对称和平移对称。镜像对称是指元素绕中轴或镜线的映射效果。旋转对称是指元素绕着同一个中心点做旋转。平移对称是指将相同的元素放置在不同空间区域的位置。
在设计中运用对称来表达平衡、和谐和稳定。简单的对称表现能增强设计的可识别性和可回忆性,不同对称类型的组合使用则能强化设计的美感和趣味性。

对称的应用

案例:西方建筑设计

视觉设计:15条科学上的设计法则讲解

对称的应用

案例:东方建筑设计

视觉设计:15条科学上的设计法则讲解

对称的应用

案例:LOGO设计

标识设计一般都是以简单易识别的图形、符号或文字来设计的,可以说是视觉传达最有效的手段之一。比如这些经典的标识设计,遵循的设计理念都要考虑到受众的审美心理以及受众的接受程度,所以也就有大量对称形式的出现。

视觉设计:15条科学上的设计法则讲解

Closure  闭合原则

人们倾向于把不完整或者有缝隙的形状或图案看成完整的事物。

背景故事

格式塔认知理论中的一个原则。人在自然中,能利用闭合发展为一个完整的威胁侦测形状,让人类的祖先本能地侦测到暗藏的危险,比如草丛中有蛇。
简洁的图案或各元素的紧密并置最能产生强烈的闭合感。利用闭合原则来删繁就简,从而增强设计的趣味性。如果设计的图案线条简洁且容易辩认,可以考虑将多余的部分移除,让观者下意识地靠想象力在心理上把省略的部分填补完整。这样一来不仅强化了设计的辨识度,还能使设计更加有趣。

闭合原则的应用

案例:LOGO设计

视觉设计:15条科学上的设计法则讲解

视觉设计:15条科学上的设计法则讲解

 



属性标签: , , ,

欢迎留言

页面生成消耗的时间 0.425 秒,此页面一共查询了 117 次数据库!缓存时间:2020-11-27 04:52:41你的IP为:34.200.252.156