实验设计 · 交互设计
通过实验，得到当今大屏手机时代下的屏幕触摸热区，并以此指导手机UI设计中按钮的位置、大小等设计，帮助人们更精准快捷高效地使用手机中的各种功能，提高手机的易操作性、易用性。
作为设计部发起的第一个HCI领域的设计研究项目，在短时间内收获成果并形成影响力，在可落地范围指导所有业务的设计，并为未来更多的设计研究项目奠定了基础。
用户研究
实验设计
数据分析
用户体验设计
UX Designer 2
User Researcher 1
乔布斯曾说，3.5英寸的屏幕，对于消费者来说是最完美的尺寸，更大的屏幕是愚蠢的。
然而，乔布斯仅活到了3.5英寸手机的时代，从2012年开始，手机的屏幕在不断地扩大。
而小米近年的热销款也都在6.8寸左右。
那么在如此大屏的时代下，手机的屏幕触摸热区图是怎样的?
UI设计又应该遵循怎样的指导来让手机更具操控性？
🤔️ 项目挑战：
此项目为小米设计部方第一次开展设计研究项目，上级期望能够在短时间内收获成功并形成影响力，因而对项目整体的组织力、把控力、预判力要求较高。
成本有限的情况下，要求在可接受的数据误差下，整体逻辑和指导结果仍有可信度、指导性。
是加入小米后的第一个个人负责项目，在初入公司下需与多方部门合作，尽可能利用好可触达的所有人脉资源。
触摸热区已经是老生常谈的课题，在得出数据后仍希望能够有新的思考，和切实可行的指导意见。
定义研究目标
基于大屏的新时代特征，获取最新的大屏手机触摸热区数据；
对数据进行相比以往更深入的分析，更灵活地运用，为产品&设计师提供新视角新思路。
详细拆解为：
可供日常设计师使用的屏幕触摸热区分布图；
对小米的业务设计师有用的设计指导&建议；
一套可以复用的在其他机型下（折叠屏/pad等）也可执行的实验&分析方法；
前期调研
刚刚提到的乔布斯所说的“Perfect Size”，其实是站在单手操作角度考虑的完美尺寸。
经苹果调研，当手机尺寸为3.5英寸时，单手大拇指可以碰触到屏幕至少90%以上的区域。
在阅读Steven Hoober，「Design for Fingers, Touch, and People」时发现，人们在使用手机时存在单手或双手操作两种情景，且存在多样的持握姿式。
但经观察，75%的用户触摸屏幕时，只使用一个大拇指；低于50%的用户，握持手机只使用一只手。
若聚焦单手大拇指的操作场景下，可发现两种主流持握姿式：
小拇指在手机背后托举
小拇指在手机下方托举
经观察，两者不存在显著的概率和占比，会由男女、手的大小、坐立姿势等因素影响而变化。
研究范围：
由于时间及成本有限，与上级汇报后，定义出以下研究范围：
热销机型的屏幕尺寸：小米11，6.8寸
单手持握，两种握持方式
大拇指点击操作
坐立静止状态
实验设计：
由于我们要测试整个手机的触摸热区，因而我们参照苹果的最理想的物理热区大小：9mm*9mm，把屏幕分成了8*18共计144个区域。
实验主要内容如视频，可拆解为，
长按初始蓝色方块
出现移动的红色方块
当长按时长满1.5秒后，红色方块变为绿色
此时用户需点击绿色方块
为了更好地测试和区分用户单手操作时的舒适、不舒适区，我们要求用户不可改变握持姿势，用户若无法点击可放弃点击。
为了排除对位置的预测和上一次手点击的位置的影响，每次点击前都将长按初始格子以触发下一次操作。
由此，我们将可以得出每个格子的以下数据：
命中率（未放弃点击且点击成功数 / 总测试数）
点击放弃率（放弃点击数 / 总测试数）
误操作率（未放弃点击但失败数 / 未放弃点击数）
点击时长（从红色方块变为绿色方块到用户点击的时长）
点击偏移方向（屏幕识别的点击位置 到 格子的中心点的连线）
点击偏移距离（屏幕识别的点击位置 到 格子的中心点的距离）
更详细的实验规则及路径如下：
我们将收集用户的基础性别、手长&宽，以及日常手机持握手的信息；
由于不清楚左右手撇子或其他习惯的差异，我们会要求用户左右手均测；
为了让所有的初始位置符合用户的舒适位置，我们将让用户在开始前选择一个舒适区域作为长按的初始蓝色格子。
我们为用户提供了练习模式，详细阐述规则，并给予10次尝试机会，以保证正式实验的顺利。
实验对象及人数如下：
两种单手持握姿式各20人
参考国际成年人手部尺寸分型，选取男女各占比50%的手的尺寸，符合要求的男女各占20人
数据整理&可视化
经过预实验及正式实验后，我们将收集来的数据进行了可视化：
*左图为左手，右图为右手
详细解释如下：
如图我们大致可以推断出，最终的屏幕触摸热区将分为，不可触区，可触区，易触区三个区域。
总结&应用：
优化策略大致可分为两种：
将静态图覆盖至静态图中调整
如：
结合业务数据或操作路径分析：
如：
由此可知：日活50万的用户中，大约70%的用户，仅编辑事件标题后就完成
纵观整个操作流程中可以发现，无论左/右手持握的，都无法依靠一只手完成任务
还原手的移动，即时是两只手，操作体验也并不流畅，手需要来回调整位置。
优化方案：
自动跳转到事件标题的输入栏，保证用户在点击下方悬浮球后可以直接在下方开始输入。
下移了取消和完成按钮，让用户可以在输入完成后直接点击。
用户整体的操作路径缩短了大约40%。
还有很多其他的案例，其中影响最大的落地优化为「顶tab改为底tab」，这一改动也在今年MIUI15中上线。
此次成果面向设计、产品、用研分享，受到了大量好评。
作为设计发起的第一个研究项目，也奠定了未来开展折叠屏触摸热区项目、滑动手势热区项目、眼动热区项目的基础。
Sherry's Portfolio