本文主要是对按钮组的使用进行简单总结，享受〜

上周，一位朋友问了我一个问题。当按钮组被安排时，它是一个很好的组合还是一个单独的组合？这个问题当时被问到，因为我之前从未考虑过这个问题。为了回答这个问题，我简单总结了按钮组的使用方法，希望对大家有所帮助。

什么是按钮组？

顾名思义，按钮组指的是排列在一起的两个或多个按钮。为了理解按钮组的使用，我们首先考虑一个问题：我们何时使用按钮组？

从按钮组的样式中，我们可以看到公共按钮组供用户判断（两个选项）或选择（两个或更多选项）。

判断

首先，我们判断只有两个按钮。一般来说，两个按钮中的一个必须具有更高的优先级或者用户更喜欢点击，然后我们将区分样式设计。

微信”取消”按钮背景颜色为灰色，而淘宝直接让“rdquo;取消”成为一个裸文本按钮。此对比度设置允许用户快速找到“检查登录”按钮以完成登录操作并提高操作效率。

实际上，允许用户做出判断的组件具有切换功能。开关，也称为开关，也是我们的一个非常常见的组件，这意味着在两个相反的状态之间切换，主要用于指示功能的打开和关闭。功能的打开可能会导致后续操作。例如，如果您在iOS设置中启用了微信的“通知”功能，则需要进一步设置通知表单。按钮组不会出现这些后续操作，更像是锤子销售，这也是按钮组和开关之间的主要区别。

当我年轻的时候，我们家的灯开关都被拉了。拉绳开关的一个缺点是，当电源关闭时，您不知道当前灯是打开还是关闭。这很头疼。因此，必须使用开关使用户在清除操作后知道当前状态和结果。事实上，淘宝的这种转换并不是很好，因为这里的图形提示不是很清楚。

线性和平面

在上面我们提到了设计中的比较理论，这里我们不妨扩展一下。在设计按钮时，我们经常会遇到选择，线性按钮或面部按钮。事实上，线性或平面参数不仅存在于按钮中，还存在于图标，制表符和标签中。平面和线性形状代表不同的设计概念。我们都知道平面元素更有可能在界面中吸引用户的注意力，而线性元素则强调轻量级。特定于按钮，只需面部按钮比线按钮更易于点击。我们可以看一个例子：

WeChat< ;; Contacts""中的图标向背景添加颜色块，但是“发现”。 &“I”界面图标没有背景颜色块。我试图删除图标颜色块的背景，发现其视觉重量立即降低。由于地址簿界面中有用户头像，如果不添加颜色块背景，用户很难注意到这四个功能。因此块元素的使用可以提高函数的转换率。

我们来看一个例子。喜马拉雅Fm界面中的“录制”按钮实际上看起来像是一顿特别的餐，因为它非常尴尬。但是，达到了设计师的目的。为了增强用户的粘性，他们绝对希望用户可以在喜马拉雅Fm上传他们自己的录音，因此它们必须足够引人注目。

我们在这个界面上进行了高斯模糊处理，发现视觉焦点在于这个“录音”按钮，所以“它是什么？”我担心你不尴尬！

“One”是我个人喜欢的应用程序。除了必要的地图外，界面中的所有图标和按钮都是线性元素，给用户带来清新优雅的感觉。适应这个产品的气质。

对于产品而言，设计师的责任非常大，不应仅限于现在的艺术水平。从整个产品的角度来看，设计者必须准确地定位目标用户组，并根据目标用户组的偏好确定界面设计风格。在每个界面中，设计者应考虑每个功能的优先级排列。不要被打扰，你可以做的事情越多，你的替补越低，你得到的报酬就越多。

选择

喝完鸡汤后，让我们回到主题。当按钮组中有三个或更多选项时，我们该怎么办？

实际上，这个具有多个选项的按钮组样式可以看作是单选/检查功能的变体。然而，传统的单选/退房风格难以满足当前的设计需求，并且用户渴望更多新颖和多样化的按钮样式。特别是在选项太多的情况下，按钮的优点突出显示。

然后我们回到上一个问题，“当按钮组被安排时，它是一个很好的组合还是一个好组合？”对于这个问题，我想是这样的：单独的按钮样式更具适应性。你可以换行或滑动。组合按钮样式通常是完全遍历的，适合显示具有更高信息级别的功能。用一句话概括：如果选项可以在屏幕的宽度上显示，那么组合与分离之间的差异不是很大，但是一旦选项太多，用户就需要滑动并换行查看，单独的风格更适合。

单个选择/检查供用户选择。实际上，有一个类似于单选/检查的组件，即下拉列表。当选项太多时，用户可以使用下拉菜单显示和选择内容。下拉列表的优点是可以节省界面空间，但是想要查看所有选项的用户必须单击下拉列表，添加步骤以及屏蔽界面中的其他内容。因此，当您的界面元素不多时，我个人的建议是尽可能使用收音机/检查按钮。

以上是我对按钮组的使用总结，希望能给大家带来一些帮助。

专栏

王M大赛（微信公众号：王M大赛），大家都是经理专栏作家，高级网络人士。

这篇文章最初发表。未经许可，禁止复制。

该地图来自unsplash，基于CC0协议