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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
如何做好UI设计?也许你该学点心理学(1)
0.0°
2016-09-05 原创文章 经验/观点 举报 1904 10 11 0

自己近期阅读的一些设计相关书籍,总结的一些观点,与大家一起讨论学习。本文总结自《设计师要懂心理学》。

初接触UI设计的时候,就常常听人说设计师也应该要是一个心理学家,当时的我是一脸懵比的,心理学家?什么鬼?这很重要吗?我一个设计把界面做得酷酷的叼叼的还不够吗?难道还要考虑用户今天心情好不好,明天准备干什么吗?一开始,我怀疑提出这种观点的是不是在秀下限,然而现在我开始怀疑可能是我当初上限还没人家下限高。


好了,废话不扯了。下面让我们来通过一些小实验,慢慢揭开那些生活中很容易被我们忽视的小事背后所含的心理学,来了解它们对我们做设计能够带来的好的或者坏的影响。



一.你一定听过的一个词--“脑补”

 Image title


请注意观察上面这个动态图,你是不是看到了2个在你眼前出现又消失的三角形?你可能会想,这不是废话吗?谁还看不出来这不过是两个三角形蹩脚的动态图吗?然而我想说的却是,这图里我只画出了一个三角形,而你看到的这个三角形,我并没有明确的画出来。你有没有想过,你为什么会坚信这是一个三角形呢?

事实上,这个多出来的三角形被称做“卡尼萨三角”。而产生的原因就是因为我们的大脑也会偷懒。为了更快地解析周围的世界,大脑会投机取巧地偷懒,根据以往的经验,猜测我们看见了什么。所以,就有了了这样的错觉。


对于ui设计师而言,我们能从中这样的现象中借鉴到什么呢?



1.在设计中所呈现的内容,应该符合大多数人的经验预期。就像这个无形的三角形一样,尽管没有明确的表现出来,但它却也一直存在。举个简单的例子,比如我们 在某个场景中设计某个功能的按钮,我们可以通过界面排版,行为流程,或者其他形式,引导用户的判断方向,当用户看到这个按钮就会知道它的功能。



2.设计师可以通过特定的设计展现方式去引导用户注意特定的内容,比如banner的设计中,用强烈的色彩对比,版式等手法来突出我们想重点表达的内容。




二、大多数人还是习惯这么做,比如“以偏概全”


Image title

(该图片临摹自大神的作品,如有侵权请联系我)


看看上面这2张图,并在脑海中设想他们是什么场景。我猜,你可以很容易就一眼就分辨出上图1是什么场景,尽管图中间的区域被遮挡了。相反,你可能会纠结于图2中的场景。事实上,这两张图是同一个场景。为什么我们会产生这样的感觉呢?这是因为人对整体的认知主要依靠周边视觉。举个例子来说,旅游的时候我们到了一个陌生的景点,首先产生在我们脑海里的不是景点里的某个具体的事物,而是对这个景点整体的印象。不信的同学可以回忆一下自己的经历,或者在旅行中试验一下。

而工作生活中,我们也会经常听到别人说的哪家的APP是什么风格,这些印象其实都是基于周边视觉所产生的。因此,在进行设计时,就不能忽视对主要内容的周边区域的设计。



1.我们可以利用周边区域的设计对产品风格进行定性,帮助用户构建对整体产品的认知。举个简单的例子,比如我们在做一个购物类的应用时,假如我在页面周边空白处设计一些动漫风的物品,用户就会认为这是一个售卖动漫相关产品的应用;假如我设计的是家电等实体物品,用户的认知又会发生变化。



2.人容易被动态以及有人脸特征的物体吸引,因此如果我们想突出中间的内容,就不要在周边区域设计这些东西。说到这点,我们可以去查看随便某个网店,当我们看到一个浮窗时,就会特别想要去关掉它,因为这个干扰让我们感到不舒服。




三、“无规矩不成方圆”,这是老祖宗的智慧


Image title


现在让我们再来观察一组图片(憋足动效,将就着看吧~~)。当你看完前2个圆圈运动完的时候,你有没有期待第3个圆圈会转3圈,然后停下来。它也确实转了3圈,这个时候你会不会期待第4个圆会转4圈并停下来,而它事实上只转了1圈不到就停了。那么,这个时候静下来回顾下你的感受,有没有觉得有一点失望,甚至感到不爽。

如果你认真观察,并且确实和我产生了一样的感受,那么接下来我们一起来看看这是为什么。

虽然从量子理论上来说,整个世界都是无序的,但是人却会习惯于在无序中寻找有序,即规律。并且这种规律明显的带有个人习惯,比方说我的办公桌上的物品在别人看起来可能很凌乱,但是我自己却可以随时找到我想要的东西,这里也包含着我建立在办公桌上的规律。

扯的远了,说到设计上,我们在图片,图标等的摆放上,就可以有效的利用规律所带来的优势。


1.同功能的图标有规律的摆放,会符合大多数人的习惯,用户自然会将它们归为一类而不需要我们做特别的说明。



2.相关的事物邻近放置,用户也会自然而然认为它们是一起的。比如说图片和文字的相关性。



3.利用分组,模块,空白等的设计手法,区分不同的内容。




四、你又不是倾国倾城,我为什么要对你“刮目相看”


Image title

(该动效图片素材临摹自大神的作品,如有侵权请联系我)


看的烦了,我们先来找个茬娱乐一下(又要观察作者的愚蠢的动态图了~}。现在,告诉我,你看到拍照前后的两幅图哪里不一样,除了颜色以外。你是不是又多看了几遍图片,然后又确认了一下自己确实没有遗漏不同点。

而事实上,只有一个地方发生了变化,连颜色也没有变化(这只是故意的误导)。造成你去反复确认的,除了我的问题还有就是因为你无法一眼判断出第二幅较第一幅发生了哪些变化——因为人很容易对看到的变化视而不见。


这个时候熟悉用户体验的朋友可能会腹诽,作者为什么要放个动图让我找茬,而不是放两张图呢?关于这个问题,我想说的是,实际工作中用户也不会拿着两个手机去比较,当他们进行一些页面刷新或者应用更新以后,他们会看到的变化也不会是通过两个手机比较得出的。


这是一个很容易被忽视的问题,设计师总以为我需要呈现给用户什么东西,我就把它在页面上设计出来,然而有时候用户并不会“看见”这些设计。所以我们要做一些什么来保证用户不会对这些设计视而不见。


要保证用户能够看到某些设计或者变化,需要在视觉上进行提示。比如说,我们的某个应用迭代,一些功能进行了升级,或者某些原有按钮的位置进行了改变,我们需要用一些引导的方式告诉用户,比如用户更新后初次打开应用会看到的引导页或者引导提示等。




五、“我没有很刻意,我只是恰巧站在了你的风景里”


(此处应有图片)

好吧,作者偷懒了~~


这里我们从用户的阅读习惯说起。不知道你有没有想过,当人们看一个界面的时候,他的第一眼看哪里?第二眼看哪里?为什么会这样?有没有办法改变这种阅读习惯?


1.人们阅读的习惯与本身的书写习惯一样,比如从左到有,从上至下。但是值得注意的是,在浏览界面时候,人们会忽略掉边缘的部分,直接从正文部分看起,因此,我们不要将重要的内容放在边缘处呈现,这样很容易被忽略掉。



2.人的注意力很容易被图片或者动图吸引,因此设计过程中要注意在重要的内容附近放置这些元素。



3.人们会习惯性认为重要的东西在页面头部或者中间,要注意再设计上把重要的内容放在屏幕上面三分之一或者中间,符合人的心理预期。




这次分享就先到这里了。


第一次写这类文章,文笔不好,求大神拍砖指正,求关注。


如果大家觉得还可以,就点个赞鼓励下吧~~.嘻嘻!

更新:2016-09-05

收藏

10人已收藏

毛杰368

有梦想,在努力。

  • 4

    作品

  • 1

    粉丝

  • 25

    关注

  • 这是一个无聊的飞机稿
  • UI界面&动效设计
  • 猪啰记APP界面设计

    猜你喜欢

      2016-09-05 原创文章 经验/观点 举报 1904 10 11 0

      如何做好UI设计?也许你该学点心理学(1)

      0.0°

      你确定要举报如何做好UI设计?也许你该学点心理学(1)

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2016年09月05日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      11
      10
      0

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

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

      登录

      手机号

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

      登录
      第三方账号登录