谈到按钮的设计，我们说的话太多了。确认按钮在左侧或右侧，鬼按钮可靠且不可靠，阴影的存在是合理且不合理的，等等。但是今天不要谈论它，让我们谈谈如何设计一个具有高转换率的按钮：

我们经常坚持一定的设计细节并彻底讨论它。这样的询问并非毫无意义，因为即使是最小的细节也会破坏近乎完美的设计。

所以，今天的文章我们继续深入研究设计细节，探索按钮的设计。用户每天都会触摸从现实世界到虚拟界面的按钮，从移动端到桌面端。它是当今界面设计中最小的元素之一，也是最关键的控件。当你设计一个按钮时，你有没有想过在什么情况下用户会与它进行交互？该按钮将在整个交互和反馈循环中提供信息吗？

在早期的平面设计中，由于对按钮的不良感知，用户经常处于拖延状态，这也反映了按钮本身在UI设计中的重要作用。

它应该看起来可点击/触摸

用户看到一个可点击的按钮，具有点击和触摸的冲动。尽管按钮在屏幕上以各种尺寸出现并且通常具有良好的可点击性，但是按钮本身的尺寸和移动设备上的按钮周围的间隙的尺寸是非常特别的。

一般用户的指尖大小通常为8~10mm，因此大小为10倍; 10mm触摸交互对象是合乎逻辑的，这也是移动端的习惯规则。

要使元素看起来可点击，请注意以下提示：

·微妙的阴影使按钮看起来“漂浮”在界面之外，使其看起来更贴近用户

·增加按钮填充以使其看起来更容易点击并引导用户点击

·通过实时颜色和效果更改执行悬停或点击操作时提示用户

颜色很重要

按钮的颜色需要根据整个代购源码网站的颜色单独匹配。作为用户交互的核心，按钮适合强调页面中的特定颜色。

按钮的颜色应该是明亮和迷人的，这就是为什么这么多的UI设计更喜欢明亮的黄色，绿色和蓝色按钮设计。如果要在视觉上突出显示按钮，则按钮的颜色优选地选择色轮上背景颜色的相对位置的互补色。

另一个值得注意的是品牌的颜色。您需要选择与您的品牌按钮颜色方案相匹配的颜色。它需要既可识别又相关。无论您的配色方案如何调整，该按钮必须首先与您的主要配色方案相关联并保持一致。

尺寸的影响更大

按钮很大！设计师经常被不同的人筛选。 LOGO是最受指责的地方，在设计按钮时，它也是钢铁。只有当按钮尺寸足够大时，用户才能在看到界面时被吸引。虽然幽灵按钮可以占据足够大的区域，但幽灵按钮缺乏视觉重量使其不是最佳选择。因此，我们所说的不仅是大的大小，而且视觉重量应该是“大”。

当然，按钮的大小也是一个相对值。有时，相同尺寸的按钮在一种情况下尺寸合适，而在另一种情况下可能太大。在很大程度上，按钮的大小取决于周围元素的大小比例。如果按钮是界面中唯一可见的元素，则没有人会错过它。

位置也很关键

按钮放在哪里？界面在哪里可以为您带来更多流量？

在绝大多数情况下，应根据页面和应用程序的内容添加按钮：

·在表格的底部

·靠近行为召唤信息

·在页面或屏幕的底部

·直接在信息下方

你为什么被安置在这些地方？因为它们遵循用户的习惯和自然的交互路径，无论是网页还是应用程序。

专注于比较

几乎所有类型的设计都需要对比。设计按钮时，不仅按钮中的内容（图标，文本）可以与按钮本身形成鲜明对比，还可以与按钮，背景和周围元素形成鲜明对比。形成对比。

然后，在设计时，需要考虑以下因素：

·颜色

·字体重量和大小

·元素的大小

·背景和形状

·阴影和渐变

·白色空间以及内部和外部间距

使用标准形状

在考虑按钮的形状时，您只需要考虑两种情况：

·回合。随着Material Design设计规范的推广，圆形按钮已被大家所接受。圆形按钮广泛用于当今流行的平面设计风格，适用于当前的用户模式。

·长方形。矩形按钮（包括正方形和各种圆角矩形）是每个人感知中按钮的最常见和默认形状。它符合用户的认知和习惯。大多数按钮是按钮宽度的两倍（当然还有三到四次）。当用户看到它时，他立即明白它应该如何与之交互。至于使用圆角或直角，这是另一个问题，请选择适合您设计的款式。

告诉用户该做什么

每个按钮都包含一个文本命令，告诉用户按钮的功能。因此，按钮上的文字应尽可能简单直观，并使用与整个代购源码网站的风格相匹配的语调。

然后，你需要“兑现承诺”。当用户点击按钮时，按钮指示的内容和结果应该合理且快速地呈现在用户面前。无论是提交表单还是跳转到新页面，用户都应通过此按钮获得预期结果。

按钮的内容通常包括：

·戳我！

·立即创建

·免费试用

·加入购物车

·查看更多

让按钮具有更高的视觉优先级

几乎每个界面都充满了各种不同的UI元素。在设计过程中，设计人员经常设计许多不同的版本，直到项目即将完成，从几个类似的程序中选择一个版本。

不要陷入这种困境。

按钮应该具有按钮的外观。按钮应该是整个设计中的独特控件，应该在形状，颜色和视觉重量上区别于其他按钮。想一想，当你创建大按钮和其他大型控件时，整个配色方案中的颜色是独一无二的，它肯定比黑暗中的萤火虫更显眼。

结论

阅读完本内容后，您是否开始重新考虑按钮的设计？你能创建一个更加用户友好且转换率更高的UI界面吗？您可以尝试上述建议并结合正在进行的代购源码网站/APP的数据分析。 ，以更准确地了解用户对您的新设计的实际影响。

« 六种SEO优化策略可帮助您超越同行 | 案例研究：产品反馈设计 »