交互设计心理学之古腾堡原则( 二 )
文章插图
为了保证「同意」与「拒绝」这两个独立的按钮能够被用户足够的重视,并且其中的任意一个按钮不会被轻易的忽略掉,这里将「同意」按钮颜色加重,并且放在「拒绝」按钮之上,让眼睛原本垂直向下的运动轨迹产生回流的变化。
小结:原则是设计的基础,并非一成不变,要合理权衡设计原则与产品目标之间的关系。
3. 顶部按钮分析
关键按钮至于顶部,还可以缩短用户眼睛的运动路径,让用户更容易注意到其状态的变化状态。
文章插图
小结:顶部按钮更关注可编辑的内容区域,并非按钮。而底部按钮则更关注按钮本身。并非内容。
4. 水平按钮分析除了上面提到的顶部按钮和底部按钮,还有水平摆放的按钮,比如淘宝详情页、京东详情页、网易严选详情页的「加入购物车」和「立即购买」按钮,界面中的「立即购买」按钮都放在了右下角,结合古腾堡原则的视觉终点说明,右下角为视觉终端区域,即视觉最终停留的位置,所以他们都将与转化率密切相关的「立即购买」按钮放在了界面的右下角,让用户更容易关注到。
文章插图
再比如比较常见的「取消」和「确认」弹窗样式,通常是在需要让用户确认某种操作行为时出现,有可能是提交表单、协议授权、获取用户信息等等,为了防止用户误操作,这也是提升产品体验的小细节。
平常我们所看到的弹窗,推荐按钮都是在右侧,那么将推荐按钮放在左侧会怎么样?如下图所示:
文章插图
不难看出推荐按钮放在右侧后,视觉在水平方向轴上产生了回流。
弹窗的目的是想让用户点击「确认」按钮,如果将「确认」放在左侧,根据古腾堡原则,用户的视线会不由自主的向右侧移动,也就是「取消」按钮的位置,想要回到左侧「确认」按钮位置就需要移动视线,并且眼睛的运动轨迹会在水平方向轴上来回的往复运动,无形中增加了用户选择时长。
如果将「确认」放在右侧,「取消」放在左侧则可以为用户提高操作效率。
在实际产品中的应用案例:
文章插图
小结:当产品想要让用户进行某种操作时,主要按钮放在右边。
三、总结
- 古腾堡图第一视觉区,强休息区,弱休息区,终端视觉区
- 原则是设计的基础,并非一成不变,要合理权衡设计原则与产品目标之间的关系
- 顶部按钮更关注可编辑的内容区域,并非按钮。而底部按钮则更关注按钮本身。并非内容
- 当产品想要让用户进行某种操作时,主要按钮放在右边
本文由 @王雨_Vision 原创发布于人人都是产品经理。未经许可,禁止转载
题图来自 Unsplash,基于 CC0 协议
推荐阅读
- 赛道|千亿「设计协作」SaaS赛道,何时冲出一个中国版Figma?
- 荣耀MagicV采用什么边框-荣耀MagicV边框设计介绍
- 颗粒度|业务想大多全,用户要精准简,首页设计该如何破局?
- 产销比|货币型会员积分设计指南
- 产品|如何设计一款成功的产品使其市场成功?
- 现实世界|打造系列感的运营设计,设计师要怎么做?
- 数据处理|B端产品“年度账单”,怎么设计?
- 银台|聚合支付的收银台设计
- 桌面|OriginOS Ocean原子组件体系再升级 人机交互更高效
- 百分比|3种状态+5种模式,从UX角度分析加载设计