VR中的3D按钮如何做的更真实?这套UI交互告诉你

随着主流VR / AR输入技术的不断发展——从最初的视线输入到后来的控制器,以及完全流畅的手势跟踪——我们与之进行交互的虚拟用户界面也在不断改变。利用深度和容量,我们正在超越平面用户界面(UIs)时代,将从2D屏幕跃至未来的空间界面模式。

在Leap Motion,我们团队在不断地发掘我们的互动VR工具包的潜力。最近,我们创建了一个VR雕塑原型来探索它的性能和可用性。在此过程中,我们尝试了如何利用空间UIs来创建一套有趣的类实体用户界面,以从各个角度来把控这个雕塑或者任何复杂的东西。

本着开放探索的精神,我们开始了最新一轮的快速原型开发和设计之旅。在此过程中,我们将看到动态反馈如何能将一个不起眼的按钮升级为一款引人注目的直观虚拟交互方式。

一个活生生的雕塑

我们建立Leap Motion交互引擎的目的,就是让开发者能够定义虚拟宇宙的物理规律。它能够解锁虚拟物体,并生成一个物理界面,让你可以作出拿、抛、推、拍、戳或挤压等动作。VR雕塑这一概念是测试交互引擎的一个好方法。

当我们建成了这个雕塑,就是时候把互动形式提升一个档次了。

从平面屏幕到VR界面

人们第一次戴上配有手势跟踪功能的VR头盔时,好像就得重新学习如何使用自己的双手。从某种意义上说,确实是这样。当我们把双手带入一个虚拟的空间,这也会给我们带来的难得一见的物理偏差。在这些期望的基础上,令人瞩目的空间界面则进行填补和构建。

在这项探索中,我们更加注重实体性和趣味性的开发,利用动态反馈增强双手和UI元素之间的传输能力。

一款概念展板,它的界面既简单又复杂,专注于实体性和趣味性。我们还探索了各种形式、效能和色调的界面创意。

由于它是为移动VR头盔设计的,我们知道它可能只能让用户体验到3自由度的头部跟踪。也就是说,用户需要保持坐着的状态,且UIs需要被放在在触手可及的位置。考虑到这一点,我们使用了弯曲空间,它能让整个用户界面被扭曲成符合人体工程学的曲线。

当我们确定了界面布局,就到了设计用户界面的时候了。

建立一个按钮

自从2007年iPhone推出了多点触控输入以来,我们已经看到了2D触摸屏交互设计已发展成一种响应式的动作语言。现代应用程序对任何输入都能产生视觉、听觉、甚至是微妙的触觉反馈。点击和滑动会产生动画的波纹和动态的元素调整。

在VR中,每个交互对象都应能够对任何随意动作作出响应。用户并不总是知道该期待什么,动态反馈则帮助他们对虚拟世界的运作和每个动作的效果建立一个心智模式。如果没有动态反馈,这样的交互就不会令人满意,甚至会有些怪异。

从最基本的UI元素,也就是按钮开始,我们想知道在VR中这种类型的反应会是怎样的。虽然触屏按钮交互是二进制的(接触与非接触),但在3D中按下一个按钮则需要经历六个不同的阶段:

靠近。将你的手指靠近按钮,它可能开始发光,或者产生其他反应近距离接触的效果。

接触。将你的手指触及按钮,按钮对触摸产生响应效果。

按压。用你的手指开始按下按钮。

参与。成功!这个按钮可改变它的视觉状态和/或发出声音。

结束触摸。松开按钮。

退出。将你的手指从按钮上移开。

当你的手在该原型中接近一个按钮时,一个白色的圆环将从它的底部升起,达到接触表面。当你的手指越来越近的时候,圆环也会越来越近,直到手指完成接触且圆环到达按钮顶部。

按下按钮,直到它开始改变按钮帧的颜色。音效响起,证实了交互的成功完成。当手指和按钮之间的接触结束时,第二个音调稍高的音效即标志着互动的结束。当用户移开手指时,白色的圆环就会随之消退。

这些实际上就是触发器(按钮家族的顽固表亲)。就是它们激活了我们所有雕塑的预设。

滑动器也使用了一种类似的方法,它使用的是不断扩大的白色内环。

在解决上升(或扩大)圆环反馈的问题之前,我们还试着让按钮在手指靠近时变形,也就是让按钮在未使用时保持凸起状态,为之后的按压动作作准备。当你的手指靠近时,它会显现出特定的凹形,暗示这是按钮锁的一把钥匙。

该创意的部分灵感来自《第五元素》的手指键。

这种风格充分利用了UI组件的3D特性,感觉非常有趣。然而,它最终没有展现出上升圆环接近时与手指的距离联系。我们适时会深入研究这个概念,也许会让你的手网也变形——把你的指尖变成一个钥匙形状。

物理VR用户界面

除了为按钮和滑动器添加空间UI反馈,我们也很好奇物理世界的普通机械输入是否会在VR中引人注目。物理跟踪球具有高度触觉感知,能够用于广泛的交互水平。它们用指尖即可操纵,可以缓慢移动,也可以像Kugel喷泉一样的爆发式地旋转,似乎是虚拟娱乐的最佳潜力股。

这款空间用户界面只是对交互引擎的物理基础可能性的一次小小探索。你想利用这些工具看到、触摸和创造什么样的3D UIs呢

更多精彩内容,关注青亭网微信号(ID:qingtinwang),或者来微博@青亭网与我们互动!转载请注明版权和原文链接!

0

评论0

站点公告

 

AI创作与绘画大师,国内版chatGPT在线版本免费使用哦

点击打开: https://ai.uiya.cn

   
显示验证码
没有账号?注册  忘记密码?

社交账号快速登录

微信扫一扫关注
如已关注,请回复“登录”二字获取验证码