全面屏人机交互更新

全面屏时代,手机形态有了不小的变化,主要的变化是屏幕上下边框的收窄,次要变化是多形态手机正面屏幕的出现(例如刘海、水滴、升降、挖孔、未来还可能有屏下摄像头),因此交互上需要有些小调整。这个系列属于想到什么写什么。

  首先可以先看下非全面屏与全面屏手机的对比,这里以魅族 15和OPPO Reno为例。
  魅族 15(左) OPPO Reno(右)
  全面屏往往会因为内部元件排布与手机美观程度的原因,将机身拉长,最长预计会停留在21:9这么一个长度。可以看到,对于同样大小的手掌来说,全面屏手机大拇指的活动范围更受局限,这带来两个问题:

  1. 拇指更不容易够到顶部,不仅是斜对角难以碰触,同边的上方也难以精确点击。
  2. 在底部空间操作进行细微操作时,手机重心可能离开手掌,增加手机坠落风险。

  三星的 OneUI 在第一点问题上是提出了一个全局性的解决方案的,即将操作部分移动至下半屏,上半屏仅展示用。只是,对于上半屏,三星仅用了大字号占用上半屏,全面屏带来的更多视野反而被压缩了。
  我的修改意见是,对于难以描述的功能页面,需要附加图形或动画描述的,增加了统一的描述图形并控制高度,由此将操作按钮等下移,下移至适合拇指操作的区域。同时在底部对页面功能进行说明,由此留出底部空间,避免手指移动过下。
  调整至此,又出现了什么问题呢?做出原型后发现,对于一些比较拗口的功能,且功能项较长,将说明放置在页面底部,用户新进入页面的时候容易忽视功能说明而进行误操作。解决这个问题的方式一方面对页面逻辑做好容错操作,一方面对于实在重要的功能,在图形描述区下增加文字描述,仅对容易理解的功能或对功能无关紧要的描述,可以将描述放置在页面下方。

作者

徐炜楠

发布于

2019-06-01

更新于

2021-06-12

许可协议