按钮边框用3px好还是5px好？
The following article is from 白话说交互 Author 小昱被占用了
作为交互，偶尔在团队人力短缺的时候也被要求向后补位，做一些简单的视觉。然而每次做视觉的时候我都会感到有些难受。原因在于我总是被要求解释一些像素级问题，比如，间距多2px会不会好一点、透明度为什么是70%而不是50%，诸如此类...正巧本周和一位好友聊天时，聊到了前谷歌首席设计师离职时写下的一篇博客，里面的一个段落可以表达我面对这种问题时的内心感受：
可以看出证明或者纠结这样的像素级问题无论对于哪个阶段的设计师来说都是疲惫且无奈的。
是2px的问题吗？
我们常在做设计的过程中，随着设计得越来越深入，越来越细节，视线逐渐由宏观变得越来越微观。可能这个需求目标是“在图文信息流中增加一个账号关注模块”：
这种需求目标下，“账号的间距多2px还是少2px”会对账号关注率产生影响吗？我相信大多数人的答案都是否定的，即使公司人傻钱多非得做实验争个2px带来的收益，这2px带来的收益会有多少呢？能占优化推荐算法带来的收益百分几或千分几吗？我们还值得花这些人力成本和时间成本去验证吗？
上述举例的目标和问题是产品向的，如果说我们换成一个设计向的。假设现在团队觉得我们的推荐算法已经优化到天花板了，但是推荐账号关注率仍然上不去，所以想要从设计层面解决问题。
那么此时，关注按钮的边框用3px还是5px关键也不在于这个数字，而是什么样的设计能让「关注」在这个模块里有更高的区分度，视觉上更突出。毫无疑问，单从边框粗细上来说5px肯定好于3px，从按钮底色上来说红色肯定好于灰色，按钮字号上来说更大的肯定好于更小的。这些都是根本不需要实验就可以得到的结论。而真正的问题是什么呢？
如果不克制，推荐账号就可以设计得无限吸引眼球，关注按钮又红又大，一方面影响了图文信息流的消费，一方面图文信息的业务也不干了，也会要求图文放大再放大，评论点赞再大、再红、最好来个动效。这样五颜六色五花八门的视觉效果，是产品想要的吗？显然不是，所以规范和组件的作用就体现出来了，它帮助我们从全局的视角去定义内容和行动的优先级，高优内容如何展现，高优行动如何展现，其他的普通内容与行动如何展现。交互的工作之一就是思考与梳理什么的场景下什么是高优的。也因为有了规范，所以「关注按钮边框用3px还是5px」也不是一个问题，问题是「在消费图文信息的场景下，关注推荐账号是否是高优/推荐行动」，如果是，那就用规范里的强化btn去展现，如果不是（显然不是），那就用规范里的基础btn去展现，没必要去纠结这2px。
如果到了这一步，需求方还是觉得这样的按钮不行，没有达成他们提高推荐账号关注率的目标。那基本可以确认问题在于产品认为现有的按钮组件在图文信息流里区分度不明显。这时候我们要纠结的也不是3px和5px的问题了，而是组件中的按钮样式需不需要做全局性的设计优化。
那么做组件的朋友可能就要问了，如果我被挑战组件里的按钮边框是3px好还是5px好，我该怎么办呢？这可以从实用性和美观性两个角度来回答。
从实用性角度，你可以把目前产品所有按钮的典型使用场景都拉出来，代入3px和5px后，去感受下哪个数值在各个场景下都可用（有足够的区分度、可感知是个按钮、不会出现蓝底红字这种违反科学原理折磨晶状体的情况）。
美观性这个角度就很难解释了。当然你可以从一些已被验证过的理论（例如格式塔）来陈述怎么做是美的。但这些多是方法，如何验证“美”，“美”是否可以被量化，这个问题至今仍在探索。也有许多学者已有研究，感兴趣的朋友可以去b站听听复旦大学王德峰老师关于艺术哲学与审美问题的公开课。我浅谈一下我的部分理解：美是可以被训化的。更多时候我们都是先被动地接收了“什么是美”（可能是影视作品、新闻报道、产品发布会...），才会在面对一些视觉表达时输出自己的判断“美”或“不美”。举个例子，唐朝推崇“以胖为美”，所以大家都觉得胖好看；现代鼓吹瘦为美，所以大家都觉得瘦好看。早几十年，明星都是方圆脸，所以大家都觉得脸方一点圆一点大气好看，后来主流媒体又在营销某些V脸明星的美貌，所以风向又变成了小脸尖下巴好看。我们的文化背景下，复杂也是美的（例如东北花棉袄，复杂的祥云图腾，陶瓷纹饰），因为从小就在复杂的信息过载的环境下长大，所以我们对于复杂信息的接受度比外国人要高很多，最直接的体现就是我们的购物软件首页，五花八门应有尽有，大家用起来也觉得挺方便，而国外的软件就会分门别类，每个类目下信息和功能都尽量展现得简单。这几年在苹果设计（以及其他以简为美的品牌）的强势输出和营销下，我们逐渐被“驯化”为了以简为美，所以设计趋势才逐步趋向于简单。视觉如此交互也是如此，我们之所以需要有规范，也是为了“训化”用户后，让用户不加思考就可以知道什么功能会出现在哪里，不用学习就知道要怎么使用。“美”或许是被外界的主观输出“驯化”后，我们作出的自认为客观的判断。回到2px的问题上，如果目标是提升“美感”，在论证按钮组件是3px美还是5px美的时候，或许强势的营销和频繁的曝光会成为观点的有效辅助。但如果目标是提升数据，讲到这里你应该能发现大多数情况是无法用外界的主观美学去解决产品的客观问题的，因此纠结2px带来的美感提升从而带动数据提升也是有点强“美”所难。
关注真正的问题吧！
虽然上文里讲了很多如何应对“2px”问题的方法，但我其实更希望产品和设计人员能把更多的时间和精力放在真正的问题上。用户不在你的平台购买商品是因为你的商品之间设计的间距不够大吗？可能更多是因为优惠信息不明显、优惠力度不够、物流慢、售后差吧？用户不来你的平台观看内容互动评论是因为图片太小字太大吗？可能有点联系，但会不会是我们没有把发表工具做好导致内容局限无法适配多图大图，会不会是缺少内容曝光渠道导致用户无处消费，会不会是没有创作者上升通道指引使得头部一潭死水腰底部的努力与才华无处施展？怎么做出和品牌契合的等级体系呢？怎么在不影响视频消费的前提下融入直播预约呢？如何优化内容创作工具的使用体验呢？有如此多2px外的设计问题值得我们去纠结，我们为什么一定要把目光死死地盯在像素之间呢？
开头提到的2009年谷歌针对41种蓝色做实验的后续是，在2016年的时候，谷歌又针对链接色蓝改黑做了一次AB实验：
而在这期间，由于安卓设计原则频繁改动，甚至谷歌自己的内部团队无法遵守这些朝令夕改的“设计原则”，移动端应用设计逐渐只为iOS设计然后复制到安卓...
字节B端设计规范ArcoDesign和AntDesign有何不同？