记一次关于弹框按钮位置问题

1.场景:弹框中的按钮位置放置问题

原rp设计:

确定按钮放在右边,取消按钮放在左边

事情经过:

看到很多关于弹框的rp设计图,然后我发现rp中对弹框里面按钮位置的放置问题上没有区分不是很合理,所以我提出了自己的优化意见并且被采纳。修改为确定按钮放在左边,取消按钮放在右边。

原因如下:

1、采用「action」/「cancel」顺序时,用户会阅读完所有可操作的选项,这意味着用户的视线不会停留在「Action」上,它将继续向后进行扫描,在查看完所有可选项后,再返回之前的「Action」执行相应操作。采用「cancel」/「action」顺序,用户的视线流将会更平滑,视线最终停留的位置也是「Action」所处的位置。通过如图对比,可以得知「action」放置于左侧,将导致用户的视线流发生改变,用户视线流无意识的回跳,而放于右侧将保持视线流在一个方向,减少视线曲折搜索的过程。
2、我们知道大部分的人主要是右手用户,当dialog内的「Action」位于右侧时,用户在操作时能够更为顺应他们自身的使用习惯。并且「Action」键同时也是首选操作以及最可能执行的操作。
3、当需要引导人们进行所期望的操作时,两个按键中的「cancel」按应位于左侧,相对应的[action]按键高亮提示。
4、但是如果涉及特殊操作,例如不可逆操作或者是操作比较复杂的需要谨慎处理的、操作涉及潜在的风险时,两个按键中「action」按键应位于左侧,并高亮提示。

成效:

使用户在操作时更加方便、便捷,增强用户体验,提高用户的满意度。

参考:https://www.jianshu.com/p/af593305e2e6

你可能感兴趣的:(web,设计)