如何突破手和虚拟对象的边界?Leap Motion的两位技术大拿来告诉你
在虚拟现实中,非常多的交互设计都脱离不开手。但在 VR 里,当你伸手去抓一个虚拟物体或者是 表面的时候, 现实世界中往往是没有什么东西能阻拦你的手的。为了使 VR中手与物体间的物理交互更加自然、更有说服力, 我们必须对虚拟物体的反应进行一些基本假设。Leap Motion 的交互引擎通过让虚拟手穿透该对象/曲面来处理这些场景, 这也造成了视觉裁剪。
本文来自Leap Motion 首席 VR 交互工程师 Barrett Fox和首席VR 设计师Martin Schubert,他们将从实践操作层面为我们讲述手和虚拟对象间的边界问题。
通过最近的交互设计实验, 我们研究了开发者 和用户经常遇到的交互问题, 并预设了些特定 的设计场景。在尝试了可能的解决方案之后, 我们希望分享下成果, 帮助开发者解决项目中 的类似难题。
我们自问, 如何通过视觉反馈,使得穿透虚拟表 面显得更加符合逻辑, 并且具有更强的实感?
为了回答这个问题, 我们尝试了三种方法 -- 在穿越网格情况下对交界与深度进行高亮提示,接近 交互式对象和 UI 元素时对指尖添加颜色渐变效果,以及对不可预知的抓取进行响应式提示。但 首先我们先看下, Leap Motion 的交互引擎如何处理手与对象间的交互的。
Leap Motion交互引擎中手与对象间的交互
在上面我们提到,当你的手简单穿过一个虚拟对象时,会产生视觉裁剪。在虚拟世界中,无论是 触摸静止的表面(例如墙壁),还是触摸一些可交互的物体,这种类型的视觉裁剪都会发生。 Leap Motion 交互引擎中的两大核心功能—轻碰和抓取,几乎都会出现用户手穿透了交互对象的 情况。
类似地, 当与基于物理的用户界面交互时 (例如 Leap Motion 交互引擎的 InteractionButtons, 它在 Z 空间中降低) , 因为 UI 的元素到达了其旅行距离的末尾,指尖仍然会有一点点穿过交互对象。
现在, 让我们看看如何使这些交界更加的有趣和直观!
实验#1:在穿越网格情况下对交界与深度进行高亮提示
在我们的第一个实验中, 我们提出, 当手与其他网格相交时, 交界应该是可视的。手被遮挡的浅层 部分仍然可见, 但手的颜色或者透明度会改变。 为了实现这一点, 我们对手部网格应用了着色器。我们会测量手上的每个像素离摄像机的距离, 并将其 与场景深度(从深度纹理到照相机的读数)进行比较。如果两个值是相对接近的, 我们就使像素发光, 并在更接近时增加发光强度。
这种方案总体来看效果不错。当发光强度和深度被降低到最低水平时, 它似乎是一种可以在应用 程序中普遍应用而不会显得特别扎眼的效果。
实验#2:接近交互式对象和 UI 元素时,对指尖添加颜色渐变效果
在第二个实验中, 我们决定让指尖改变颜色,来和要交互的对象表面颜色匹配。 当手越接近触摸 对象的时候,两者的颜色也越接近。这将帮助用户更容易的判断指尖和对象表面间的距离, 同时 降低指尖穿透表面的可能性。另外, 就算指尖确实穿透了网格, 那么其造成的视觉裁剪也不会显得 那么突兀--因为指尖和对象表面将是相同的颜色。 使用 Leap Motion 交互引擎的 OnHover 功能, 每当手悬停在一个 InteractionObject 上时,我们检 查从每个指尖到该对象的表面的距离。然后, 我们借助这个数据来驱动一个渐变变化, 它可以独立 影响每个指尖的颜色。
使用一个纹理来覆盖食指,和一个由指尖的距离驱动的浮动变量,在 ShaderForge插件的漫反射和自发光通道添加辉光效果作为渐变。
这个实验确实帮助我们更准确地判断我们的指尖和对象表面之间的距离。此外, 它使我们更容易知道我 们最接近的接触对象。将其与实验 #1 的效果相结合, 使交互的各个阶段 (靠近、接触、相交、抓握) 更 加清晰。
实验#3:对不可预知的抓取进行响应式提示
如何在 VR 中抓取虚拟对象?你可能会抓成拳头, 或捏它, 或扣紧这个对象。之前, 我们已经尝试设 计一些提示—例如:把手--希望借助这些指导用户如何抓取物体。
在我们之前创作的程序 “ 失重:训练室( Weightless: Training Room ) ”: 我们在导弹上设计了凹 槽,可以从 视觉上帮助用户更加符合逻辑的抓住物体 ,同样也使得用户更容易在抛出时可靠地释 放对象 尽管这帮助大部分用户重新发现如何在 VR 中使用他们的手, 有些用户仍然会忽略这些提示,将他 们的手指穿过网格。因此, 我们想--如果我们不做静态提示, 而是在用户以非常规方式抓住对象 时,创建一个响应式提示?
通过在每个手指关节上建一个射线投射(Raycast),并检查它在 InteractionObject 上的投射位置, 我 们在射线投射的命中点建一个浅窝网格。我们将浅窝与命中点法线对齐, 并使用 Raycast 的命中距离-主要是手指在物体内部的深度--来驱动 Blendshape, 从而扩展这个浅窝。
每根手指的三个射线投射 ( 大拇指是两个射线投射 ) 来检查在球形碰撞器( the sphere’s collider )上的 命中点
通过将浅窝网格移动到命中点位置 , 并将其旋转以使其与命中点正常对齐 , 浅窝可以正确跟随手指,无 论它与球体在何处相交
我们也尝试过添加指尖颜色渐变。不过这一次, 渐变不是由接近对象的距离远近来驱动, 而由手指 伸入对象内的深度来驱动。
从这个概念,我们进一步发散, 要不要在你的手触及物体表面之前,物体就可以预知你手的靠 近,并且有所反映? 基本上, 我们希望创建一个虚拟的 ACME 孔。
为了做到这一点, 我们增加了指尖射线投射的长度, 以便在你的手指接触到表面之前, 命中会被登 记好。然后, 我们产生了一个由 (1) 圆孔网格和 (2) 一个带有深度掩模的圆筒网格组成的两部分预 制体, 它将停止渲染它后面的任何像素。 通过设置层, 使深度掩码不会渲染 InteractionObject 的网格, 而是渲染用户的手部网格, 我们制造 了一个错觉,在 InteractionObject 中有了一个可移动的 ACME 孔。
这些影响使抓取对象感觉更加连贯, 好像我们的手指被邀请去穿越网格。显然, 这种方法需要一个 更复杂的系统来处理非球体以外的物体--对于手掌的部分, 以及当手指并拢时。尽管如此, 响应式 提示仍然是解决不可预知抓取问题的方案之一。 VR 中围绕手的设计是一个充满了多种可能的空间--从真正的 3D 用户界面,到虚拟对象操作,再 到运动等等。作为创造者, 我们都有机会将熟悉的物理隐喻与数字世界提供的无限潜力结合起 来。下一次, 我们将真正弯曲物理定律, 神奇地召唤在远处的物体!