恭喜你成为UI中国推荐设计师 (详情)
//百度统计 20220402 uicn

您的意见是我们 UI 中国进步的动力!
点击立即反馈按钮,发表您的意见!
立即反馈
QQ群反馈
您也可以加入UI中国官方反馈群进行反馈!
群号:302892100
备注:反馈问题后@管理员能让我们及时了解您的意见

提交需求

赛事与广告咨询合作,请填写需求表单,我们会在第一时间与您联系!

0/20
0/200

设计大赛

  • 设计大赛
  • 发布广告
  • 发布招聘
  • 其它需求

提交完成
感谢您对UI中国的支持和信赖!
学设计需要掌握什么心理学呢?-趣达说
0.0°
2016-07-12 原创文章 经验/观点 举报 1920 4 8 0

通过什么样的方式对页面进行一个简洁的设计,是每一个设计师都想去解决的问题。如果整体的界面设计中,视觉效果感觉不好,为什么会出现这样的情况?和大家分享格式塔心理。

通过什么样的方式对页面进行一个简洁的设计,是每一个设计师都想去解决的问题。如果整体的界面设计中,视觉效果感觉不好,就会让人感觉很不舒服,很不协调。而这些不舒服和不协调其实都是人的心理“作祟”,为什么会出现这样的情况?今天就和大家分享格式塔心理。

Image title


是什么?


格式塔心理学:人们在观看东西时,眼睛和脑袋瓜并不是在一开始就区分一个形象的各个单一的组成部分,而是自动对视觉输入构建结构,并且在神经系统层面上感知形状,图形和物体,使之成为一个更易于理解的统一体,而不是只看到互不相连的边,线和区域。


说的简单一点的话就是视觉形象首先是作为统一的整体被认知的,而后才以部分的形式被认知,也就是说,我们先“看见”一个构图的整体,然后才“看见”组成这一构图整体的各个部分。

Image title


格式塔心理学只要有5个特性,分别是简单性、接近性、相似性、封闭性和连续性。如果上面的概念没弄懂,我们就通过它的5个特性给大家讲解一下,通过这些特性去认识格式塔的整体。因为这是一门心理学,都是通过不断的测试得到的,所以我们会用大量的例子来一个一个的解释,看一下这些理论对不对。


简单性原则


简单性原则,就是说我们描述一个事物的时候,我们都会趋向于用简单的方式去理解它,而不会去选择一个复杂的方式。例如《 -_-||| 》这个符号,大部分的人会第一时间觉得它更像一个表情,而不会去觉得它就是六个符号,当我们需要去描述它的时候也会说它是一个某某表情,这就是简单性,向着简单靠近。再看一个例子:

Image title


这样一张图片你又是怎么去描述它的?是不是会说出它就是一个圆形,一个正方形和一个三角形构成,就像这样:

Image title


但它是这样构成的吗?不一定。这只是我们的心理作用,会自动的将一个复杂的形状进行简单化得到我们熟知的一些形状,这个也是简单性原则.


背景性原则

Image title


看一下上图,一个是大的蓝色块,一个是白色的小块,那么你会觉得哪个是背景,哪个是背景上的图形?继续看下图:

Image title

我们把白色这一块放大,这样子又哪个是背景,哪个是图形呢?是不是开始改变想法了?那接着再看一张图片:

Image title


把两个色块的大小再一次进行改变,三个图片哪个是背景,哪个又是图形,得到答案了吗?那你是通过什么去判断他们是背景和图形的?一般没有哪个是背景,哪个不是背景,这些都是我们大脑给它的定义。


背景性原则的定义就是:不是背景,就是图形,一般会认为目光聚焦的那个就是图形,而除了中心部分的图形之外的就是背景。


接近性原则

Image title


接近原则被广泛应用于页面内容的组织以及分组设计中。对于引导用户的视觉流及方便用户对界面的解读起到非常重要的作用,通过接近原则对同类内容进行分组,同时留下间距,会给用户的视觉以秩序和合理的休憩。设计师经常会使用分组框或分割线将屏幕上的控件和数据显示分隔。就像上面的图,我们会不自觉的认为它被分成了四组。比如:

Image title


这是苹果手机里的一张界面,它所有内容并没有将它明确的分组,但我们确可以强烈的感知它确实分组了,这个就是运用了接近性原则,通过距离将他们区分开来。


相似性原则

Image title


我们在描述上图的时候,通常都会说它是两个圆和两个矩形构成的。这样子我们也会无形的给它们进行了分组。这就是相似性原则,把相似的分成一组。跟接近性原则有点相似,但却是不一样的,接近性原则强调的是位置,相似性原则强调的是内容。


相似性的定义是:把那些明显具有共同特性(如形状、大小、颜色等)的事物组合在一起,即相似的部分在知觉中会形成若干组。这个原被广泛的用在页面设计中分类使用文本、颜色、图像等,可以更好的区分各个模块和内容。


封闭性原则



Image title

Image title



这两个形状其实并没有特别,他们只是由比较复杂的几个色块构成,但我们去看的时候会第一时间觉得第一个图是一只熊猫、第二个图是三个圆和两个三角形。但它们是不是真的如我们所想是这些图案呢?很明显不是,它的一些线条并没有连接起来,我们看到的只是我们下意识的感觉,大脑会自动的将这些形状进行连接得到我们熟知的事物。


封闭式的特点是当元素不完整或者不存在的时候,依然可以被人们所识别。根据过去以往的经验,习惯性的将图形作为一个整体去观看。在脑袋里将缺少的形状补充进去之后,便形成最终我们识别出来的图形效果。这个原则更多的是用在一些logo的虚实结合中。


连续性原则

Image title


大部分的人会说它是两条直线,为什么不看成两条折线构成的呢?这个就是连续性原则,我们去看东西的时候会趋向于去保持它原来的状态,它一开始是直的,我们后面也不会去选择它是曲的,而更愿意按照原来的状态去认识。这个就是连续性原则。以上的内容就是格式塔原理,在之后的设计中,大家可以通过这些大众的心理去进行设计,知己知彼百战不殆,了解了大众的心理之后再去设计,自然如鱼得水,将界面设计得更好。

Image title


更新:2016-07-12

收藏

4人已收藏

小楠2016

一个默默爱着设计的人,希望分享更多的UI设计技巧、交互设计思维、互联网观点,和大家一起进步。

  • 5

    作品

  • 35

    粉丝

  • 0

    关注

  • UI设计学习大纲
  • 趣达说-设计师一定会遇到的版面设计问题
  • 2016最新安卓版UI设计规范篇
  • 一份来自UI设计老鸟的独白:UI设计的前景真的饱和吗?
相关标签

    猜你喜欢

      2016-07-12 原创文章 经验/观点 举报 1920 4 8 0

      学设计需要掌握什么心理学呢?-趣达说

      0.0°

      你确定要举报学设计需要掌握什么心理学呢?-趣达说

      如果查出恶意举报,十天内禁止提交任何举报申请。

      0/200

      上传证据: 超过10M的附件请使用网盘地址

      点击上传附件

      对谁可见:

      全部设计师
      • 全部设计师
      • 推荐设计师和认证设计师

      您确认要推荐?

      该作品发布时间:2016年07月12日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      8
      4
      0

      账号或密码错误,请重新输入

      账号或密码错误,请重新输入

      登录

      手机号

      发送验证码 120s 验证码错误

      登录
      第三方账号登录