K3.03.3hinge-safe content placement设计

铰链区域不应放置关键内容

别名: 铰链避让 · 折痕遮挡 · hinge exclusion

概念解释

内屏中间有一条物理铰链或光学折痕,像素在那里要么被缝挡住,要么亮度、触控和平面度都变差。关键内容不要放在铰链带上:主按钮、正在读的那一行、输入框、必须点中的图标,都要落在两侧完整的玻璃里。系统会给出铰链避让区,但应用仍可能把居中的对话框、全宽进度条或广告条画进这条带。尺寸跳变和状态保留是时间轴上的问题;这条是空间上的:展开之后,中间那条物理缝还在。

机制

铰链是一条沿短边或长边走的机械缝。折痕处的偏光、反射和微小凹陷让文字发虚、细线断开,触控采样在缝两侧也可能跳。人的注视会被这条不连续带吸走,居中对齐的标题看起来像被撕开。把命中目标放在缝上,点下去的接触可能落在缝的另一侧,或落在系统当成分割手势的区域。半折时铰链从「一条细缝」变成「一个近 90 度的拐角」,原先在缝上的控件会翻到侧面或底面,完全不可见也不可点。全屏视频和游戏有时故意让画面跨缝,那是内容可被缝切开、交互却仍落在两侧的折中;正文、表单和导航不能用这个折中。

边界

壁纸、全出血的照片、视频可以跨缝,前提是没有必须读的字幕或必须点的控件落在缝上——字幕应避开避让区。绘图应用的画布跨缝是合理的,工具栏和调色板仍应停在一侧。铰链很窄、几乎不可见的机型上,避让可以更薄,但仍不要把 44 点的按钮以中线为轴对半放。双屏中间是一条真正的缝(两块独立玻璃)时,约束比柔性折痕更硬:内容不能骑在物理缺口上。桌面把窗口拖过两块显示器的接缝,是类似的物理不连续,但用户可以挪窗口;折叠屏的缝在设备正中,窗口躲不开,只能躲内容。

怎么落地

  • 读取系统提供的铰链避让区,把主操作、输入框、导航栏和正在阅读的行排在避让区以外;居中弹层改为偏到一侧,或保证其按钮落在缝外。
  • 全宽的分割控件、滑块、步进器不要骑在中线上;必须全宽的进度指示,把可拖的拇指放到缝外。
  • 半折时把交互面收进仍朝向用户的那一屏,不要让主按钮留在变成底座的那一半。
  • 验证:展开内屏,把主按钮、当前阅读行和输入框画上半透明铰链带。任何需要读或点的东西与带子相交,就还没避开。半折后再点一次主路径,侧面上不该再留下可点目标。

延伸

  • 同组K3.03.1 展开与折叠是运行中的尺寸突变 · K3.03.2 切换需保留滚动位置与输入状态
  • 相邻K3.01 大屏双栏 · K3.05 分屏与多任务 · K2.02 多显示器
  • 站内检索hinge occlusion · fold crease · display cutout

同组卡片

快捷操作

分享

分享当前页面

ios_share

https://hci.top/zh/handbook/K3.03.3