现在最重要的是,我们先创建一个可以360度视角的视图,在Sketch软件中打开一个新的文件,并创建一个尺寸为3600*1800像素的画板。
导入文件名为background.jpg的背景图,并把它放置于画板中间。如果您使用的是自己的图片素材背景,确保它的长宽比例为2:1,并调整尺寸大小为3600*1800像素。
2.创建画板
如上所述,"UI视图"是一个裁剪版本的"360视图",专注于虚拟现实界面。
在前一个画板创建一个新的画板:1200×600像素。然后,复制我们为"360视图"增加的背景图,放在我们新创建的画板中心。不要调整大小!我们想保留一个裁剪版本的背景。
3.界面设计
我们将在"UI视图"画布上设计界面。为了简单化这个练习,我们在界面是添加一排方块。如果你偷懒,把资源包里文件命名为tile.png找出并将其拖到UI视图的中间。
复制,并创建一排3个方块。
从资源包中找出kickpush-logo.png,并把它放在最上面。
看起来不错,嗯?
4.合并画板和输出
现在来点有趣的,将"UIView"画板放在左边的"360View"画板之上。
拖动"UIView"画板在"360View"画板的中间,将"360View"画板作为PNG输出,"UIView"就会在它的最顶部。
5.在VR里面测试
打开GoProVR播放器,拖拽"360View"的PNG到你刚刚打开的窗口,用鼠标拖动图像预览360°全景。
大功告成!现在觉得一点都不难了,对吧?
如果将OculusRift连接到你的机器上,那GoProVR播放器应该会检测到它并允许你用VR设备来预览图像。根据电脑配置的不同,你可能需要在Mac系统里面调整一下显示设置。
技术考虑
低分辨率
VR头戴设备的分辨率非常差。事实上这句话也不完全对:分辨率取决于你手机的解析度。不过,考虑到该设备距离您的眼睛只有5厘米,显示屏会看起来不太清晰。
为了获得清晰的VR体验,单眼需要8K显示。就是15,360×7680像素显示。虽然目前差距比较大,不过总会实现滴。
文本可读性
由于显示器的分辨率,所有精美的UI元素将看起来像素化。这意味着,首先,这个文本将难以阅读,其次,直线会出现高水平的混叠。尽量避免使用大文本块和细节繁多的UI元素。
收尾工作
蓝图设计blueprint
还记得blueprint在我们手机移动端的设计过程吗,我们也将这种手法用于VR交互。打开UIviews,我们将流程映射,组成一个可以理解的blueprint,让开发者更好地理解我们设计的应用程序的整体架构。
运动设计
设计一个界面精美的UI是一回事,但展示其在不同的情景下的变化又是另一回事。我们决定再次用二维试图来解决这个问题。
运行Sketch设计软件,用AE和Principle模拟变化。虽然结果并非3D的体验,但它可以作为开发团队的参考,以及帮助客户在早期阶段了解我们的想法和意愿。
你可能会想,尽管"还不错,但是VR应用远不止这么简单呐。"是的,确实如此。而问题是,我们能够多大程度将我们当前的UI和UX的实践应用到新的媒体上?
如图:
VR界面能走多远?
个性交互
一些虚拟现实的体验很大程度上依赖于虚拟环境,因此一个传统的界面可能不是用户控制app的最佳的方式。在这种情况下,您可能希望用户直接与环境本身进行交互。
想象一下你正在为一个豪华旅行社制作一个app。你想用最生动的方式用以将用户送到潜在的度假胜地。所以,你邀请用户戴上头戴设备,开始在你豪华的切尔西办公里体验。
要从办公室到一些遥远的地方,用户需要选择他们想去的地方。他们可以拿起一本旅行杂志,翻阅它,直到翻到一个吸引人的页面。或者可能有一些有趣的物体在您的桌面上,吸引用户到不同的地方取决于他们拿起什么东西。
这肯定很酷,但也有一些缺点。为了得到充分的效果,你需要一个更先进的VR头戴设备与手持控制器。此外,像这样的app比有序组织的传统界面的app的开发难度要大得多。
革命万岁!
现实是,这些身临其境的经验对于大多数公司而言不是商业上可行的。除非你有无限的资源,如Valve和谷Google,创造上述的这一种体验成本太高,风险太大,太费时。
这种体验可以完美炫耀你站在媒介和技术的前沿,但让你的产品通过一个新的媒介进入市场并不那么美好。易用性很重要。
随着VR设备变得越来越普遍,公司将开始寻找机会,将VR融入到他们与客户接触的方式中。
从我们的角度来看,UI界面直观的VRapp——UI界面已经接近人们习惯的与服饰、手机、平板电脑和电脑等的交互——能让VR更普及,更值得大多数企业进行投资。
是时候上车了
人们常说,一个人走得更快,但你想走得更远,就需要和团队前行。我们的选择是后者。在Kickpush,我们相信每家公司都将会开发VR应用程序。就像每家公司都有自己的移动网站一样。(或者说都该有一个吧—都2017年了,天哪!)
所以,我们其实正在集合全球设计师的努力,共同建造一艘宇宙飞船,大胆地探索更多可能性。一旦企业觉得VR应用程序对他们有利,整个行业的生态都将蓬勃发展。
作者:达尔文,菲洛琪,火鱼Zero,lynn_dash,某蹦跶,Ruminate,幸若仁,Kentoness,juey,lemon,白色瓷盘