用户体验优化7大指标(超详解析这7大指标)

格式塔原则是任何设计师都可以学习重要思想集合,它们的实现不仅可以极大地改善设计的美观性,而且还可以极大地改善其设计美感,其功能和用户友好性。

分享大纲:

1.临近定律

2.相似原理

3.封闭原则

4.连续原则

5.对称原理

6.共同命运原则

7.图地原理

一、邻近定律

彼此靠近的事物比彼此隔开的事物关联性更强。我们的大脑将这些紧密放置的元素集合视为一组,临近定律可以更清晰知道元素之间关系,在UI这种运用比较广泛。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

那么它在UI中如何应用?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

左侧卡片中,文字排版有点分散,导致信息理解会误判。右侧卡片中文字排版信息集中,便于表达同一个主题。

二、相似原理

具有相似视觉外观的元素更容易被用户认为是同类物体。在格式塔理论中,对相似元素进行视觉分组,可通过颜色形状大小等将其安排在一起。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

上图中左侧虽然间距大小一样,但是色彩不一样,我们视知觉会自动将两种颜色分别视为两组。

如何应用到UI设计中?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

如上图 ,在UI设计中,两个按钮大小形状一样颜色不一样,因此我们会将其视为两种重要程度的功能。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

由于相似原理,我们知道,有颜色字体是可以进行点击操作的。相似性可以让整个UI系统更加一致性,体验更友好。

三、封闭原则

当对象不完整时,我们更喜欢完整的形状,因此我们自动填充元素之间的间隙以感知完整的图像,例如形状字母图片等。具体来说,当整个图片的某些部分丢失时,我们的感知将填补视觉上的空白。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

网上很出名的一张图

如上动图中,即使小狗元素用不规则小点组成,但是我们也能识别出来。

如何应用到UI设计中?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

封闭原则在加载指示器中运用较多,这样便于用户理解。左侧加载过于分散,无法让用户联想到加载,因此右侧思路与封闭原则有着一致思路。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

封闭原则在图形LOGO设计中也是屡见不鲜。

四、连续原则

连续定律一般由一条直线或者曲线的端点为起点,一直延续下去达到终点,我们感知倾向于对象是以直线或者曲线的形式排列起来更为相关性。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

如何应用到UI设计中?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

在标签栏设计中,我们把横向连接在一起的视为一组,表达一个功能含义。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

上图Apple和Medium的设计中,将标签横向排列一组,便于用户横向滑动找到对应功能。

五、对称原理

我们的大脑将对称对象视为同一组的一部分。他们给人以稳定和秩序的印象,对称的UI元素有助于扫描内容浏览信息

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

如何应用到UI设计中?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

夸克Naver产品设计中,底部图标网格菜单,采用对称平衡手法,将功能排布在宫格列表上。

六、共同命运原则

共同命运原则(law of common fate)是指在其他条件相同时,朝同一方运动具有相同速度的元素会被组织在一起。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

该原理是运动设计的基础。每个有意义的动画都会使用共同的命运来以正确的方式引导用户的视线。这有助于将内容与触发的动作联系起来。

如何应用到UI设计中?

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

如上图,向右滑动可以显示更多的内容,因此在设计时候就需要保证在统一方向上,让它们有着共同属性。

七、图地原理

人眼能够根据不同的聚焦计划分离对象。我们直观地知道哪些元素放置在前景中,哪些元素放置在背景中。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

在模态弹出窗口时,就可以见证“图形地面原则”的实际使用。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

如上在弹窗设计中,我们经常会将背景叠加黑色便于突出前景弹窗内容。

提升设计美感及用户体验的七大原则提升设计美感及用户体验的七大原则

上图中在版式上使用图地原则,清晰区分信息层级,通过圆形鞋子前后关系,营造视觉焦点。

总结

格式塔心理学知识在UI设计中的运用远远要比我今天说得要多,大家可以在项目实践中去慢慢理解运用。这是个比较重要的设计理论学术,希望大家可以掌握后学以致用。

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,请发送邮件至624739273@qq.com举报,一经查实,本站将立刻删除。
Like (0)
柳的头像

相关推荐

  • 藏在历史中的细节:被误解的刘邦

    对于汉高祖刘邦,大多数国人的第一印象,除了开国皇帝,就是地痞无赖。 《史记》、《汉书》中的刘邦,明明是潇洒不羁真性情,但因为帝王身份的特殊性,这种风格往往被理解为“痞气”。 后世文…

    2024年9月7日
  • ps怎么调广告图片颜色(ps人物肤色调色技巧)

    想用PS给图片调色?其实很简单! 1、素材导入后,在面板上找出渐变映射。这里根据自己的审美喜好选择一个合适的渐变,将滑块移动到选定的位置。这样我们可以得到一个大致的颜色方向,这里可…

    2024年8月30日 投稿
  • 人力资源系统有哪些模块,人力资源十大模块的内容

    人力资源管理系统是人力资源部使用的软件产品,但现在已经成为企业的全球管理系统。包括人力规划、人事管理、工资、保险、考勤、招聘、培训、考核、计件工作等职能 它可以帮助企业将人力资源运…

    2024年8月26日 投稿
  • un38.3认证怎么申请?

    un38.3认证是什么? POCE宝测达,根据目前各航空公司依据国际航协《危险物品规则》的相关规定,对适用于包括但不限于单独或与设备一起运输的属可充电型锂电池的手机电池、笔记本电脑…

    投稿 2024年9月3日
  • ps怎么装字体步骤(ps无痕修改图片文字)

    首先,我来跟大家普及一下,Photoshop简称为ps,有的人会打成大写字母PS,有的人打成小写字母ps,其实都是指Photoshop软件。我们平时听到别人说“ps一下图片”、或者…

    2024年8月30日 投稿
  • 手机什么好用(2024最值得买的手机推荐)

    随着我们对手机的依赖,手机能否舒适地使用变得越来越重要,而屏幕是最能直接影响我们使用体验的因素。一块2K+90/120Hz的顶级好屏,不仅能给你日常刷网页、看视频等带来极致流畅的视…

    2024年8月31日 投稿

发表回复

Please Login to Comment
微信
微信
SHARE
TOP
要想花得少,就用购宝。话费电费9折起,官方公众号:购宝