UI设计中的格式塔原理

Recommand
Shenzhen/UI designer/4 years ago /757浏览
UI设计中的格式塔原理Recommand
四爷oo

格式塔的原理怎么在ui设计中体现?



您是否曾经看过天空,注意到一团异常形状的云,类似于熟悉的动物或物体?您是否曾经想过,为什么或仅通过查看蓬松的一团气体来建立这种关联?这都是因为您的大脑如何运作!


您的大脑总是在尝试通过比较以前的经验或视觉模式并连接各个点来理解世界。它具有感知形状和形式,对信息进行分组,填补空白以绘制全局的“怪异”方式。

了解大脑的运作方式将帮助您成为明智的设计师 ; 视觉传达的主要操纵者。它可以帮助您确定在任何给定情况下哪种视觉元素最有效,因此您可以使用它们来影响感知,引导注意力并引起行为改变。面向目标,解决问题的直观设计时特别有用的东西;用户界面设计

优秀的设计师了解心理学在视觉感知中的强大作用。当某人的眼睛与您的设计见面时会发生什么?他们对您分享的信息有何反应?”

— Autodesk品牌内容策略师Laura Busche

现在很明显,视觉设计和心理学已经联系在一起并且可以相互影响。格式塔原理可以帮助我们理解和控制这些链接。


什么是格式塔?

格式塔(Gestalt,形式,形状,德语)是一组由德国心理学家在1920年代开发的视觉感知原理。它建立在“有组织的整体大于其各个部分的总和”的理论基础上。

“整体不是部分的总和。”

—库尔特·科夫卡(Kurt Koffka)

格式塔原理试图描述人们在特定条件下如何看待视觉元素。它们基于四个关键思想:

紧急情况

人们倾向于首先以其总体轮廓形式识别元素。我们的大脑比详细的物体更快地识别出简单,定义明确的物体。


脑补

人们可以识别物体,即使其中有些部分丢失了。我们的大脑将我们所看到的与存储在我们记忆中的熟悉模式相匹配,并填补了空白。



多重稳定性

人们通常会以不止一种方式解释歧义对象。我们的大脑将在寻求确定性的替代方案之间来回跳动。结果,一种观点将变得更加占主导,而另一种观点将变得更加难以看清。



不变性

人们可以独立于旋转,缩放和平移识别简单的对象。尽管外观不同,我们的大脑仍可以从不同的角度感知物体。




这是完形的原则,可以为当今的UI设计提供信息。

接近

彼此靠近排列的元素被认为比彼此分开放置的元素更为相关。这样,不同的元素主要被视为一个整体,而不是单个的元素。


邻近原则如何应用于UI设计?

我们可以在UI设计中使用接近原则来对相似信息进行分组,组织内容并整理布局。正确使用它会对视觉传达和用户体验产生积极影响。

按照原则,相关的项目应保持彼此靠近,而无关的项目应保持更远的距离。空白在这里起着至关重要的作用,因为它会产生对比度,引导用户的眼睛朝预期的方向前进。空白可以增强视觉层次结构和信息流,有助于易于阅读和扫描布局。它将帮助用户更快地实现其目标,并更深入地研究内容。




从导航,卡片,画廊和横幅到列表,正文和分页,我们几乎可以在所有地方应用邻近原则。

共同区域

与邻近原则相似,位于同一区域内的元素被视为已分组。


通用区域原则如何应用于UI设计?

共同区域原则特别有用。它可以帮助进行信息分组和内容组织,但也可以实现内容分离或充当焦点。它提高了层次结构,可扫描性并有助于促进信息的传播。

共同区域原则可以将许多不同元素结合在一起,使它们在更大的群体中保持统一。我们可以通过使用线条,颜色,形状和阴影来实现。它通常可用于将元素带入前台,指示交互作用或重要性。



常见的通用区域示例是卡UI模式;一个定义良好的矩形空间,其中包含不同的信息位。标语和表格也是很好的例子。

相似

与不共享相似特征的元素相比,共享相似视觉特征的元素被认为更加相关。




相似性原理如何应用于UI设计?

我们倾向于将彼此相似的元素视为一组或一个模式。我们也可能认为它们具有相同的目的。相似性可以帮助我们对组内的对象进行组织和分类,并将它们与特定的含义或功能联系起来。

有多种方法可以使元素被视为相似并因此相互关联。其中包括颜色,大小,形状,纹理,尺寸和方向的相似性;其中有些比其他的具有更强的交流能力(例如颜色>尺寸>形状)。当发生相似性时,可以通过与其他对象不同来强调对象。这称为“异常”,可用于创建对比度或视觉重量。它可以将用户的注意力吸引到特定的内容(焦点)上,同时有助于可扫描性,可发现性和整体流程。


我们可以在导航,链接,按钮,标题,号召性用语等中使用相似性原理。

关闭

通常将一组元素视为一个可识别的形式或图形。当对象不完整或部分对象未封闭时,也会发生关闭。


闭合原理如何应用于UI设计?

正如“封闭原则”所指出的那样,当呈现适当数量的信息时,我们的大脑将通过填补空白并创建统一的整体而跳到结论。这样,我们可以减少传达信息所需的元素数量,降低复杂性并使设计更具吸引力。封闭可以帮助我们最大程度地减少视觉噪音并传达信息,从而在很小的空间内增强概念。

我们可以在图像学中使用“闭合”原理,其中简单性有助于快速而清晰地传达含义。

对称

对称元素往往被视为属于彼此,而与它们之间的距离无关,从而给我们一种稳固和有序的感觉。


对称性原理在UI设计中如何应用?

对称元素简单,和谐且在视觉上令人愉悦。我们的眼睛在寻求那些具有秩序和稳定性的属性,以了解世界。因此,对称是用于快速有效地传达信息的有用工具。对称让我们专注于重要方面感到很自在。

对称的合成效果令人满意,但是它们也会变得有些沉闷和静态。视觉对称性趋于更加动态和有趣。在不对称的设计中添加不对称元素有助于在印象中吸引注意力;例如对任何兴趣点或号召性用语有用的内容。在任何设计中,对称性以及合理的不对称性都非常重要。



最好将Symmetry用于产品组合,画廊,产品展示,列表,导航,标语以及任何内容丰富的页面。

延续性

与以随机或粗线排列的元素相比,以直线或软曲线排列的元素被认为具有更大的相关性。


连续性原理在UI设计中如何应用?

连续线之后的元素被视为已分组。线段越平滑,我们看到的线段就越统一。我们的思想更倾向于阻力最小的道路。

连续性帮助我们通过构图来解释方向和运动。它在对齐元素时发生,它可以帮助我们的眼睛在页面中平滑移动,并有助于提高可读性。连续性原则增强了对分组信息的感知,创建了顺序并引导用户浏览不同的内容段。连续性的中断可能标志着部分内容的结束,从而引起人们对新内容的注意。


行和列的线性排列是连续性的很好示例。我们可以在菜单和子菜单,列表,产品安排,轮播,服务或过程/进度显示中使用它们。

共同的方向

与朝不同方向移动或根本不移动的元素相比,朝着相同方向移动的元素被认为更相关。


通用性原则在UI设计中如何应用?

无论元素相距多远或看起来有多不同,如果它们一起移动或更改,都将它们视为相关的。即使在其他视觉元素暗示移动的情况下,也会发生这种效果。

当元素移动同步时,通用命运原则更为有效。在相同的方向,相同的时间和速度。它可以帮助对相关信息进行分组以及将操作与结果链接起来。同步运动的中断可以吸引用户的注意力,并将其引导到特定的元素或功能。它还可以在不同组或州之间建立关系。


我们可以在可扩展菜单,工具提示,产品滑块,视差滚动和滑动指示器中使用“通用性”原则。


结论

用户界面设计不仅仅涉及漂亮的像素和出色的图形。它主要是关于沟通,性能和便利性。格式塔原则始终是当前帮助我们实现这些目标的原则。为用户创造愉快的体验,并为企业带来巨大的成功。

如果您觉得我的文章有用,请加个关注吧。


8
Report
|
12
Share
评论
in to comment
Add emoji
喜欢TA的作品吗?喜欢就快来夸夸TA吧!
Log in