K2.06.3dual hover design across form factors设计
同一产品跨形态时需准备两套方案
别名: 双方案 · 跨形态悬停 · dual design
概念解释
同一产品既要在键鼠桌面上用,又要在触屏上用,不能共用一套「指针进入才出现」的交互。两套方案指:桌面方案可以动用悬停带来的空隙,触屏方案用常驻、点按或显式按钮承担同一职责。切换按实际输入形态,不按「我们希望只有一套设计系统」。
两套不是视觉换肤。是触发器和信息出现时机各写各的,再汇到同一条任务上。
机制
跨形态产品面对的是两份输入词汇,不是两份画板。桌面方案把次要操作放进到达事件,界面可以先画得稀;触屏方案没有到达事件可调度,同一职责必须挂到按下、长按或一开始就可见的控件上。若只维护一份结构,不是桌面被削掉预览,就是触屏缺入口。产品层的答案是承认两份结构,在运行时选择,而不是把其中一份硬译成另一份。
选择的依据是「此刻有没有指针悬停这回事」,不是窗口有多宽。二合一设备可以在很宽的窗口上用手指,窄窗口上用鼠标;按断点切方案会切错。两套方案要在任务结果上等价:桌面上悬停预览再点,触屏上点开详情再确认,最后写入的是同一条记录。不等价的两套是两个产品,不是跨形态。
边界
只发单一形态的产品不必做两套,做了反而是维护负担。触屏方案里用长按去顶替悬停,会和该形态里长按已有的语义打架,需要另找出口。浏览器里「细指针 / 粗指针」媒体查询能区分一部分设备,但插上了鼠标的平板、合上了键盘的笔记本仍会报错,方案切换要能在输入方式改变时重选,而不是启动时决定一次。游戏手柄、远场遥控器是第三套输入词汇,不能塞进「桌面 / 触屏」这一对里凑合。
怎么落地
- 为每条用到悬停的职责列一张对照表:桌面用进入事件,触屏用哪一个常驻或点按入口。两行必须通向同一结果。
- 按指针能力切换,不按视口宽度切换。指针出现或消失时重选方案,不要等下一次启动。
- 验证:同一账号、同一任务,在键鼠桌面和纯触屏平板上各做一遍。桌面应能先看后定;触屏应能不靠悬停完成。关掉鼠标再插上,界面应在当次会话里改走对应方案,而不是卡住一套。
延伸
- 同组:K2.06.1 悬停允许无承诺的预览与提示 · K2.06.2 依赖悬停的设计无法迁移到触屏 · K2.06.4 悬停可用于渐进呈现次要信息,避免界面一开始就显得拥挤 · K2.06.5 悬停触发的时间阈值需要过滤路过式的鼠标移动 · K2.06.6 纯悬停触发的功能天然不可被键盘或屏幕阅读器发现 · K2.06.7 悬停态提供的信息若不可或缺,说明界面本身缺少必要的常驻线索
- 相邻:K2.07 触摸与键鼠并存 · K8.07 一致性与平台惯例的冲突
- 站内检索:
dual design·form factor specific interaction·hover and touch schemes