做VR需要UI设计师具备哪些能力?
VR虚拟现实技术的到来来势汹汹,这种新的设备媒介,带来的是全新的用户交互体验。那么,它对UI设计有什么影响呢?
从近期的设备来看,针对从UI设计的层面去研究VR(Virtual Reality,虚拟现实)和AR(Augmented Reality,增强现实)技术。可以肯定的说,这类新兴技术将会给设计带来巨大的冲击。 对此,我们似乎并不是太了解,在这种技术发展浪潮中,UI设计师将要如何应对呢?
首先是在技术层面的问题,我觉得下面这篇文章回答的非常透彻;也在这里分享给大家。
一、Alpha排序(Alpha Sorting):VR中的用户界面往往是Alpha混合的(Alpha Blending), 比如通过一些透明的方式来显示过渡效果。现在一个通俗的做法是把这些透明的UI元素排序,但这可能会有些问题,比如下图2-1所示:
图2-1
我们本意是希望,红色的物体在蓝色面板之上,但由于蓝色的平面离我们的人眼更近,反而造成了红色物体被遮挡到蓝色面板的后面。对于这个问题该如何解决呢?
第一个解决方案是使用“顺序无关的透明”(Order-independent Transparency),比如给我们希望在上面的物体加一个偏差值,如下图所示,使它显示在上面。
图2-2
二、文字呈现(Text Rendering):这里我们介绍三种方法。第一种方法是将文字渲染到贴图上,再把该贴图贴到一个模型上。这种当文字的尺寸很小时,为了可以放到看清,我们需要需要一个高分辨率的材质。第二种方法是有向距离场技术(Signed distance fields),相关技术细节由于演讲者并没有说明,所以这里也不做过多的论述。
简而言之,这种方法达到的效果是在像素的级别将文字边缘重新描绘,使得字体看上去更加清晰,如下图2-3所示,左边输入的是一个模糊的字体,我们在程序中使用该技术重新绘制一下文本,使它成为右边的文字从而变得清晰。这种方法的问题在于文字可能看上去很圆润,而且需要很多工作量。
图2-3
第三种方法是直接在场景呈现文本网络(text mesh rendering), 也就是说我们直接在场景中将文本以3D模型的形式的形式显示出来。这也有些问题,文本模型因为建模的面数的限制可能会看上去有棱角和锯齿。但从长远看可能是一个很好的解决方法,因为它使文字的分辨率会独立于整个场景。
以上三种是目前常用的VR场景中文字呈现的方式,我们设计的时候可以根据具体的场景选择合适的方法。
三、悬停检测(Hover detection):悬停检测在VR的场景中,通常体现在我们如何展示用户当前的视角聚焦在哪个菜单上。通常我们会用光线投射的方式(ray-casting)。 这里我们再介绍另一个微妙的方式。比如“角度对比”如下图2-4, 被选择物体会呈现一个不同的角度来提示用户。
图2-4
四、抗锯齿技术:抗锯齿对于菜单元素尤其重要,因为过多的锯齿会转移用户的注意力。而现在市面上常见的后加工技术对于VR菜单的抗锯齿效果处理得都不算好,所以需要我们设计师在一开始就留意和处理好锯齿问题。