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

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

提交需求

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

0/20
0/200

设计大赛

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

提交完成
感谢您对UI中国的支持和信赖!
常用UI设计法则(2):系列位置效应
0.0°
2021-07-07 原创文章 经验/观点 举报 20186 140 206 13

前言:

在文章开始之前,我们先做一道简单的测试题,快速阅读下面的题目:

甲方爸爸A是一位睿智、积极、固执、自私、冷漠、冲动、真诚、谦逊的人;甲方爸爸B是一位冷漠、固执、积极、谦逊、真诚、睿智、冲动、自私的人。

请问你更喜欢哪一位甲方爸爸?记住你的答案,本篇文章将会给出合理的解释。


什么是系列位置效应:

系列位置效应本质上是一种心理学现象,由德国心理学家艾宾浩斯(H.Ebbinghaus)提出。他在研究“遗忘曲线”的过程中发现当自己回忆一系列项目时,回忆的准确性会随着项目在列表中位置的改变而改变:

研究表明:处于开头和结尾位置的回忆准确率较高,而中间部分的回忆准确率较低,这种接近开头和末尾的记忆效果好于中间部分的趋势就是系列位置效应。

其中开头比中间记得好称为首因效应(或首位效应),末尾比中间记得好称为近因效应(或新近效应),效果较差的中间部分称为渐近部分。

通俗地讲,就是在回忆时,我们更容易记起排在最前面和最后面的内容,而排在中间的内容往往容易被忽略。

1.首因效应(首位效应):

系列中的起始项目更能有效的储存在长期记忆中,并能被快速回忆起来。

案例1:Web版页面的导航中,绝大多数Logo位于左上角,为什么?
UI中国/左手医生/纵横中文网Web版导航

因为这种固定的设计样式每次都是最先出现在我们的视野里,并被储存在了长期记忆之中。即使是网络较差没加载出页面的情况下,我们依然知道这里是什么。此外,将Logo放置在首因位置还能加深用户对产品的品牌识别性。


案例2:绝大多数App标签栏,首尾固定的两个Tab几乎都是首页和个人中心(近因效应),也是运用序列位置效应。但这种固定模式限制了icon的延展性,千篇一律的首页icon极易引起用户的视觉疲劳。因此部分产品以自己本身的应用图标代替首页的Tab,同样起到强化品牌和用户记忆的作用。


2.近因效应(新近效应):

系列中的结尾项目很容易储存在短期记忆中,保持时间很短。

短期记忆是神经连接的暂时性强化,通过巩固后可变为长期记忆。因此在设计时通常将近因位置的内容通过不同的设计手段突出展示,加深用户记忆。


案例3:电商类App都喜欢将购买相关的按钮悬浮固定在屏幕底部右侧,为什么?

假设将这些按钮放在页面最底部,用户必须要浏览完整个页面才可以点击购买,那如果中途就想先加入购物车或者直接购买呢?等我看完整个页面我就很可能忘记操作了。


案例4:一些社交类App为了让用户能随时发表或记录自己的想法,会把评论/点赞等按钮做悬浮设计,也是为了避免用户忘记自己想要做什么。


3.不同版式中的首因和近因位置:

通常情况下我们更习惯横向阅读,此时界面中的首位和末位分别在左上和右下。但有时候我们也需要纵向阅读,此时的首位和末位分别是右上和左下。

案例5:

App Store的标题是横向,故首因位在左上;岛读的标题是纵向排版,故首因位在右上。


对设计的启示:

1.在设计时,结合自身产品特点将重要的内容放在系列首尾,用户更容易记住。

应用场景:Tabbar、轮播Banner、各类选项卡和标签等

案例6:同样是社交类产品,为什么QQ和微信的布局不太一样?

QQ是纯社交类,聊天交友是其最主要的功能。因此将[动态]放在近因位置,更符合产品的定位。[我的]放在左上角,从横向视觉来讲也属于首因位置。

微信更偏重功能性,除了社交功能以外,还有同样重要的一系列支付相关衍生业务。而且微信的用户人群年龄跨度更大,使用传统的Tabbar更能减轻用户的记忆负担。


2.想让某些元素充分发挥近因效应的作用,就让它永远处于近因效应的位置

应用场景:电商购买、阅读/文章评论类、工具类(邮箱/网盘等)、运营活动悬浮窗等


3.根据不同的版式设计选择正确的首因和近因位置

应用场景:Banner/海报设计、一些古诗词类App(西窗烛)等


小结:

还记得文章最开始那道简单的测试题吗?细心的小伙伴会发现其实描述两位甲方爸爸的形容词都是相同的,只是调换了顺序。但我们阅读时会更喜欢A,现在大家明白是为什么了吧?

以上就是本次系列位置效应的相关内容,感谢观看~




Powered by Froala Editor

更新:2021-07-07

收藏

140人已收藏

  • 6

    作品

  • 56

    粉丝

  • 9

    关注

  • 常用UI设计法则(3):四项事物法则
  • 一个用4WH需求分析法做的首页改版
  • 熊猫看书—V9.0复盘
  • 常用UI设计法则之格式塔原理
相关标签

    猜你喜欢

      2021-07-07 原创文章 经验/观点 举报 20186 140 206 13

      常用UI设计法则(2):系列位置效应

      0.0°

      你确定要举报常用UI设计法则(2):系列位置效应

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

      0/200

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

      点击上传附件

      对谁可见:

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

      您确认要推荐?

      该作品发布时间:2021年06月17日

      评分

      完整度

      启发性

      勤奋性

      排版布局

      推荐心得

      建议20-200字以内

      0/200

      206
      140
      13

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

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

      登录

      手机号

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

      登录
      第三方账号登录