赞助商
立即赞助

禁用按钮应该怎么用?来看高手的分析!

交互设计3年前 (2021)发布 流光
2.3K 0 0

最近收到的一则问题,大概是:在做设计的时候,经常会遇到一个问题,就是一个按钮,在同一页面的不同情况下,有时可用,有时不可用,我们到底是显示不可用时的禁用状态呢?还是直接隐藏这个按钮呢?

大家还是喜欢提这种通用性问题,希望有一个说法,可以概括所有情况。但我多次说过,不存在这样的好事,一定是具体问题具体分析的。

尤问题,聊透彻,例举证,结短。

禁用按钮的使用,可以从两个维度来分析,分别是:「无效的禁用状态」和「有效的禁用状态」。

无效的禁用状态

有一种情况是,在一个页面里,一个按钮,可能会有几种不同的情况存在。那人要问了,既然是一个页面,为什么会有多种状态同时存在的情况呢?

比如,在出行场景中,普通乘客发起订单,司机接单后是可以发送消息的(左图)。但是从第三方渠道来的乘客,司机是无法发送站内消息的,只能通过电话联系乘客(右图)。

禁用按钮应该怎么用?来看高手的分析!

不同渠道来的用户,司机端的页面会呈现不同的按钮状态。相同的页面,第三方渠道来的乘客,在司机端就不需要露出消息按钮了,这样可以减少无效信息对司机的干扰,还可以避免司机习惯性操作带来的无效反馈,比如点击消息,显示「无法发送消息」。或者显示禁用,也会影响司机的操作判断。

从这个案例中我们可以看出,当一个按钮在某种情况下始终无法被触发时,就会选择让它直接消失,而不是呈现禁用状态。

很多人在这类设计里会给按钮提供一个禁用状态,以免按钮消失而打乱页面布局。但是要知道,在某种情况下,按钮无用时,无意义的展示反而会产生干扰信息,就像上面说到的那样。

结论:禁按钮需触,,禁状存必。存,它效状。

既然是无效的,最好就不要出现了。

有效的禁用状态

在上面的例子里,有一个前提不可忽略,那就是司机是否可以理解我们不显示的原因。当然,司机会接受相关培训,产品中也会有渠道标识,所以司机能够明白页面中存在的差异。

但在其他产品中,当状态不同,按钮变化无法自洽的时候,又怎么去处理呢?我们就需要通过合理的解释来消除用户潜在的困惑。

对于这点,比较典型的案例是在线上购物时,一件商品会有多个类型供消费者选择,比如不同的尺寸、型号等,当其中一种类型被抢光时,这个商品依然是可见的,只是无法选择,展示出了禁用状态。

在这种场景中,我们不能一下子把其他无法购买的类型隐藏,因为用户需要知道我们所有的商品类别,了解商品的全部属性,尽管当下无法购买,但有上新的可能,用户依然可以选择等待,并将其加入收藏,还是会有机会促成这笔交易。而且当可选类型变多的时候,只是禁用没有库存的类型,可以使其他可选项保持固定的位置,有利于我们二次搜索和加购。这种场景的禁用也是暂时的,直到商品下架或者上新。

,见,认,它并。禁况。

虽然我们现在还是会在各个地方看到禁用操作,但是禁用的原由始终没有给到用户合理的解释,以至于许多人见到类似的操作都是一头雾水。所以在设计过程中,尤其要谨慎对待,尽可能的避免出现无法解释的禁用操作。

好比淘宝的商品选择页面,如今也将原来的商品纯禁用按钮,替换成了「缺货」。选择缺货的商品之后,按钮会变成「提醒掌柜补货」。

禁用按钮应该怎么用?来看高手的分析!

从原来的用户单方面接收无法点击的按钮,到现在直观显示缺货,点击后同时提醒到商家,这样的操作从功能角度来说是一个升级。

这就是我说的,有效与无效的禁用按钮之间的区别。禁用不该是真的禁止使用,而是告知用户,它如何可被使用。

小结

如果一个按钮在不同的阶段有禁用和可用的状态显示,那么意图是很明显的。比如一些活动页面,某个按钮的禁用状态是倒计时,就像电影的前期宣传,为电影的上线制造话题和热度,来鼓励更多人的观看一样。

对于按钮来说,显示禁用则代表它在满足一定条件后即可拥有可点击性,让我们明确地了解它就在这里,未来是可操作的。按钮也有很多的设计空间来为未来的使用做好铺垫,特别是营销类的活动,像是「明日 8 点可抢」、「提醒商家补货」的按钮文案,无一不在传达「可用性」的信息,引导用户持续性的关注。

类禁状静默示,表,户输则法击,,。它仍优,,它禁状,醒户应何激,漆黑,它存图。

我们要知道的是,禁用按钮本身不是一个特殊的对象,只是禁用状态在页面中是一个特殊的存在,它是产品设计中的一种规则。为什么按钮不可用,或者说一定场景下为什么功能不可用,当无法依靠用户直觉理解的时候,是需要作出解释的,也就是怎么禁的问题。

但是最开始设计时就应该去想的是,禁用状态对用户和产品的意义在哪里,这和我们设计方案时脑海中涌出的无数目标一样,是一个基础的出发点。而后,一切迎刃而解。

欢迎关注作者的微信公众号:「呆呆U理」

禁用按钮应该怎么用?来看高手的分析!

© 版权声明
您必须登录才能参与评论!
立即登录
暂无评论...

相关文章

在互联网产品圈里,用户体验一直是被格外推崇,几乎每一个产品经理都会把用户体验挂在嘴上。即便是一个产品菜鸟也会在言谈间...
交互设计
Tesla Model 3,标志性意义的中控设计,成为汽车业内一个颠覆式创新。采用极简的内饰设计,精简了物理按键,甚至连仪表都不复...
Tesla Model 3
最近从之前的项目出来做国际版,和之前项目的设计负责同学唠嗑,最多的感慨是有关“背锅”的问题。 啥锅呢? 估计不少铁汁也...
交互设计
上瘾论? 最早接触「上瘾」一词除了毒品瘾品外,就是被称为「精神鸦片」的电子游戏。最初,我思考游戏的成瘾原因很简单,就是...
上瘾
随着市场上游戏品类的不断丰富,卡牌、RPG、MOBA、大逃杀等游戏类型在游戏交互方面也有了更多的表现,随之而来是玩法与界面的...
交互设计
在线少儿教育的游戏化,已成为提升小朋友满意度和调动学习积极性的常用手段。本期我们请到少儿的交互设计师与大家聊聊, 流利...
交互设计
一次会议的演示文稿,通常是一个 .pptx 格式的文档,而日常来往的邮件附件里的文档则多是 .docx 和 .pdf 格式的文档。当然,...
交互文档
讨论一个比较常见的问题。 读者: 呆呆,这个图的卡片列表里,标题用省略号合适吗? (因为原图涉及读者项目隐私,所以重画...
交互设计