分享
查看: 1419|回复: 1

[分享] 【转帖】选择类控件设计解析(5)

[复制链接]

【转帖】选择类控件设计解析(5)

发表于 2021-3-9 13:50:18 来自 分享 只看大图 阅读模式 倒序浏览
zzv_icon1419 zzr_icon1 查看全部
本帖最后由 嗨,狗子 于 2021-3-16 18:10 编辑

前文传送门:
选择类控件设计解析(1)
选择类控件设计解析(2)
选择类控件设计解析(3)
选择类控件设计解析(4)


【转帖】选择类控件设计解析(5)
2.1 状态

选择控件在操作过程中必须更改其状态/外观,以便用户知道是否能选中,是否被选中。添加这些小的视觉反馈,以使用户正向的理解,但是差异化设计又不能喧宾夺主。
默认
默认就是选择器的开始状态。向用户表明,可对该选择控件进行操作。
【转帖】选择类控件设计解析(5)

禁用
选择按钮置灰显示,用户将无法与选项进行交互。除非产品规则指定,否则很少会遇到这种状态。
悬停
像按钮一样,选择控件应向用户指示它们是可交互的。通常,通过突出显示鼠标悬停项目区域的背景来突出显示,吸引用户的注意。触摸设备没有悬停状态。
【转帖】选择类控件设计解析(5)

按下
当用户按住鼠标/手指点击,选择控件处于被点击的状态。
列表多选支持批量选择和清除
使用列表多选,一次全选或取消已选择的多个选择项毫不费力。
【转帖】选择类控件设计解析(5)

下拉列表状态
下拉列表在按下状态时会打开选项列表,还有种常见做法是悬停状态时直接打开选项列表。我更喜欢第一种,第二种在我没有明确操作的情况下,下拉列表就自动打开的这点让我比较困惑。
列表选择状态
列表选择控件在管理文件时,只有通过按下选中选项才能进行编辑性操作。
点击按钮进入批量编辑状态,状态未选择时,操作按钮置灰。按下/勾选列表选项后,操作按钮点亮,展示已选项的数量,即对当前勾选操作的反馈。点击操作按钮,进入对应操作编辑流程。
失败反馈
一般都是用户没有进行选择,单击“提交”按钮后收到失败反馈。
在实际的使用过程中,选择控件有默认、禁用、悬停、按下等不同状态,虽然这些状态看起来很多,但是这些状态涉及到实际交互的需求和不同场景,并且是实现可靠交互的基础。
2.2 选项
中立的选项
这个针对于单选框控件
如果用户不想做出选择,那么应该提供一个中立选项。为用户提供一个明确的方向,中立选项比错误选择要好。
在单选框的选择时,要充分考虑用户的实际情况,给出的选项要覆盖到所有的情况。例如,要考虑到用户不进行选择的情况,这时需要提供一个“无”的选项;给出的选项有可能都不符合用户的情况,如果所有的选项用户都不会选,就需要提供一个“其它”选项。
【转帖】选择类控件设计解析(5)

单选框所有选项应该满足“互斥”的原则,因此选项之间要避免存在交集,选项覆盖要全面,不能出现遗漏。例如,在一个年龄的选择设置上,如果提供的选项为“20-30岁”和“30-40岁”,那么如果用户刚好30岁该如何选择?
【转帖】选择类控件设计解析(5)

通常给一个默认选项
这个针对于单选框,Tab切换,下拉列表
把控制力交给用户
单选框最好有一个默认选项,当单选框把选项默设置为为选中时,一旦选择了一个单选按钮,用户就不可撤销,无法返回默认状态;而默认选中一个则可以防止这类问题,一开始就向用户传递信息必须要在这组单选项之中选择一个。
加速进程
下拉菜单中默认选项优与请选择,如果根据权限或使用频率能定位到适用于大多数用户的选择项时,就不要默认为“请选择”,而是使用默认选项,这样做可以降低交互成本和节省用户的时间和点击数。
如“国家”和“语言”字段。在这种情况下,根据权限IP,默认选项是合理的,绝大多数用户也不会更改选项,因此继续选择就会很烦人,耽误时间。
增强“建议”
带有默认选项的单选按钮组合是给用户的强有力建议——甚至是推荐。默认选项可能会引导用户做出最好的决定,并在接下来增加他们的信心。尤其是默认选项可以辅助用户,并让用户向着产品所希望的方向倾斜。
在用户需做出复杂决定或处在不熟悉领域时特别有帮助。当标题和描述都很陌生的时候,默认选项可以引导用户在各个可能未能理解的选项里做出最好的决定。
在产品上总想说服用户做出对产品有利的动作。默认选项就会引诱用户去走特定的道路。常见的例子就是活动页面,对于忍痛离开按钮低调置灰显示,对于留在页面按钮高亮显示。
当然也有许多时候是不带默认选项的:
不知道用户行为或想要什么
选择是否会冒昧,如性别,称呼等
防错,保证用户能够看到选项并动手做出选择,比起用户会出错并事后给出警示强
注意选择数量
如果希望用户只选择一定数量的项目。要强制执行此操作,如果用户单击的次数多于所选数量,则他们最早的选择将会被最近的选择替换。同时注意需要加上辅助说明。
【转帖】选择类控件设计解析(5)
avatar

41

主题

71

帖子

460

积分

中级会员

Rank: 3Rank: 3

积分
460
不想翻身的咸鱼 发表于 2021-3-9 14:48:56 显示全部楼层
【转帖】选择类控件设计解析(5)
avatar
游客~
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

130700ppkpl8x3t7tt1b1t