A-Frame 实践者的视角: — 与 Roland Dubois 的访谈

Web 开发者对 WebVR 的认识和兴趣日益增长,因此出现了高级工具和库来丰富 JavaScript 生态系统。

其中一个库是 A-Frame,由 Mozilla 支持。A-Frame 简化了开始创建虚拟现实体验所需的样板代码,并使用 HTML 和 DOM API 来轻松构建和操作 VR 场景,这种方式对 Web 开发者来说很熟悉。

最近,我们 Virtuleap(一个 WebVR 演示目的地和持续黑客马拉松网站)的朋友宣布了 第一届 WebVR 竞赛 的决赛选手,奖金高达 30,000 美元。结果发现 十名决赛选手中有九名使用 A-Frame 来构建他们的项目。我们想要与他们交谈,以了解更多关于他们为 Web 开发 VR 的经验,以及他们喜欢使用 A-Frame 的原因。

在这次对话中,我与 Roland Dubois 进行了交谈,他是 Virtuleap 决赛选手,也是 studio.zeldman 的创始设计师。Roland 是 gravr.io 的创建者,
这是一个云服务,允许您创建 VR 个人资料和“头像”,并在多个 VR 设备上同步您的 VR 偏好和辅助功能和舒适度的预设。

Along with your gravr.io component, there are several profiles, each coming with different presets for height, field of view, motion sickness reduction, etc.


您在开发和 VR 方面的背景是什么?

我学习的是设计,随着时间的推移,我越来越专注于开发和代码。我玩过 Cinema4D、3D Studio Max 和 Blender 等 3D 软件,主要用于建模和动画。我参与过一个 3D 游戏项目,其中你驾驶着一艘鼠标大小的宇宙飞船穿过一栋家庭住宅,并被猫追赶。我负责故事、3D 模型、纹理和游戏玩法,一位朋友用 C# 编程,并将游戏编译为原生 PC (.exe)。

我从事网站开发已经十多年了,我非常喜欢 web 标准,这就是我为什么如此兴奋地使用 A-Frame,它是一个具有语义标记的框架,它在 Canvas 中渲染内容 - 将两者最好的方面结合在一起。

您为什么使用 A-Frame?

WebGL 和 WebVR 是 JavaScript 库和 API。它们功能强大,但非常复杂。公平地说,我不是 JavaScript 专家,我习惯于使用 jQuery 或 Prototype 等库和插件。最近,我一直在使用原生 JavaScript,但对于像我这样的 web 设计师/开发者来说,WebGL 和 WebVR 在创建任何 VR 内容之前都需要大量的学习曲线。我与 Jeffrey Zeldman 合作密切,我们属于一个大型的 web 设计师和开发者社区,他们拥抱自由和开放 web 的理念。A-Frame 是一种用于 Web 上 VR 的语义 HTML 框架,对于该社区及其所有创造性人才来说,这是一个非常有用和有吸引力的工具。在虚拟体验中消费内容将是 web 的未来,A-Frame 将是创建这些体验必不可少的工具。

您最喜欢 A-Frame 的地方是什么?您最讨厌的地方是什么?

支持很棒,社区确实可以帮助你。VR 是一块空白画布,我们有机会塑造标准,创造性地跳出框框,对创新产生影响。

我并没有真正讨厌任何东西,但是文档缺乏。我们需要更多专注于注视或语音交互的示例,以及不需要 Vive 控制器的案例研究。我理解这是一个随着时间推移而不断发展的领域,但目前,很难找到许多问题的答案,这些问题不需要深入了解 three.jsWebGLWebVR

您希望在下一个版本中看到什么?

我真的希望看到一种方法,可以在您进入 VR 视图模式后操纵“用户高度”、“fov”和 XYZ/ABC 角度。我还希望看到某种类似 CSS 的实现,用于实体属性。

在为 WebVR 开发时,您错过了什么?性能工具?硬件仿真?

我主要使用 Chrome DevTools 和 Console 进行调试。我在 vagrant/VM 中本地开发,并使用 gulp 清理我的文件。我缺少的是测量工具和帧率/性能计数。

我主要使用 A-Frame 检查器来进行方向定位,我认为它很有意义。但是,我希望能够在额外的模态窗口中修改 HTML 中的源代码。我很想知道是否有一种方法可以添加额外的模态窗口来显示相机视图,并在 VR 模式下模拟预览。

在 Mozilla,我们了解互联网是一个通用的共享资源,我们担心 VR 内容由于可访问性、排他性或经济能力问题而无法触及某些受众。Roland 也似乎分享了这些担忧。用他自己的话说

我认为,WebVR 交互过于依赖于 Vive、Oculus 或 Daydream 的 VR 控制器。今天通用智能手机的硬件组件中有许多机会尚未被考虑。为什么不直接使用智能手机本身作为控制器,而不是需要购买更多更昂贵的设备和控制器来做同样的事情呢?

因此,除了 A-Frame,我们想问几个关于交互的额外问题。

您能告诉我您创建的组件吗?为什么您提供 shake 组件?您对 VR 交互有什么看法?

如果我们现在使用智能手机以及价值 5 美元的纸板眼镜,那么我们需要考虑如何在无法触摸的屏幕上触发内容。我们有注视控制,它访问陀螺仪。我们有语音控制,它访问麦克风,这将非常有效,除非你身处嘈杂的环境中。但是,我的 shake 组件 提供了一个额外的触发器,独立于注视和语音。该组件访问加速度计,这是一个几乎所有智能手机今天都有的硬件功能,它只需要在设备侧轻轻敲击一下即可。

<head>
  <title>My A-Frame Scene</title>
  <script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>
  <script src="https://rawgit.com/rdub80/aframe-shake2show-component/master/dist/aframe-shake2show-component.min.js"></script>
</head>

<body>
  <a-scene>
  <a-entity shake2show visible="false"></a-entity>
  <a-entity camera look-controls></a-entity>
  </a-scene>
</body>
这是将 Roland 的 shake2show 组件集成到 A-Frame 场景中所需的所有代码。

The component shake2show makes the device detect a shake toggling the visibility of the component's entity

您是否相信 VR 体验的某种程度上的渐进增强?我的意思是,针对有限的硬件进行设计,并在您与升级后的硬件交互时改进交互?

我完全相信 WebVR 的渐进增强…… web 是为所有人服务的,web 开发者应该尽其所能为所有人提供服务。仅仅为了消费 WebVR 内容而花费 1500 美元或更多购买新硬件,违背了我所有的原则。我们不能只关注最新的小工具来让 VR 成为主流。

……如果你只使用智能手机,你将通过注视控制或语音导航。如果你使用的是 GearVR 耳机,你将得到一个额外的按钮可以点击。如果你连接了蓝牙控制器或 Leap Motion 传感器,WebVR 体验将为你提供更丰富的用户体验。如果你没有以上任何一项,但你正在使用智能手机,你应该能够获得类似的体验,而无需所有其他昂贵的额外硬件。


第一款 Oculus Rift 开发者套件是在四年前发布的,但 VR 交互仍然是未知领域,它揭示了新的有趣的可用性挑战。Roland 提醒我们

VR 开发者完全负责创造一个全新的世界,他们无法适应我们每天在我们正常的数字设置中使用的个人偏好和调整。自从 iPhone 诞生以来,还没有哪个开发者拥有如此重的责任。

A-Frame 项目致力于探索和试验虚拟现实和增强现实作为一种媒介,为 Web 社区提供可访问的工具来创建高质量的制作内容。

像 Roland 这样的开发者在实施 gravr.io 等项目时提供的反馈对于对 A-Frame 进行实战测试和发现新的用例至关重要。我们渴望看到更多突破界限并帮助 A-Frame API 发展的开发,从简单的演示到功能齐全的体验。

我想要结束这次采访,感谢 Roland 抽时间与我交谈:Roland,与你直接讨论你对使用 A-Frame 的感受,真是太愉快了。我们 Mozilla 祝你 gravr.io 一切顺利。

关于 Salva

Mozilla 的前端开发者。开放 web 和 WebVR 倡导者,我喜欢编程语言、电影、音乐、电子游戏和啤酒。

更多 Salva 的文章……


一条评论

  1. daizhilong

    喜欢工作

    2017 年 3 月 30 日 上午 1:10

本文的评论已关闭。