Quickly explained: What? How? Web XR?

WebXR – what is that actually and how does it work? We use this technology for several of our digital.DTHG prototypes – here we explain what it is.  

As the abbreviation XR suggests, the WebXR interface enables the content of a website to be displayed “device-independently”, i.e. both on VR glasses and on AR-compatible devices. (An explanation of the two technologies virtual and augmented reality and what XR stands for can be found here.

The relatively young WebXR interface was developed by a consortium of Google, Microsoft, Mozilla and other XR industry giants. It replaces the older WebVR standard, which was limited to virtual reality.

The goal of the standard, which was jointly developed by hardware and software manufacturers, is to recognize existing VR and AR devices and their technical specifications independently of specific products. Thus, information about movement, rotation and tilt of a tablet, a VR headset or a controller can be captured and processed by the website and visually implemented by means of further 3D libraries. Common 3D libraries for the web-based representations of 3D content are three.js, BabylonJS and A-Frame.

The WebXR standard enables developers to create VR and AR content for web browsers and makes apps more accessible. One click in the browser is all it takes to launch them. The biggest advantage of this is the resulting outreach while reducing the programming effort: instead of targeting only one type of device or even only one specific product with an application or app, a WebXR website can be used, for example, on a 2D screen (with navigation via mouse and / or keyboard), a smartphone in AR mode, or through high-end VR glasses.

For all the advantages, it must be kept in mind that the use of such a comprehensive interface also comes with some disadvantages: where game engines normally simplify the development of AR and VR applications, WebXR still requires most of the programming to be done “by hand”. At the same time, the intended high compatibility with a wide variety of devices and different display performances means that visual quality and complexity have to be compromised.

You can test if your browser supports WebXR here:

On Apple iPhones and iPads, a special AR-enabled browser must (still) be used: https://apps.apple.com/us/app/webxr-viewer/id1295998056 

Further articles can be found at Mixed.de:

Projects we have worked on with this technology:

Using an iPad and an iPhone, the same application can be accessed using WebXR. 

Author: Pablo Dornhege