{"id":62377,"date":"2017-10-20T00:00:00","date_gmt":"2017-10-20T00:00:00","guid":{"rendered":"http:\/\/blog.mozilla.org\/foxtail\/2017\/10\/20\/bringing-mixed-reality-web\/"},"modified":"2021-02-09T05:38:21","modified_gmt":"2021-02-09T05:38:21","slug":"bringing-mixed-reality-web","status":"publish","type":"post","link":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/","title":{"rendered":"Bringing Mixed Reality to the Web"},"content":{"rendered":"<p>Today, Mozilla is announcing a new development program for <a href=\"https:\/\/mixedreality.mozilla.org\/\">Mixed Reality<\/a> that will significantly expand its work in Virtual Reality (VR) and Augmented Reality (AR) for the web. Our initial focus will be on how to get devices, headsets, frameworks and toolsets to work together, so web developers can choose from a variety of tools and publishing methods to bring new immersive experiences online \u2013 and have them work together in a fully functional way.<\/p>\n<p>In 2017, we saw an explosion of ways to create and experience Virtual Reality (VR) content on the web. Notable events included:<\/p>\n<ul>\n<li>Mozilla shipped the <a href=\"https:\/\/hacks.mozilla.org\/2017\/08\/webvr-for-all-windows-users\/\">WebVR API in Firefox<\/a><\/li>\n<li>Oculus browser and Samsung Internet shipped WebVR for Gear VR<\/li>\n<li>Microsoft is <a href=\"https:\/\/blogs.windows.com\/msedgedev\/2017\/10\/10\/bringing-webvr-everyone-windows-10-fall-creators-update\/\">shipping WebVR in Edge<\/a><\/li>\n<li>VR frameworks A-Frame and ReactVR gained massive popularity<\/li>\n<li>A wide variety of tools such as <a href=\"http:\/\/developer.playcanvas.com\/en\/user-manual\/vr\/using-webvr\/\">PlayCanvas<\/a>, <a href=\"https:\/\/vizor.io\/\">Vizor<\/a>, <a href=\"http:\/\/webvrstudio.com\/\">WebVR Studio<\/a>, and <a href=\"https:\/\/help.sketchfab.com\/hc\/en-us\/articles\/211640363-VR-Editor\/\">Sketchfab<\/a> launched to address the growing AR\/VR development community<\/li>\n<\/ul>\n<p>So the VR space is coalescing nicely, bringing VR models, games, and experiences online for anyone to enjoy and reuse. Unfortunately, the same is not yet true for AR. For instance, there is no way today to create a single web page that can be viewed by all these device types:<\/p>\n<ul>\n<li>VR devices<\/li>\n<li>Desktop AR devices like the <a href=\"https:\/\/buy.metavision.com\/products\/meta2\">Meta 2<\/a><\/li>\n<li>Mobile devices that use iOS ARKit or Android ARCore<\/li>\n<li>Standalone AR headsets like <a href=\"https:\/\/www.microsoft.com\/en-us\/hololens\">Microsoft Hololens<\/a> and <a href=\"https:\/\/www.osterhoutgroup.com\/r-9-smartglasses\">ODG R9 smartglasses<\/a><\/li>\n<\/ul>\n<p>The <a href=\"https:\/\/mixedreality.mozilla.org\">Mixed Reality<\/a> program aims to change that. We plan to work on the full continuum of specifications, browser implementations, and services required to create open VR and AR web experiences.<\/p>\n<h2>Proposing a WebXR API<\/h2>\n<p>We have created a <a href=\"https:\/\/github.com\/mozilla\/webxr-api\">draft WebXR API proposal<\/a> for providing access to both augmented and virtual reality devices. The WebXR API formalizes the different ways these technologies expose views of reality around the user, and it exposes concepts common in AR platforms such as the Anchors found in Hololens, ARKit, and ARCore. You can take a look at an early implementation of this proposal, complete with <a href=\"https:\/\/github.com\/mozilla\/webxr-polyfill\">examples<\/a> that run on a range of AR- and VR-capable browsers.<\/p>\n<p><img decoding=\"async\" loading=\"lazy\" class=\" wp-image-10928 alignright\" src=\"https:\/\/blog.mozilla.org\/wp-content\/uploads\/2017\/10\/WebXR-300x225.png\" alt=\"\" width=\"344\" height=\"258\" srcset=\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/WebXR-300x225.png 300w, https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/WebXR-768x576.png 768w, https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/WebXR-1000x750.png 1000w, https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/WebXR-600x450.png 600w, https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/WebXR.png 1024w\" sizes=\"(max-width: 344px) 100vw, 344px\" \/>WebXR is designed to make it easy for web developers to create web applications that adapt to the capabilities of each platform. These examples run in WebVR- and AR-enabled browsers, including desktop Firefox and experimental browsers such as one supporting <a href=\"https:\/\/github.com\/google-ar\/WebARonARCore\">ARCore on Android<\/a> (although each small example is targeted at AR or VR for simplicity). We have <a href=\"https:\/\/github.com\/mozilla-mobile\/webxr-ios\">developed<\/a> an open-source WebXR Viewer iOS application that uses ARKit to implement AR support for these WebXR examples; it will be available in iTunes soon, but you can compile it yourself now if you have an iOS Developer account. We will be offering support for more browsers in the future, and welcome others to contribute to this effort and provide feedback on the proposal on <a href=\"https:\/\/github.com\/mozilla\/webxr-api\">GitHub<\/a>.<\/p>\n<h2>Growing support for 3D Browsers<\/h2>\n<p>We are also expanding our browser support for Mixed Reality on the web. On desktop, we continue to evolve Firefox with broader 3D support, including recently <a href=\"https:\/\/hacks.mozilla.org\/2017\/09\/meta-2-ar-headset-with-firefox\/\">announcing<\/a> see-through AR support for Meta\u2019s AR headset.<\/p>\n<p>We are also developing a 3D mobile browser platform, based on our <a href=\"https:\/\/research.mozilla.org\/servo-engines\/\">Servo project<\/a>, that enables a new class of Mixed Reality headworn displays, expected to come to market in the near term. We will share more on this work soon, but some early teases include <a href=\"https:\/\/www.youtube.com\/watch?v=hpZqEM5hPao\">Servo DOM-to-Texture<\/a> support and <a href=\"https:\/\/www.youtube.com\/watch?v=ppLpEQZDTmo\">integrated support<\/a> for <a href=\"https:\/\/developer.qualcomm.com\/hardware\/snapdragon-835-vr-development-kit\">Qualcomm\u2019s Snapdragon 835 standalone VR hardware<\/a>.<\/p>\n<h2>Ways to Contribute<\/h2>\n<p>We look forward to your feedback on <a href=\"https:\/\/github.com\/mozilla\/webxr-api\">WebXR<\/a>, as well as engaging with hardware and software developers who might wish to collaborate with us in this space or Servo. Stay tuned for upcoming updates from us on more ways to produce WebVR content from popular authoring tools, experimental browser features for better access to the GPU, in-headset content discovery, and open, cross-platform social services.<\/p>\n<p>We welcome Mixed Reality hardware and software developers who may wish to collaborate with us on Servo or other projects to <a href=\"mailto:mozillamr@mozilla.com\">drop us an email<\/a>. <a href=\"https:\/\/twitter.com\/mozillareality\">Follow us on Twitter<\/a> for updates.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Today, Mozilla is announcing a new development program for Mixed Reality that will significantly expand its work in Virtual Reality (VR) and Augmented Reality (AR) for the web. Our initial focus will be on how to get devices, headsets, frameworks and toolsets to work together, so web developers can choose from a variety of tools [&hellip;]<\/p>\n","protected":false},"author":1207,"featured_media":10932,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[5],"tags":[47688],"coauthors":[],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO plugin v22.5 - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Bringing Mixed Reality to the Web<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/\",\"url\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/\",\"name\":\"Bringing Mixed Reality to the Web\",\"isPartOf\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png\",\"datePublished\":\"2017-10-20T00:00:00+00:00\",\"dateModified\":\"2021-02-09T05:38:21+00:00\",\"author\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/e6a71fbdf283ac35c8f26fb3936f3849\"},\"breadcrumb\":{\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage\",\"url\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png\",\"contentUrl\":\"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png\",\"width\":8001,\"height\":4501},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/blog.mozilla.org\/en\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Bringing Mixed Reality to the Web\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#website\",\"url\":\"https:\/\/blog.mozilla.org\/en\/\",\"name\":\"The Mozilla Blog\",\"description\":\"News and Updates about Mozilla\",\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/blog.mozilla.org\/en\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Person\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/e6a71fbdf283ac35c8f26fb3936f3849\",\"name\":\"Andre Vrignaud\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/image\/8ce8aba06aeb4e392ad349d133f80a14\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/f30a6d723b8845f6035aee4f822f753c?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/f30a6d723b8845f6035aee4f822f753c?s=96&d=mm&r=g\",\"caption\":\"Andre Vrignaud\"},\"description\":\"Andre Vrignaud is the Head of Platform Strategy for Mozilla\u2019s Mixed Reality Program, where he guides the strategy for Mozilla's efforts to enable an open, sustainable 3D web and ecosystem. With a side of net neutrality and privacy advocacy.\",\"sameAs\":[\"https:\/\/x.com\/andrevrignaud\"],\"url\":\"https:\/\/blog.mozilla.org\/en\/author\/avrignaudmozilla-com\/\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"Bringing Mixed Reality to the Web","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/","schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/","url":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/","name":"Bringing Mixed Reality to the Web","isPartOf":{"@id":"https:\/\/blog.mozilla.org\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage"},"image":{"@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage"},"thumbnailUrl":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png","datePublished":"2017-10-20T00:00:00+00:00","dateModified":"2021-02-09T05:38:21+00:00","author":{"@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/e6a71fbdf283ac35c8f26fb3936f3849"},"breadcrumb":{"@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#primaryimage","url":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png","contentUrl":"https:\/\/blog.mozilla.org\/wp-content\/blogs.dir\/278\/files\/2017\/10\/2017.05.09.mozilla.hacks_.3-dino-halftone-09.png","width":8001,"height":4501},{"@type":"BreadcrumbList","@id":"https:\/\/blog.mozilla.org\/en\/mozilla\/bringing-mixed-reality-web\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/blog.mozilla.org\/en\/"},{"@type":"ListItem","position":2,"name":"Bringing Mixed Reality to the Web"}]},{"@type":"WebSite","@id":"https:\/\/blog.mozilla.org\/en\/#website","url":"https:\/\/blog.mozilla.org\/en\/","name":"The Mozilla Blog","description":"News and Updates about Mozilla","potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/blog.mozilla.org\/en\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Person","@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/e6a71fbdf283ac35c8f26fb3936f3849","name":"Andre Vrignaud","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/blog.mozilla.org\/en\/#\/schema\/person\/image\/8ce8aba06aeb4e392ad349d133f80a14","url":"https:\/\/secure.gravatar.com\/avatar\/f30a6d723b8845f6035aee4f822f753c?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/f30a6d723b8845f6035aee4f822f753c?s=96&d=mm&r=g","caption":"Andre Vrignaud"},"description":"Andre Vrignaud is the Head of Platform Strategy for Mozilla\u2019s Mixed Reality Program, where he guides the strategy for Mozilla's efforts to enable an open, sustainable 3D web and ecosystem. With a side of net neutrality and privacy advocacy.","sameAs":["https:\/\/x.com\/andrevrignaud"],"url":"https:\/\/blog.mozilla.org\/en\/author\/avrignaudmozilla-com\/"}]}},"_links":{"self":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts\/62377"}],"collection":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/users\/1207"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/comments?post=62377"}],"version-history":[{"count":0,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/posts\/62377\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/media\/10932"}],"wp:attachment":[{"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/media?parent=62377"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/categories?post=62377"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/tags?post=62377"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blog.mozilla.org\/en\/wp-json\/wp\/v2\/coauthors?post=62377"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}