喜欢设计,也喜欢UI

触屏手机 — 点击区域

瞬:



1、点击区域


一般人手可点击区域,左撇子翻过来。




2、热区

EASY区域为热区,热区是用户手指最灵活的区域,最易于点击,而且出错率最低。




3、上部视野好,下部易操作


人的阅读习惯是从上往下的,所以会首先注意上部,所以上部视野好,适合放重要信息。

下部易于用户点击操作,所以下部适合放重要的操作。




4、扩大可触控区域


为方便用户点击,而在按钮的上下左右增加可触控区域。可灵活运用。




5、注意留白,以方便用户点击



避免离按钮太近,而发生误点击。




6、点击要有反馈


无论点击了哪个按钮,都要给用户一个反馈,提示用户:“你已经点击了”!




7、无效点击不要给用户任何反馈!

上图的红圆内,是点击屏幕会出现的一个“白点”。但实际上点击屏幕,不会产生任何效果。所以,这里就不应该有这个白点,无效点击不要给用户任何反馈!




8、食指点击区域


大多数成年人的食指平均宽度为1.6至2厘米(16–20毫米),转换为45–57像素。

用户食指紧贴按钮时,能看到按钮的边缘。这为他们提供了清晰的交互反馈,帮助用户判断击中目标的准确性,也提升用户击中目标的效率。




9、拇指点击区域


一个成人大拇指平均宽度为1英寸(2.5厘米),折算下来是72像素。

用户点击拇指大小的按钮时,是非常的轻松准确的,能带来良好的愉悦体验。




10、行走状态下,拇指点击准确率95%以上的最小尺寸


在行走状态下,单手拇指操作触击正确率均值达到95%的最小尺寸。

设计界面时,参考控件所在位置的触击尺寸要求,避免因尺寸小带来误操作,影响操作效率。



(部分资料是来自大神的博客,非个人原创,在此向大神致敬!)

评论
热度(71)
  1. GodIsDps小和 转载了此文字
  2. LvyueshanAminy小猴子 转载了此文字
  3. 灼灼其华小和 转载了此文字
  4. 灼灼其华小和 转载了此文字
  5. 二妹。小和 转载了此文字
  6. 小七小和 转载了此文字
  7. 咖咖の小城南小和 转载了此文字
    学习学习。。收藏 谢谢原作者~~~
  8. 智小萱小和 转载了此文字
  9. 球球余晨小和 转载了此文字
  10. 智小萱小和 转载了此文字
  11. 思杰小和 转载了此文字
  12. Micoo小和 转载了此文字
  13. 梦工厂小和 转载了此文字
  14. 开发手札小和 转载了此文字
  15. Aminy小猴子小和 转载了此文字
  16. 易拉罐小和 转载了此文字

© 智小萱 | Powered by LOFTER