这篇文章是Marvel的设计师&开发者Maxime De Greve（Marvel是一款原型工具，之前也写过一篇体验文章来着），发布在官方博客中的一篇文章，如何通过现有的工具，来实现近在咫尺的VR未来？也许我们的设计方法和工具还没有沉淀好，但是仍然可以去一窥未来，文章也介绍了一些VR设计的基础知识，最后也完成了一个轻触效果的demo。虽然仍局限于2D场景交互方式，缺少环境交互，但行动起来，你就会发现一些新的东西，不是嘛？
原文链接：VR Prototyping with Marvel
原文作者：Maxime De Greve
VR正在稳步发展，并逐渐走向主流。就像我们等待着，从大型的设备进化成PlayStation VR和HTC Vive这样能走进客厅的设备。
在未来的三年，Forrester预测会有5200w的虚拟现实设备被销售，Samsung在今年的早些时候也有透露，它们卖出了500w的Gear VR。
然而，要降低产品设计的门槛，让更多的团队加入到设计中，还需要一些工具。
如果让你用脚趾来做VR的原型和设计，你当然会有很多困惑，你不知道该是什么尺寸，需要购买什么设备，通过什么样的软件来操作。别担心，每个人都会这样。
幸运的是，有一些人写文章来帮助其他人起步，我读了“Getting started with VR Interface Design”和“Design practise in Virtual Reality”，获得了不少启发。
Alex和Sam的这句话引起了我的注意：
“设计师多年提炼出来的工作流程不会被浪费，也可以用来构建VR界面”
于是我开始思考，我怎么样可以通过现有的工作流程，来为VR制作原型和设计？我收集了这些材料：
-通过Sketch制作一些设计
-通过Marvel制作原型，并在Marvel 的iOS应用上体验
-一部Google Cardboard
经过了几天的脑洞之后，我看到了一些我完成的有趣事情，Marvel for VR!
下面是我所做的事情：
脑洞我们的iOS应用
我们现在有一款iOS应用，可以让你在手机上看原型。我希望通过它和Google Cardboard，让你能在Marvel上查看VR原型。
现在这个应用只支持2D设计，所以我需要支持360°的图片来创造一个简单的环境。
我们使用Apple的SceneKit SDK来将图片转换到3D环境，然后让加速计追踪头部的转动。
Marvel使用“hotspots”来快速连接设计，形成原型。hotspot本质上就是一个交互区域，你可以添加到你的设计上，让用户触碰后到下一个屏幕。
我可能需要为适应VR微调一下Marvel的默认行为。
尽管Google Cardboard（大多数设备也是如此）包括一个操作按钮，它的功能就像是点击或是轻触，我也想让用户在不需要任何其它操作，只需要凝视热区几秒就可以进入下一区域。
技术做好了分类，下一步就是设计出VR原型。
为VR设计
显然，给VR设计的第一步就是在Sketch和Photoshop中设置一个2:1的画板。
我在Facebook上找到了一个很棒的模板来帮助我开始。
Facebook VR模板也有一些方便的指南。绿色区域为使用时佩戴的舒适视角，黄色区域回事用户视野的边缘，可以吸引用户的好奇心，红色是用户可以看到的部分。
现在我们有了模板，已经准备好开始设计了。作为”Game of Thrones”的忠实粉丝，我为我的“Game of Marvel”创造了两个虚拟屏。
第一个屏是3D环境，第二个屏是游戏暂停时现实的菜单。
对背景来说，我通过C4D创建了一个360°的图片。
你不需要通过3D软件开始，它可以是任何的360°图片，甚至一个白色背景，Flickr上有很多很棒的360°图片，你可以去找找。
你可能注意到这张图片有点奇怪，这是因为图片会被贴在一个球体上，通过VR设备你就可以看到全景的视图。
我添加了一个3D的插图，让你了解设备下发生了什么：
一些提示：
由于你的设计会被卷曲为球体，你需要注意你的按钮也会被球化，按钮越大，效果越明显，所以在4000x2000px的Facebook模板哈桑，不要超过400x400px的形状。
Marvel中的原型
这感觉真不错，我创建了一个Marvel项目，并添加了我的图片，通过编辑器和hotspot联系在一起。
最后结果
我在Marvel的iOS应用上运行了这个项目，把我的手机插入了Google Cardboard然后运行！这就是我的第一个Marvel VR原型。
看看下面这个视频，你可以看到暂停菜单中的hotspot和交互。
（外链的视频好像受限...所以只能去原文查看了）
我花了不到5分钟的时间来将设计连接，创建了一个VR原型，并使用了iOS应用来查看它，最终的结果也不错，我从中获得了不少乐趣。
网友评论