Mozilla 开源 web 虚拟现实框架 A-Frame

简介:

screenshot
Mozilla今天发布了全新的开源框架 A-Frame,旨在帮助开发者更轻松的开发在浏览器中运行的高性能响应式的VR体验,而不用学习强大但非常复杂的 WebGL。Mozila 旗下的 MozVR 团队已经在 WebVR 技术上进行了很多试验,今天发布的 A-Frame 则是他们研究成果的结晶,已经可以提供给开发者进行探索了。开发者只需一行代码就可以集成支持 VR 页面所需的基本组件。

<script src="https://aframe.io/releases/latest/aframe.min.js"></script>
加入这行代码,Web开发者就能够开始使用他们所熟悉的HTML代码创建一些简单的VR网页。Mozilla同时发布了A-Frame的详细文档,对A-Frame感兴趣的同学可以参考文档内容进行自己的试验。

A- Frame很大的一个优点是提供了对 VR 头戴设备和非 VR 设备——例如电脑以及智能手机——之间的无缝响应。A-Frame 目前支持 Oculus Rift DK2 以及 Cardboard 类的纸盒眼镜,并会在未来对更多的设备提供支持。根据 MozVR 团队的消息,他们很快将会利用 Oculus 最新的 0.8版本Runtime 来更好的优化75Hz的头部追踪。文末将会教你如何设置 Oculus Rift使其支持 WebVR,而手机端的 VR 模式以及所有的非 VR 渲染则可以在任何支持 WebGL 的浏览器中工作。

A-Frame 拥有许多的开发模块供开发者使用,例如模型、视频、天空、几何体等等,同时集成了控制、动画以及光标,使得开发者能够轻松的构建富交互的VR网站。A- Frame 提供了许多模板,帮助开发者迅速上手,并且 Mozilla 还鼓励开发者之间分享自己制作的模板,来加快 WebVR 网站的创建。

“如 果我们关心 Web 技术,觉得 Web 技术非常的酷炫,我们不应该等待 VR 行业的成形、成熟再进研究 Web VR 的技术,因为这一过程可能会长达五年之久,我们必须筹划未来。” Joshua Carpenter,MozVR 团队的产品设计总监在上个月的一场 Mozilla 的活动中说到,“这是我在 Mozilla、更确切的说是 CTO 办公室的主要工作——对于 Web 平台的未来进行一些研究项目。”
谈到 WebVR 的现状以及 A-Frame 时,Carpenter 说这个工具很强大,但还不能在数以百万计的现存 Web 开发者中普及。

“目前需要解决的最大的问题是 WebVR 的体验太难制作。Web 的核心价值是易用性”,他说,“你不需要安装任何东西 Web 就可以正常工作,你就可以打开链接。当你想自己制作一些东西时,你也只需要敲几行代码并且发布就行,没有人会告诉你‘你做不到’。”
A-Frame被设计出来正是为了将易用性这一价值在 WebVR 的开发中实现。

目前的一部分挑战是你不能仅仅只为VR头戴设备提供正确的响应支持,你还需要消除WebVR开发对于WebGL深层知识的需求。

“A-Frame 的目标群体是Web开发者,他们中的绝大多数都因为对 WebGL 缺乏了解而无法进行 WebVR 的开发工作,而 WebGL 这一个强力但复杂的 3D API 是 WebVR 运行的基础。”Carpenter 告诉我说,“一个用 A-Frame 来开发 VR 网站的 Web 开发者只需要在他们原本的代码中加上一行,就可以进行 WebVR 的开发了。”

附:使 Oculus Rift 可以浏览 WebVR 的方法

1、安装最新的Oculus Runtime。

2、安装 Firefox Nightly, 或者开发者版的 Chromium。

3、安装 WebVR Enabler 插件 (只有Firefox有)。

4、打开你的网站。

5、确保你的 Oculus Rift 已经正确插入并正常工作,Oculus Rift 上的指示灯应该是蓝色的。

6、点击 "Enter VR" 按钮。

====================================分割线================================
文章转载自 开源中国社区[http://www.oschina.net]

目录
相关文章
|
8天前
|
前端开发
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
26 1
【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
|
1月前
|
人工智能 前端开发 API
Gemini Coder:基于 Google Gemini API 的开源 Web 应用生成工具,支持实时编辑和预览
Gemini Coder 是一款基于 Google Gemini API 的 AI 应用生成工具,支持通过文本描述快速生成代码,并提供实时代码编辑和预览功能,简化开发流程。
143 38
Gemini Coder:基于 Google Gemini API 的开源 Web 应用生成工具,支持实时编辑和预览
|
3月前
|
开发框架 JavaScript 前端开发
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势
TypeScript 是一种静态类型的编程语言,它扩展了 JavaScript,为 Web 开发带来了强大的类型系统、组件化开发支持、与主流框架的无缝集成、大型项目管理能力和提升开发体验等多方面优势。通过明确的类型定义,TypeScript 能够在编码阶段发现潜在错误,提高代码质量;支持组件的清晰定义与复用,增强代码的可维护性;与 React、Vue 等框架结合,提供更佳的开发体验;适用于大型项目,优化代码结构和性能。随着 Web 技术的发展,TypeScript 的应用前景广阔,将继续引领 Web 开发的新趋势。
66 2
|
3月前
|
开发框架 搜索推荐 数据可视化
Django框架适合开发哪种类型的Web应用程序?
Django 框架凭借其强大的功能、稳定性和可扩展性,几乎可以适应各种类型的 Web 应用程序开发需求。无论是简单的网站还是复杂的企业级系统,Django 都能提供可靠的支持,帮助开发者快速构建高质量的应用。同时,其活跃的社区和丰富的资源也为开发者在项目实施过程中提供了有力的保障。
159 62
|
3月前
|
中间件 Go API
Go语言中几种流行的Web框架,如Beego、Gin和Echo,分析了它们的特点、性能及适用场景,并讨论了如何根据项目需求、性能要求、团队经验和社区支持等因素选择最合适的框架
本文概述了Go语言中几种流行的Web框架,如Beego、Gin和Echo,分析了它们的特点、性能及适用场景,并讨论了如何根据项目需求、性能要求、团队经验和社区支持等因素选择最合适的框架。
228 1
|
3月前
|
人工智能 前端开发 计算机视觉
Inpaint-Web:纯浏览器端实现的开源图像处理工具
在刷短视频时,常看到情侣在景区拍照被路人“抢镜”,男朋友用手机将路人“P”掉,既贴心又有趣。最近我发现了一个纯前端实现的开源项目——inpaint-web,可在浏览器端删除照片中的部分内容,非常酷。该项目基于 WebGPU 和 WASM 技术,支持图像修复与放大,已在 GitHub 上获得 5.1k Star。项目地址:[GitHub](https://github.com/lxfater/inpaint-web)。
98 3
 Inpaint-Web:纯浏览器端实现的开源图像处理工具
|
3月前
|
前端开发 JavaScript 开发工具
从框架到现代Web开发实践
从框架到现代Web开发实践
70 1
|
3月前
|
SQL 安全 PHP
探索PHP的现代演进:从Web开发到框架创新
PHP是一种流行的服务器端脚本语言,自诞生以来在Web开发领域占据重要地位。从简单的网页脚本到支持面向对象编程的现代语言,PHP经历了多次重大更新。本文探讨PHP的现代演进历程,重点介绍其在Web开发中的应用及框架创新,如Laravel、Symfony等。这些框架不仅简化了开发流程,还提高了开发效率和安全性。
49 3
|
2月前
|
前端开发 安全 JavaScript
2025年,Web3开发学习路线全指南
本文提供了一条针对Dapp应用开发的学习路线,涵盖了Web3领域的重要技术栈,如区块链基础、以太坊技术、Solidity编程、智能合约开发及安全、web3.js和ethers.js库的使用、Truffle框架等。文章首先分析了国内区块链企业的技术需求,随后详细介绍了每个技术点的学习资源和方法,旨在帮助初学者系统地掌握Dapp开发所需的知识和技能。
2025年,Web3开发学习路线全指南
|
3月前
|
存储 前端开发 JavaScript
如何在项目中高效地进行 Web 组件化开发
高效地进行 Web 组件化开发需要从多个方面入手,通过明确目标、合理规划、规范开发、加强测试等一系列措施,实现组件的高效管理和利用,从而提高项目的整体开发效率和质量,为用户提供更好的体验。
55 7

热门文章

最新文章

  • 1
    打造高效的Web Scraper:Python与Selenium的完美结合
    13
  • 2
    Burp Suite Professional 2025.2 (macOS, Linux, Windows) - Web 应用安全、测试和扫描
    26
  • 3
    AppSpider Pro 7.5.015 for Windows - Web 应用程序安全测试
    20
  • 4
    【02】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-2月12日优雅草简化Centos stream8安装zabbix7教程-本搭建教程非docker搭建教程-优雅草solution
    54
  • 5
    部署使用 CHAT-NEXT-WEB 基于 Deepseek
    342
  • 6
    【2025优雅草开源计划进行中01】-针对web前端开发初学者使用-优雅草科技官网-纯静态页面html+css+JavaScript可直接下载使用-开源-首页为优雅草吴银满工程师原创-优雅草卓伊凡发布
    26
  • 7
    java spring 项目若依框架启动失败,启动不了服务提示端口8080占用escription: Web server failed to start. Port 8080 was already in use. Action: Identify and stop the process that’s listening on port 8080 or configure this application to listen on another port-优雅草卓伊凡解决方案
    40
  • 8
    零基础构建开源项目OpenIM桌面应用和pc web- Electron篇
    28
  • 9
    【01】客户端服务端C语言-go语言-web端PHP语言整合内容发布-优雅草网络设备监控系统-硬件设备实时监控系统运营版发布-本产品基于企业级开源项目Zabbix深度二开-分步骤实现预计10篇合集-自营版
    22
  • 10
    FastAPI与Selenium:打造高效的Web数据抓取服务 —— 采集Pixabay中的图片及相关信息
    55