App的按钮尺寸,应该做多大?

几天前突然被问及这个问题,也是脑子一懵,“App按钮的大小,难道不应该根据具体问题具体分析吗?”。于是我去查了一些资料,下面是整理结果。

【规范标准尺寸】

《Iphone人机界面设计规范》建议:最小点击目标尺寸是 44*44px

《Windows手机用户界面设计和交互指南》建议:使用34*34px

《Android的界面设计规范》建议:使用48*48dp ①(物理尺寸为9mm左右)。

【手指实际大小

食指:成年人的食指宽度一般是1.6—2cm,转换成像素就是45—57px

拇指:拇指比食指要宽,平均宽度大概在2.5cm,转换成像素是72px

结论】

食指点击目标尺寸是44px*44px,拇指是72px*72px

小技巧:合理利用“触控目标”与“视觉目标”

例如在导出ICON时,假如你的ICON实际尺寸是32*32,那么你可以导出50*50PNG透明背景的ICON,重点是加了透明区域。这样就更方便点击了。

【其他】

相对于手机和平板,在尺寸上的选择方式会有所不同,目标尺寸的增加会降低失误操作的次数。

移动设备空间有限,需要测量屏幕尺寸,然后计算比例,搞清楚“在这种尺寸的屏幕上,合适的、最大的目标尺寸是多少?”

对于平板设备空间更多。不用害怕没有空 间去放置点击目标,空间足够,你可以非常悠然的通过提高尺寸来提高操作适用性。

通过调整目标尺寸的大小,结合实际的应用情况,能够有效的提高App适用性,同时提高用户体验。触摸屏上的目标就是用来让用户点击,不要让用户调整点击方式去适应App。

【备注】

注①dp与px的区别:

当屏幕密度为160dpi时,dp=px。px与屏幕的物理尺寸无关,只与屏幕的分辩率有关;而dp只与屏幕物理尺寸有关,与屏幕的分辩率调整无关。

Android官方建议使用dp作为尺寸单位。

注②数据来源:

MIT触摸实验室的做了一项研究,以手指指尖作为调查,分析其感觉机能。

 

 

原文链接:,转发请注明来源!

发表评论