编者按:国内关注VR的设计师不多,能持续关注并产出优质内容的设计师更是凤毛麟角,建议想跟上趋势的同学多关注腾讯高级交互设计师@C7210 。今天他的译文实战性很强,包括从Unity商店下载环境资源、在项目中使用Google VR Unity SDK提供的组件及第三方脚本等等。
欢迎关注译者(交互设计师、猫奴、吉他手、鼓手、老狗,现就职于腾讯ISUX)的微信公众号:Beforweb
这儿有他的访谈:《优设访谈!腾讯高级交互设计师C7210的十年设计路》
@C7210 :时至今日,多少已经对VR世界有些神往了吧?作为设计师,是否已经有了上手的兴趣?大家都差不多的样子。最近,有几篇不错的文章给到我(英文原文作者)一些启示,包括:
- From product design to virtual reality(Medium,墙外,作者Jean-Marc Denis,Beforweb译文版:从二维界面到虚拟现实)
- A month designing in VR(Medium,墙外,作者Julius Tarng)
- Designing for virtual reality(ustwo出品)
经过简单的研究与学习,我发现即便不曾有过3D设计或脚本编写等方面的背景经验,你仍然有可能创建出最基础最简单的VR世界,并以app的形式部署到手机当中,然后通过Cardboard进行体验。对产出形式没什么概念?我做的这款PolyLand VR就是实际范例;而具体的实践方法就是我将要在本文当中与各位分享的。
所需要的工具
- Cardboard:我个人使用Google Cardboard;其他Cardboard类设备也可。
- Unity:下载并安装最新的免费个人版本即可。
- Android SDK:下载并安装最新的Android开发工具包(本文以Android平台作为演示;相似的方法同样可以用于iOS,详见“Unity与Cardboard app基础实践-1”一文)。
- Google VR Unity SDK:在GitHub下载;其中包含了SDK以及Google官方提供范例项目。
- 用于Google VR Unity SDK的自动行走脚本:在GitHub下载;作者Jupp Otto。
我们将要一起学习制作的是一个非常简单的VR环境;在实际运行时,你可以通过头显上的按钮来打开或关闭自动行走功能。
第1步:构建3D环境
打开Unity,新建3D项目:
我将会使用Forest Environment这套免费的模型来搭建环境,你也可以在Unity资源商店随便逛逛,选择自己更加喜欢的环境模型拿回来用。在资源页面中点击Open in Unity按钮,Unity会自动将其加载到Asset Store面板当中。点击面板上的Download按钮(需要注册并登录Unity帐户;Unity不允许用户直接通过网页下载资源):
下载完成之后,在Import Unity Package对话框中,确保所有资源都有被勾选,然后点击Import按钮:
在Project面板当中,按照下图所示的路径找到demoScene_free.unity文件,双击,然后我们下载到的环境模型便会被加载到Scene面板中:
点击顶部的Play按钮,在Game模式中查看一下目前的实际效果:
第2步:安装Google VR Unity SDK
在左侧的Hierarchy面板中,删除First Person Controller和Main Camera:
将之前下载的Google VR Unity SDK解压,得到“gvr-unity-sdk-master”文件夹。回到Unity,点击菜单栏中的Assets > Import Package > Custom Package,选择刚刚解压缩的文件夹中的GoogleVRForUnity.unitypackage,点击Open按钮。在接下来弹出的Import Unity Package对话框中,确保所有资源都有被勾选,然后点击Import按钮:
导入完成后,在Project面板的资源列表中找到Assets > GoogleVR > Legacy > Prefabs文件夹,将其中的GvrMain拖放到Scene面板中:
点击Play按钮,界面会自动切换到Game面板。按住alt或control键,同时移动鼠标,测试一下主视角的移动方式。如果测试时发现之前拖放进来的GvrMain在位置上不太合适(主视角漂浮在空中或是位于地面以下),你可以结束Play模式,回到Scene面板当中对其进行调整 - 在右侧检查器中调整“Position”的值,或是直接通过鼠标移动GvrMain对象均可。
第3步:添加自动行走功能
将之前下载的自动行走脚本文件包解压,将其中的Autowalk.cs文件夹拖放到Project面板的Assets根目录下:
双击Autowalk文件,使其在MonoDevelop编辑器当中被打开。Command+F,搜索“CardboardHead”,并替换为“GvrHead”;搜索“Cardboard.SDK”,全部替换为“GvrViewer.Instance”,然后保存文件并关闭MonoDevelop。
回到Unity,点选主界面左侧Hierarchy面板中的“GvrMain”,然后在主界面右侧的检查器中点击Add Component按钮,在搜索框中输入“autowalk”,点选该文件:
检查器当中会出现新的“Autowalk”选项区。勾选“Walk When Triggered”,将“Speed”设置成“1”(或是你觉得更加合适的数值):
点击Play按钮,进入Game模式,你会发现在点击鼠标之后主视角会自动向前行进,再次点击则会停下。
第4步:打包app
注意:以下步骤仅针对安卓平台,因此译者并未执行到实际部署环节。iOS方面的流程大同小异,详见上周的「谷歌VR APP实战!UNITY与CARDBOARD APP基础实践(一)」
点击菜单栏中的File > Build Settings,在弹出的Build Settings窗口中,选择Platforms列表里的“Android”,然后点击列表下方的Player Settings按钮:
Unity主界面右侧的检查器当中会出现PlayerSettings面板。在顶部的Company Name字段里输入公司或组织机构名称。接下来,在“Settings for Android”部分当中,点击“Resolution and Presentation”使其展开,将“Default Orientation”设置为“Auto Rotation”,然后取消勾选“Allowed Orientations for Auto Rotation”下的前三个选项,只保留最后一个“Landscape Left”为选中态:
仍然在“Settings for Android”当中,点击“Other Settings”使其展开,并找到Bundle Identifier字段,在这里为你的app输入一个合法的安装包名称,譬如“com.mycompany.cardboarddemo”,只要遵循“com.<公司或组织名称>.<app名称>”的形式即可:
仍然在“Settings for Android”当中,点击“Publishing Settings”使其展开。如果你没有keystore,那么在这里需要勾选“Create New Keystore”,然后输入密码,并点击“Browse Keystore”。在对话窗口中输入keystore的名称,点击Save按钮。此时在“Browse Keystore”按钮旁边会出现keystore所处的路径(更多信息请参考Android Studio官方文档当中的“Sign Your App”部分)。在下方的“Key”选项区里,点击Alias下拉列表,选择“Create a new key”,在对话窗口中输入相关信息,点击Create Key按钮:
如果觉得需要,还可以在“Icon”及“Splash Image”当中添加相应的素材作为app icon和闪屏图片。最后在Build Settings窗口中点击Build按钮。Building期间,你可能需要选择Android SDK的根目录。解压之前下载好的Android SDK压缩包,选择这个文件夹即可。此外你可能还会被要求升级SDK,点击确认即可。Build完成后,你便可以在Android手机上安装app了,然后放到Cardboard里尽情体验吧。
有时你可能会发现视角不会随着头部的转动而相应的运动,这时重启app即可;具体原因或许和SDK及Android系统的版本有关。
欢迎关注译者(交互设计师、猫奴、吉他手、鼓手、老狗,现就职于腾讯ISUX)的微信公众号:
这儿有他的访谈:《优设访谈!腾讯高级交互设计师C7210的十年设计路》
「优设六月最新的VR设计好文合集」
VR入行手册!
《VR快速入行手册!可能是现在最全面的VR知识学习指南》实战教程:
《实战教程来了!一名UX设计师的VR设计初体验》VR设计指南:
《教程来了!VR设计指南之基础概念与设计工具》
原文地址:hackernoon.com
译文地址:beforweb
【优设网 原创文章 投稿邮箱:2650232288@qq.com】
================关于优设网================
"优设网uisdc.com"是国内人气最高的网页设计师学习平台,专注分享网页设计、无线端设计以及PS教程。
【特色推荐】
设计师需要读的100本书:史上最全的设计师图书导航:http://hao.uisdc.com/book/。
设计微博:拥有粉丝量160万的人气微博@优秀网页设计 ,欢迎关注获取网页设计资源、下载顶尖设计素材。
设计导航:全球顶尖设计网站推荐,设计师必备导航:http://hao.uisdc.com
复制本文链接 文章为作者独立观点不代表优设网立场,未经允许不得转载。
发评论!每天赢奖品
点击 登录 后,在评论区留言,系统会随机派送奖品
2012年成立至今,是国内备受欢迎的设计师平台,提供奖品赞助 联系我们
AI绘画创意与实战
已累计诞生 611 位幸运星
发表评论
↓ 下方为您推荐了一些精彩有趣的文章热评 ↓