按钮是在使用软件中必备的元素，连接用户与系统、产品、服务过程中起着重要作用，作为交互设计中的主要控件，我在本篇文章中将通过按钮看的可点击性、位置、反馈、尺寸这四个方面去讲诉交互设计师在设计按钮时需要依照的原则。

一、按钮的可点击性

当涉及到与用户界面交互时，用户需要立即知道什么是“可点击的”，什么不是。用户靠以前的经验和视觉符号来判断界面中元素的含义，该部分从形、色、字这三个方面出发，去描述按钮的可点击性如何设计。

（1）形

下面给几个绝大多数用户都会熟悉的按钮： 

1、大色块按钮：具有突出性，第一时间就能锁定视觉焦点，所以非常适合用来引导用户操作（非常符合call to action即行为召唤原则） 2、幽灵按钮：描边按钮的突出性都较弱，在界面上视觉和谐度更高，指引性不强。 3、半透明按钮：指引性较差，但可保持界面的和谐度   4、投影按钮：在大色块按钮的基础上，让该按钮更突出，让页面层级关系更分明。

以上仅是将按钮做了分类，重要的是如何去运用，突出重要或引导用户行为的信息，从而达到设计的目的。

·淘宝双十一领取红包的入口弹窗，通过按钮“形”的差异，吸引用户继续领取红包。

（2）色

主要包含两个方面内容：

与品牌相呼应：常见的App按钮根据品牌主题色有着不同色彩；

行为召唤（call to action)：颜色鲜明，增加强烈的对比刺激用户点击欲望；

 ·知乎的注册、登录等常用功能按钮与品牌主题保持一致。 爱彼迎首页领取礼券按钮颜色非常明显，刺激用户的点击欲望。

（3）字

1、确保文字阅读无障碍

按钮文案应该提示用户具体的操作行为 让用户确信按钮将执行预期的操作，这有助于用户决策     用词准确，防止产生歧义

2、在按钮微文案的设计上，要简练清晰地指明功能，给予用户以提示。

tips：【登门槛效应】只一个人一旦接受了他人的一个微不足道的要求，为了避免认知上的不协调，藿香给他人以后留下前后一致的印象，就有可能接受更大的要求。利用登门槛效应，引导客户进行下一步消费。

给出有效的引导性文案，采用“去、试试、立即”这样的行为动词，降低门槛。

二、位置

（1）用户是扫视，不是细读

通过用户的浏览习惯去设计页面的样式，把握页面层级。

  A 、古登堡式的浏览模式

 左上角的“主观区”(Primary Optimal Area）、右下角的“终点区”（Terminal Area）、右上角的“强沉寂区”（Strong Fallow Area）和左下角的“弱沉寂区”（Weak Fallow Area）。按照这个图，西方读者会自然地人“主观区”开始，从左到右、从上到下扫视一个页面，直到“终点区”。整个视线路径是一个大号的Z，其中最开始的两个视觉驻留点就在页头上。

B、 F 图模式

用户先会沿着水平方向浏览，优先浏览内容块的上部，这个时候的眼动构成了字母F 最上面一横。F图模式常见于博客、新闻类信息量较大的网站。

综上来看：顶部和底部都是用户实现必经的位置，放置在页面的中央也可以，无论在F图模式还是古腾堡式中，用户都会扫过这个位置。

（2）菲兹定律

距离（D）：既起始位置离目标位置距离越远，我们到达目标位置所花费的时间就越长。反之，离目标位置越近，我们所花费的时间就越短；

目标大小（S）：即目标面积越大，我们定位到目标的所花费的时间就越短。反之，目标面积越小，精准定位到目标上的时间就越长。

使目标容易触碰距离或尽量缩短目标位置，提升用户体验 缩短距离：抖音在长按屏幕时，通过系统判断用户进行触发时，手指与屏幕的接触位置，并将模态弹窗的操控按钮显示在离用户手指最近的位置 扩大触及区域：目标面积较大，手指在屏幕上在往下触碰，也不会超出这个按钮的覆盖面积

三、提供反馈

通过文案以及按钮样式的变化反馈操作结果 微博的点赞按钮长按可以选择表情表达心情。

四、尺寸

麻省理工学院的触觉实验室研究发现：10mm*10mm是一个很好的最小触摸目标 移动用户界面中的 CTA 应至少为 44×44 Pixels，而微软推荐 34×26 Pixels