当前位置: 首页 > 图文教程 > 网页制作 > 心得技巧 > 设计理论:触摸屏按钮的尺寸和空间设计

心得技巧
良好的网站用户界面所必须的8个特性
设计师挖掘客户需求设计:围观的就是你
设计观点:设计师领导力的培养
交互设计探讨:为什么需要在新窗口打开网页
程序员职业发展:如何作技术型领导
设计经验:谈谈web的默认字体
设计标志:28个餐饮和食品类网站的logo标志
用户体验设计涉及的几个用户研究设计讨论
设计规划在产品设计前期是非常最要的
用户体验:符合中国国情的网页链接新窗口打开
网站导航用户体验设计:选中状态是高亮还是灰色
更好的用户体验:过滤器(Filter)的搜索
产品设计:打动用户的产品需求
用电话进行用户访谈的几点事项
用户体验:用户行为研究
用户研究:与众不同的心理学
懂得项目管理的设计师在团队协作中的优势
交互设计理论:我们眼中的交互设计
UE学习笔记:心智模型二分法探讨
利用简单的线条设计充满典雅风格的封面

心得技巧 中的 设计理论:触摸屏按钮的尺寸和空间设计


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-10-01   浏览: 106 ::
收藏到网摘: n/a

在触摸屏按钮设计当中,尺寸对可用性的影响相当巨大。ISO和ANSI标准都推荐0.75" x 0.75"(约19 x 19毫米)的尺寸,来自莱特州立大学心理系的一项研究也表明0.75" x 0.75"的按钮对于用户来说是满意率最高的。

让我们来稍微深入地探讨一下,我觉得1.25" x 0.75"(约32 x 19毫米)才是最佳尺寸。为什么呢?这个当然和比例有关,就像陪你度过童年的普通电视机现在早已被宽屏电视剧所取代了,这背后的道理其实也是比较简单的。

 

按钮本身的尺寸是一个方面,按钮间的间距呢?非常有意思的事实是按钮间的间距对于整个交互的性能和精确度影响微乎其微。所以即使在屏幕尺寸很小的情况下,仍然建议增大按钮面积,哪怕这样做会使很多按钮紧挨着。当然如果有多余的空间,最高0.125"(约3毫米)的间隔还是有助于让界面用起来更舒服,尽管整体精度和速度不会发生变化。

希望在你的设计里使用尺寸更小的按钮?没问题,我们这里讨论的尺寸都是按钮的实际可触摸面积。如果你使用了更小的按钮,只要保证按钮的可触摸面积超过他本身的可视面积,达到我们的要求就好了。当然这种情况下就得考虑按钮间的间距问题了。

如果你要处理的触摸屏尺寸实在是非常小,你可能不得不使用小于0.75"(约19毫米)的按钮。这个时候0.375"(约9.5毫米)的尺寸可以作为参考,但是绝对不能让按钮小于0.25"(约6.4毫米)。就像投掷飞镖一样,无论用户离触摸屏多近,都很难每次都“命中”按钮的中心区域。一个普通的人多次按同一个点,其精度一般在0.125"(约3.2毫米)以内。

那尺寸变大呢?不得不说这也未必是好事,因为大过一定程度之后用户点击的精度不会提高,速度反而会下降,因为移动于各个按钮间的时候手指必须移动更大的距离。

 

现在让科学来告诉我们一个理想的按钮应该是什么样的。

希腊字母 "φ" 在数学上往往表示一个定值——1.618,也就是大家非常熟悉的“黄金分割”。了解文艺复习的朋友肯定都知道黄金分割被广泛应用在非常多的地方。比如蒙娜丽莎这幅画上所使用的黄金分割就足够你写一整本书了。

如果你把这个黄金比例用在按钮上,那这个“理想”的按钮大小就是1.25" x 0.75"(约32 x 19毫米)