随着主流VR / AR输入继续发展——从早期的gaze-only wand-style输入控制器和周密的手跟踪,所以也与我们互动虚拟用户界面。慢慢地我们超越从2D屏幕移植的平坦UI以及未来充满利用深度和体积的空间接口范例。

上周,巴雷特福克斯描述他的过程中推动新图形渲染器和交互引擎的悬停限制通过创建一个回调函数可调输入参数成吨的动态雕塑.今天,我将详细介绍空间UI用于控制雕塑的各个方面(或任何复杂内容)的几种方法,方法是创建一组好玩的、类似于物理的用户界面。

从平板显示器到虚拟现实界面

我们超越平ui从2 d屏幕上对未来新空间界面范例。点击鸣叫当某人第一次戴上一个支持跳跃运动的VR耳机时,188bet让球他们似乎经常在重新发现如何使用自己的双手。从某种意义上说,他们是。当我们把手伸进一个虚拟的空间,我们也带来了一辈子的身体偏见。令人信服的空间界面补充和建立在这些期望之上。

和我们一起交互引擎统一包,原型化这些类型的受物理启发的接口比以前更容易。模块特性一系列通用2DUI组件的预制件,制作3D和物理相似。按钮,抑制在Z空间然后春天回到他们的休息位置。滑块,可以激活的指尖轻敲侧面。甚至以手工为基础的例子,可穿戴的ui和动态部署的ui。

概念:一个玩具,不是控制板

在设计接口时,最高优先级之一通常是效率。在这个探索中,然而,任务完成速度进一步下降。在创建这些UI时,我想关注的核心问题是:

  • 创造一种身体上的感觉
  • 通过反应性/反馈在3D中传递手到UI元素的接近度
  • 使界面交互感觉好玩
一个概念性的情绪板接口既简单又复杂,以身体和游戏为重点。我们还探索了关于形式的思想,给养,和使用颜色的口音。

一个概念性的情绪板接口既简单又复杂,以身体和游戏为重点。我们还探索了关于形式的思想,给养,和使用颜色的口音。

#VR设计前提示:人类以曲线运动。您的界面也应该是曲线的!!点击鸣叫因为这个项目是设计运行在移动虚拟现实耳机,我们设计知道可能只有3自由度(3DoF)的头部跟踪经验。这意味着用户将坐下,所有UI都需要在手臂可及的范围内。

为人类的武器,设计虚拟交互手,手指意味着深入肩膀的运动范围,肘部,手腕。开始阻塞UI元素的布局,我鸽子重力速写.对每个关节使用不同的颜色,我标记出舒适的运动范围移动我的手臂,旋转在我的肩膀,肘部,双臂伸展的手腕,然后用胳膊肘撑着两边。

利用重力素描马克舒适的运动范围,在我的肩膀上转动,肘部,手腕。

利用重力素描马克舒适的运动范围,在我的肩膀上转动,肘部,手腕。

基于上述范围阻塞UI区域。

这个约束——用UI包围坐着的用户——也意味着我能够测试另一个新的实用程序,,曲线空间.通过组合图形渲染器和交互引擎可以解锁的特性,弯曲的空间允许整个用户界面被轻微地弯曲成围绕用户的符合人体工程学的曲线,同时一切仍然如您所期望的那样工作。

这个演示中的几乎所有UI组件都是用图形渲染器渲染的,通过使用LeapCur.Space组件,可以方便地将它们包装在用户周围。

一旦我们确定了总体设计目标和布局方案,现在是设计用户界面本身的时候了。

与交互引擎建立一个按钮

自2007年iPhone介绍多点触控输入,我们已经看到2 d触摸屏交互设计演变成一个响应,充满动作的语言。现代应用对任何视觉输入做出响应,音频,,有时甚至是微妙的触觉反馈。轻击和轻击会遇到动画波纹和动态元素调整大小。

没有动态反馈,#VR交互可能感到不满意和奇怪。点击鸣叫在虚拟现实中,每个交互对象都应该对任何随意的运动做出响应。用户并不总是知道应该期待什么,动态反馈有助于建立虚拟世界如何工作的心理模型,以及每项行动取得的成果。没有动态反馈,互动会感到不满意和奇怪。

从最基本的UI元素——按钮——我们问这种反应性可能是什么样子在VR手中。而触摸屏按钮交互是二进制的(联系人vs.非接触式)在3D中按下按钮涉及六个不同的阶段:

  • 方法。你的手指靠近按钮,它可能开始发光或者以其他方式反映接近。
  • 接触。你的手指触摸按钮,对触摸有反应。
  • 抑郁。你的手指开始按这个按钮。
  • 参与。成功!按钮可以改变其视觉状态和/或发出声音。
  • 结束接触。你的手指离开按钮。
  • 经济衰退。你的手指移开了。

#VR按钮具有6个交互阶段。每个阶段都在你的指尖。点击鸣叫方便地,,交互引擎为所有这些交互阶段提供反馈.您可以简单地将一个RigidBody InteractionBehavior组件(在这种情况下,(按钮)用于简单而有效地访问关于游戏对象和用户手之间的关系的各种信息。下面是这些交互阶段,这次使用他们的特定交互引擎回调:

  • 进场[方法]HoverBegin]
  • 接触ContactBegin]
  • 抑郁症接触保持]
  • 订婚印刷机]
  • 结束接触接触性]
  • 经济衰退[衰退]HoverEnd]

当你的手接近这个原型中的一个按钮时,一个白色的环形物从它的底座上升到接触表面。随着你的手指越来越近,戒指越来越近,直到接触和环达到按钮的顶部。

令人沮丧的按钮,直到从事改变按钮的颜色框。连同音频点击,这证实了交互的成功完成。当手指和按钮的接触结束时,第二种稍微高一点的音调点击标志着结束的交互。当用户移动他们的手离开时,白色的戒指退后。

符号是一个静态网格。在那之后,交互按钮,滑环,和按钮。

这些实际上是切换(按钮)的顽固的表弟激活预设配置雕塑的所有参数。

在滑块上采用了一种类似的方法,它带有一个扩展的白色内环。

显示滑块的不同组件的动画。

“半径滑块”统一编辑器中的层次结构,显示InteractionSlider.cs在HorizontalSlide上发送事件,HoverBegin以及气垫终点事件。

“半径滑块”统一编辑器中的层次结构,显示InteractionSlider.cs在HorizontalSlide上发送事件,HoverBegin以及气垫终点事件。

物理感觉signage-style文本插图的编号添加到滑块。这些扩大徘徊时,收回一旦用户移动他们的手。

之前在这个上升(或扩大)环反馈,我还尝试了基础按钮网格本身变形随着你的手指接近。这里的想法是使按钮凸在休息,提供被推的作用。当你的手指向它会变成一个凹的形状,好像承认你的手指的形状,提供匹配的插座。一种锁键的比喻。

部分灵感来自第五元素的手指键。

这种风格充分利用了UI组件的3D特性,感觉非常有趣。然而,让悬停距离驱动这个按钮形状变化没有沟通如何关闭的手指是有效的上升环接近。我想在某个时候更深入地研究这个概念,也许通过让你的手网也变形——把你的指尖变成一个关键的形状。

探索三维虚拟现实的用户界面

除了为按钮添加空间界面反馈和滑块,我们也开始触及三维自由所提供的新的UI可能性的表面。交互引擎所启用的可靠的抓取/释放交互和软手到物体接触如何允许新颖的3D用户界面?吗?

再现真实世界的三维操作

我们如何将物理世界的普通机械3D输入带入.#VR?吗?点击鸣叫我很好奇探索是否常见机械三维的虚拟娱乐来自物理世界的输入会引人注目与虚拟现实使用你的手。

物理轨迹球是高度触觉输入,具有广泛的交互水平。它们可以用指尖操纵,并且以缓慢的精度拨入,或者——尤其是用在交互式设备中的较大轨迹球——可以用力旋转,比如在指尖上进行篮球平衡或库格尔喷泉.轨迹球似乎是虚拟娱乐的主要候选者。

和一个小轨迹球上的拇指尖互动,还有一群人在旋转库格尔喷泉。

开始,我附上一个RigidBody组件和一个InteractionBehavior球体,XYZ旋转锁定XYZ地位,同时允许自由移动,让引擎照顾其余的交互。映射的旋转轨迹球的雕塑1:1的自由操纵,结合由角速度驱动的音频和视觉线索,创造了相当引人注目的互动。

trackball-style接口与三色的分散结构和golf-ball-like法线贴图。

trackball-style接口与三色的分散结构和golf-ball-like法线贴图。

虚拟彩色选择器

拾荒者常常试图让多个维度颜色,如色调,饱和,轻盈,或红色,蓝色,绿色水平。有很多方法可以在2D中可视化这些颜色空间。通过鼠标和键盘来探索它们,我们可以选择精确值标注在2 d飞机很容易,虽然这通常是一种深思熟虑的交互。3D颜色选择器能为用户选择颜色的体验增加什么?吗?

在我们的雕塑原型中,用户可以改变三种颜色:(1)雕塑的色调,(2)雕塑的光彩,(3)天空盒颜色。而不是关注于擅长微调颜色值的UI,我们探讨了一个3 d颜色选择器允许用户改变所有三种颜色很快就只有一只手的浪潮。

每种颜色由大帧中的小立方体表示,红色(X)绿色(Y),和蓝色(Z)。移动周围的方块(通过推或抓)更新RGB水平。这允许探索添加RGB颜色空间。

视觉传达尽可能多的信息关于UI元素的状态,每种颜色立方体是由线渲染器连接到对象的颜色变量控制。

视觉传达尽可能多的信息关于UI元素的状态,每种颜色立方体是由线渲染器连接到对象的颜色变量控制。

3 d拖拽

拖放是用户可以在2D屏幕上进行的最具隐喻性的直接交互之一。握住鼠标点击或指尖轻击来选择对象,然后拖到目标位置,感觉自然和直观的。

幸运的是,交互引擎的核心功能之一是能够实际地掠夺,拖曳,并删除3D中的虚拟对象。因此,这块UI的功能部分再次基本完成。

这样用户可以改变构成雕塑的网格形状,我们创建了一个货架,在3D中显示每个网格选项,加上一个突出的讲台上显示当前选择的形状。添加更多的反馈,在每个形状周围添加一个立方体框架。当用户的手靠近时,框架延伸直到形成一个完整的笼子。这实现了两件事:它告诉用户他们离任何给定形状有多近,并创建一个统一的立方体体积,很容易抓住。

一旦你挑选一个形状,当前形状和移动讲台解锁了,为在你的手。抓住的形状和讲台也脉冲与当前雕塑发光的颜色,显示连接。在讲台附近一旦抓住形状是移动的,它自动从手上脱离,定位自己,锁上讲台。

这个玩具的空间用户界面提供的只是一个的可能性基于物理交互引擎的基础。您希望看到什么样的3DUI,触摸,用这些工具创建吗?在下面的评论中让我们知道。

这篇文章的删节版最初发表在上传.情绪板图学分:钢铁侠2,,奋进号航天飞机驾驶舱,,费希尔价格古董,,矩阵重装,,维特根铣床,,费舍尔价格笑和学习,,Szoraidez沟槽,,谷歌材料设计面板,马丁的素描

马丁舒伯特

Martin是Leap 金宝搏牛牛Motion的开发者传教士,也是《重量与几何》的188bet让球创始人。

推特LinkedIn