当前位置:首页 > 经验学习 > 用户体验

浅谈按钮分组和位置

所属栏目:用户体验 时间:2013-12-26 来源: 作者:不详 点击:

按钮分组
按钮的分组可以让一个界面变de(得)具有自我描述能力.在复杂的布局中,组织良好的各组按钮用以选择,而且因为很明显,这样可以很快告诉用户有哪些功能可以使用。
几个按钮放在一起,因为它们可能完成类似的功能。我们可yi(以)看范例iTunes的主窗口,四个角分别放置了一组按钮,界面中间的歌曲也有很多的行动点。加上滚动条,该界面只有有14个按钮。确实有很多De(的)功能,不过因为视觉上和语言上的巧妙组合,并bu(不)会给用户很乱的感觉。
制定“阿里助手”视jue(觉)规范的时候运用的就是视觉相似性归类,假若这组按钮大小都一zhi(致),那么看起来就是一个整体,合适的大小和对齐可以帮助一zu(组)按钮组成一个大一些的组合图形。
分组按照按钮的功能来分,设计上以颜色,大小来区分,为了页面的整体性,质感我们都保持一致的。用简短而又含义明确的动词或Zhe(者)动词短语作为标签,如果用户不需要的时候不要使用高深的专门用语。以后台页面的按钮为例,一级按钮和二级按钮尺寸大小规格都是一致的,只要就是以颜色来区分(整张页面中橙色De(的)按钮至多出现一ge(个))。下面红框部分的为表单列表中的按钮。

按钮的位置
1.视觉流向
用户浏览页面的视觉流向通常是从左上至右下的一条弧线,我们可yi(以)看到通常浏览器的操作都是在右侧,关闭|缩小|滚动条等等。符合shi(视)觉流向通常情况下,我们会将按钮安排在相同的对象右bian(边),或者是下面,但是复杂界面元素的底部一般是用户的“盲点”。我们将影响整个页面或者对话框的按钮,确认|取消|下一页|保存这样类按钮设置在弹出框的右侧有很好的扩展性,左侧可以添加帮助按钮,这样有助于功能的区域划分。
Ru(如)果按钮都有自己的xiao(小)图标,类似用于表单,列表中,可以将它们放在工具条或者类似工具条狭长的区域上,通常在页Mian(面)的顶部。





2.空间记忆
“我敢发誓,这个按钮一分钟前还是在这里!”用户经常通过回忆它们在哪里来再次找到它们,而不是它们的名字。hen(很)多软件的界面就是将 对话框的按钮 确定|取消 放在预定的位zhi(置)上,部分原因是由于它们的空间记忆(Spatial Memory)依赖性。
用户习惯的问题,当用户对于某种操作形成习惯之后,很大程度提高了他的工作效率,但如果我们设计上调整了习惯,他必须马上思考zhe(这)个工具一次,增加使用成本。举例看淘宝和当当的购物车页面,淘宝的操作是左右结构,虽然有4个按钮但是很符合我们的记忆,左边全选删除方便快捷。右侧的橙色按钮跟当当的绿色“结算”按钮功能一致,区别在于当当将“继续购物”按钮样式缩小了,这样会增加用户的判断成本。而且淘宝在这里处理的很好,大小样式很统一。当当的可取之处在于增加了一个“移入shou(收)藏”的文字链,个人觉得很实用,但是后续操作“移入收藏”的商品就不显示在购物车中了。如果改成“加入收藏”商品还是在购物车中保留,效果应该会更好。

源地址:http://www.aliued.cn/?p=2746

请站长喝杯咖啡?

站长一直坚持白天工作、晚上熬夜更新素材,付出了巨大的精力和时间,其中的辛酸难以言述。

坚持免积分、免登录、无任何限制下载!如果本站素材对你有用,不妨考虑请站长喝杯咖啡鼓励一下!

标签:

你应该也喜欢这些吧

共有 0 条评论

给个评价吧

验证码: