做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菜单的抗锯齿效果处理得都不算好，所以需要我们设计师在一开始就留意和处理好锯齿问题。