空间输入设计
原文
♪ 悦耳的器乐嘻哈 ♪
Israel Pastrana Vicente:大家好,欢迎来到“空间输入设计”,我是Israel。今天和我一起的还有Eugene,我们是Apple Design团队的设计师。
Eugene Krivoruchko:今天我们将介绍面向眼睛与手的交互设计,解析这些新输入方式的特别之处,以及如何在我们的平台上充分利用它们。
Israel:首先,让我们了解一下所有可用的输入模式。使用空间输入,你只需注视某个按钮,同时轻点手指来选中它,这样你的手臂可以放松地放在腿上。我们的系统旨在让使用者与UI进行舒适的远距离交互。在某些情况下,你还可以直接与元素进行交互,例如使用指尖在虚拟键盘上打字。将手举在空中可能导致疲劳,但我们发现有些任务更适合进行直接交互。眼睛和手是新的空间输入方式,但你也可以使用其他熟悉的输入方式,例如无需打字即可进行语音搜索,或者键盘和触控板。这些都是完成工作的好帮手。最后,你还可以连接一个游戏控制器来玩你喜爱的游戏。
接下来,我们将重点介绍最新的也是最激动人心的空间输入方式:使用眼睛和手。这种输入方式私人且舒适,你可以将双手放在身旁,因为设备可以看到你周围的广阔空间。同时,这种输入方式使空间交互更加精确。设备对所有数据进行过滤,并将其转化为开发者可以在App中使用的准确交互指令。
Eugene:我们首先从眼睛开始。眼睛是空间体验的主要瞄准机制。系统中的所有界面都会对你的视线做出反应。而且,我们只需注视任何一项元素即可轻松锁定目标,无论距离多远。接下来,我将介绍如何打造能够进行舒适交互的App;如何让这些App便于用眼睛瞄准;以及如何制作能够对你的视线做出反应的界面,同时尊重隐私;最后,视线意图如何简化我们的布局,并提供独特的辅助选项。
要打造适合眼睛交互的App,我们需要考虑如何在设备中显示你的内容。首先要考虑的是,尽管你的App拥有无限大小的画布,但你只能看到视场内的内容。在视场范围内,看中央最舒适,看边缘则不太舒适。因此,在设计App时,应使其置于视场范围内,减少颈部和身体的移动。尽量将App的主要内容放在视场中央,这是你眼睛最舒适的区域。看向视场的边缘可能会使眼睛疲劳,因此请将这些区域用来放置并非始终需要呈现的内容,如次级操作。这些操作仍可访问,且不会干扰主要内容。
请你始终将App内容放置在视场范围内,以最大限度地提高眼睛和颈部的舒适度。接下来,我们还应该考虑深度对眼睛舒适度的影响。深度是空间体验的一种独特特征。通过将你的内容放在近处或远处,你的项目可以提供多样化的体验。但是,我们的眼睛每次只能聚焦于一个距离,频繁改变聚焦深度可能会造成眼睛疲劳。请尽可能保持交互内容的深度一致,这样可以在切换UI时感觉自然轻松。例如,你可以呈现一个模型的视图,沿Z轴推动主视图,而模型保持在原来的距离上。通过保持Z轴位置不变,你的眼睛无需适应新的距离。
你可以使用深度的微妙变化来传达层次结构,比如这里的左侧标签栏和底部的分段控件。这样,你可以充分利用深度,同时避免眼睛不适。既然我们已经了解了如何让App更舒适,那么我们还需要让它更易于眼睛使用。眼睛是非常精确的,但有一些特质可以帮助我们的眼睛成功瞄准UI元素。我们的眼睛会自然聚焦在某些形状上,从而将我们的注意力引导到物体的中心。为了辅助我们的眼睛,请使用圆润的形状,如圆形、药丸形和圆角矩形。请避免使用边缘尖锐的形状。当你使用尖锐的边缘时,眼睛往往会聚焦于外侧,从而降低眼睛的精确度。此外,请保持形状扁平,避免使用粗边轮廓以及会将注意力引向边缘的效果。
最后,请确保使用充足的内边距,来将你元素中的文字和符号居中。因此,在设计UI时,请始终确保其能将引导到元素的中心。现在我们的注意力已经在元素的中心了,让我们来看看控件的正确尺寸是什么。支持眼睛瞄准的元素区域所需的最小尺寸为60点,但是元素本身可以小于60点。你可以结合尺寸和间距,来实现最小瞄准区域。在布局中,元素之间的间距应大一些,这样可以帮你用眼睛快速而准确地锁定目标。再次强调,遵守60点的最小瞄准区域非常重要。将尺寸和间距相结合,可以让你的UI看起来很棒,并且易于用眼睛使用。
开箱即用的标准组件具有易于瞄准的尺寸,所以请尽量多使用这些组件。如果你使用自己的组件,请确保遵循我们的尺寸指南。要进一步了解关于点和布局的信息,请查看“设计空间用户界面”讲座。
既然我们已经了解了瞄准区域对眼睛的重要性,我们就必须确保在空间的任何位置都能保持这个瞄准区域。为此,我们需要了解如何缩放UI。让我们来看看两种不同的缩放机制。系统为App窗口提供动态缩放,你可以看到窗口在向远处移动时会变大,向近处移动时会变小。动态缩放会使UI填充相同的视场,并保持瞄准区域的大小,而不受窗口位置影响。如果使用固定缩放,UI会随着向远处移动而变小。固定缩放会改变界面大小,使你的App难以用眼睛进行交互。让我们将这两种模式并排来看一下。动态缩放可使UI和瞄准区域保持相同大小,而固定缩放则会改变尺寸并使瞄准区域过小。当你创建自定义UI时,请使用动态缩放,以确保你的眼睛能够始终瞄准所有控件。
除了缩放,方向也会影响App的可用性。如果界面带有一定角度,就会难以阅读和使用。这就是为什么系统窗口总是朝向使用者。但是如果你在App中创建自定义窗口,请务必确保你的UI朝向使用者。正如我们刚才所看到的,窗口和UI的正确比例和方向是保证眼睛交互准确性的基础。要进一步了解关于该平台上窗口的行为方式,请查看“空间设计原理”讲座。
眼睛是一种非常新颖的输入方式,因此让你的界面对眼睛做出反应是非常重要的。当交互元素突出显示时,你就知道你的眼睛正在引导着交互。让我们看看当你注视一组按钮时会发生什么。可以看到,当你注视每一个按钮时,这些按钮都会突出显示。所有的交互元素都应该突出显示,我们可以通过悬停效果来实现这一点。但是,由于眼睛的移动速度很快,因此这种效果不能过于明显,并且要能在任何内容上实现。比如在查看你喜爱的照片时,可以强化视线意图,但不会过于突出。多亏了悬停效果,所有系统提供的控件都会在你注视它们时突出显示。如果你为自己的App创建自定义元素,可以使用悬停效果来增加视线反馈,让你的元素更具响应性。视线意图是非常敏感的信息,在处理眼睛的数据时,隐私具有最高优先级。悬停效果发生在App的进程之外,因此只有当手势触发某个元素上的交互时,你才会知道聚焦到了哪个元素。
用眼睛悬停在某个元素上是一种意图的信号。如果你长时间注视某个元素,我们就会知道你对该元素感兴趣。这是一个展示更多相关信息的绝佳机会。例如,按钮可以在你注视时显示工具提示。此外,当你聚焦在标签栏时,它们就会展开,显示每个标签页的标签。最后,当你聚焦在系统搜索框内的麦克风图标时,将触发Speak to Search,该界面将出现,并允许你仅通过眼睛和语音进行搜索。所有这些系统元素都能在你需要时提供额外信息,同时在未聚焦时保持UI简洁。你可以在打造App时充分利用它们。我们在构建这些系统元素时,还考虑到了隐私问题,以确保不会向App发送视线聚焦信息。
视线意图还为辅助技术提供了绝佳的机会。例如,使用停留控制功能,你可以仅用眼睛选择内容。在本例中,当你短时间聚焦在一个按钮上时,停留控制UI就会出现,你无需用手做出轻点手势即可选中按钮。那么,我们刚刚学习了哪些为眼睛设计交互的知识呢?我们了解了如何让App更适宜于眼睛,我们可以将内容放在观看者正前方的视场范围内,并且合理使用深度。然后,我们学习了如何设计易于使用的界面,以及如何将你的视线引导到元素的中心。我们还强调了在控件中保证60点最小瞄准区域的重要性,以及我们应该始终传达互动性,并通过在元素中添加悬停效果来更好地瞄准目标。最后是利用UI元素来展示关于视线意图的额外信息。
这些功能真的很棒,而且还有更多可以探索的内容。我们已经认识到眼睛是一种出色的定位机制。当你将其与双手相结合时,眼睛的作用会变得更加强大。接下来让Eugene来为我们介绍。
Eugene:谢谢Israel。让我们来谈谈双手的作用。与视线瞄准相结合,手势是整个系统的主要交互方式。将手指捏在一起就相当于点击手机屏幕。系统还支持其他我们熟悉的手势,例如你可以捏合手指并拖动来滚动屏幕,还可以使用双手做出缩放和旋转等手势。请注意,在所有这些情况下,UI的反馈都与手部动作保持一致。这的确可以让人感受到这些反馈和手势之间的联系。这些手势在整个系统中以相同的方式发挥作用,并遵循与多点触控手势类似的逻辑。这意味着用户可以真正专注于体验,而不必考虑如何进行交互。这就是为什么你在设计体验时,应该借鉴这些熟悉的模式,并确保使用符合用户期望的方式来响应手势。
在某些情况下,你的体验中可能会存在独特的行为,而这种行为不容易用标准手势来表达。在这种情况下,你可能想定义一个自定义手势。以下这些建议可以帮助你成功构建自定义手势:首先,要确保手势易于解释和执行,以便用户能够快速学会如何使用。避免手势冲突也很重要,你的自定义手势必须与标准系统手势集或人们在对话中可能使用的常见手部动作有明显不同。这样的手势必须是人们能够持续重复而不会感到紧张或疲劳,并且不易错误激活的手势。你还需要考虑到使用辅助技术与系统进行交互的用户,并考虑在这些情况下你的手势将如何发挥作用。要进一步了解关于辅助功能的信息,请查看“创建无障碍的空间体验”讲座。手势对不同的人也可能有不同的含义,因此请确保你的自定义手势不会传达你本无意传达的信息。
考量所有这些因素可能需要找到一个微妙的平衡点,因此采用UI形式值得作为一种后备方案纳入考虑。我们的输入模式中最令人兴奋的方面之一就是可以将眼睛作为一种意图信号,将视线的方向与手势相结合。我们可以创建精确而令人满意的交互,这在其他平台上是不可能实现的。让我们再通过缩放手势来了解这一点。在手势开始时,缩放的原点由你的眼睛当时在图像中所聚焦的位置决定。这样,该特定区域在进行缩放时会放大并居中。因此,你只需看向四周,并做出这个简单的手势,即可轻松浏览图像。这让人感觉非常神奇,同时又完全在意料之中。你所注视的点自然地表明了这项交互的意图。这种行为的另一个例子是标记操作中的指针移动。绘制时,你可以用手控制画笔光标,这与鼠标指针类似。但如果你看向画布的另一侧并轻点一下,光标就会跳到你所注视的位置。这将带来一种精确的操纵感,并有助于在整个画布上快速移动。
这些交互实例展示了视线指向的应用能让简单的行为更加精确、更令人满意。眼睛不仅用于瞄准元素,而且还间接地为该交互提供了更细化的定位。这是我们输入模式非常强大的一点,让我们能够以更加智能的方式对交互做出响应。现在我们来谈谈直接触控。我们的整个系统都支持用户直接伸出手用指尖进行交互。例如,你可以让Safari浏览器靠近你,并直接滚动页面。你还可以使用双手在虚拟键盘上打字,甚至还可以在伸手可及的范围内操作3D内容,以获得更多空间体验。
远距离交互可以长时间保持舒适,因为眼睛可以轻松瞄准控件,并且双手可以在执行最小手势时保持休息。在设计直接交互时,我们需要记住,用户把手举在空中一段时间后会导致疲劳。尽管如此,对某些App来说,将内容置于手臂可及的范围内进行直接触控仍然是有好处的,例如需要近距离观察或操纵物体的体验;或任何建立在生活中以肌肉记忆为基础的交互机制;通常来说,就是体验的核心与实际动作相关。缺乏触觉反应是设计直接交互时需要考虑的另一个问题。每当我们触摸物理世界中的某样东西时,我们的双手都会接收到大量的多感官反馈,这对我们的感知至关重要。但当我们伸手触摸虚拟内容时,这些反馈都不会发生。
为了实现这种交互,我们需要用其他类型的反馈来弥补缺失的感官信息。让我们来看看在键盘按钮上我们是如何应对这个挑战的。按键的高度实际上高于盘面,来引导用户直接按下。当手指位于键盘上方时,按钮会显示悬浮状态,并且高亮,也会随着手指接近按钮表面而变亮。这样的状态可以提示手指正在接近,有助于引导手指定位。在接触的瞬间,状态会迅速变化且快速回应,并伴随有相应的空间声效。这些额外的界面反馈对于弥补触觉信息的缺失以及确保可靠且令人满意的直接交互体验来说至关重要。音频在连接整个系统的输入和虚拟内容方面发挥着特殊作用。要进一步了解相关信息,请查看“探索沉浸式声音设计”的讲座。
让我们来总结一下设计手势交互的要点。请使用与系统一致的手势语言,以便用户能够专注于内容而非交互本身。请注意,只有在使用标准手势集无法实现预期行为时,才需引入自定义手势。利用视线作为意图信号,尝试改善交互。只有在关乎体验的核心时,才使用直接交互。如果你采用这一方法,请提供丰富的反馈,以弥补缺失的感官信息。
今天,我们讨论了用眼睛和手进行空间交互的一些设计原则。我们讨论了很多关于舒适性和人体工程学的问题。在这个平台上,有多种多样的软件外观、行为和对输入的反应方式。因此设计师和开发人员更有责任确保这些体验是舒适且无障碍的。通过在设备上运行你的App,用户将你的作品带入其空间并给予充分关注。软件不再存在于在某个屏幕中,而是可以在用户的物理环境中占据更重要的位置,并对他们的自然肢体动作做出反应。用手与虚拟内容进行交互对大多数人来说也是很新奇的体验,所以通过提供清晰的反馈来进行引导,并尽可能使用熟悉的交互模式至关重要。我们从其他平台的设计中可以知道,优秀的输入体验不需要让使用者特意思考。软件响应成为你身体动作的自然延续,并与交亚interaction意图完美匹配。我们的平台可以使用眼睛作为输入模式的基础,可以用魔法般的精确度对互动进行响应。这真的非常强大。我们希望开发者能加以利用,为空间媒介创造出令人愉悦的新颖互动。请务必查看我们在讲解中提到的讲座。感谢你的观看!
Israel:再见!
核心设计要点
多模式输入整合
- 系统支持:包括眼睛和手的交互,语音输入,传统键盘和触控板,以及游戏控制器。
- 灵活适应:根据不同使用场景和用户需求,选择最适合的输入方式。
眼动追踪和视线为基础的交互
- 精确瞄准:利用眼睛作为自然而精确的定位工具,增强用户界面的直观性和交互响应。
- 视线反应:界面应对用户的视线反应灵敏,以提供无缝的交互体验。
优化视觉舒适度
- 内容位置:将主要内容放置于视野中心,减少眼睛和颈部的不必要移动。
- 深度考虑:避免频繁变换视觉焦点深度,以减少视觉疲劳。
界面设计的人体工程学
- 形状设计:优先使用圆润和扁平的形状,避免尖锐边缘,以提高瞄准的精确性和视觉舒适性。
- 大小与间距:确保交互元素具备足够的尺寸和适当的间距,使其易于通过眼睛快速准确定位。
动态与固定缩放
- 动态缩放:保持界面元素在视觉上的一致性,无论用户与屏幕的距离如何变化。
- 固定缩放:可能导致元素在远处过小,难以交互和观看。
界面方向和比例的正确性
- 界面朝向:所有界面元素应直面用户,确保最佳的阅读和交互效果。
- 正确比例:维持一致的界面比例,以确保视觉和功能上的可用性。
注意事项
隐私和敏感度
- 数据处理:确保眼动追踪和视线数据的处理方式透明、安全。
- 用户隐私:高度重视并保护用户的隐私信息。
辅助技术和无障碍性
- 无障碍设计:设计时须考虑辅助技术的兼容性,使所有用户均可有效使用。
- 设计普遍性:确保新交互方式不仅为健康用户设计,也能适应身体障碍者的需要。
自定义手势的开发
- 易于学习与执行:自定义手势需要简单直观,易于用户学习和记忆。
- 避免手势冲突:确保自定义手势与系统手势和常用手部动作明显不同,避免误操作和用户疲劳。
反馈的重要性
- 多感官反馈:在缺少物理触觉的直接交互中,通过视觉和听觉反馈弥补感官信息的不足。
- 交互满意度:确保提供的反馈能够即时准确地反映用户的操作,增强交互的直观性和满意度。
信息来源
内容由MiX Copilot基于大语言模型生成,有可能存在错误的风险。