You may already have heard these terms – MR, XR, WebVR, WebXR, and others that end with R-sounding acronyms. If you’re new to this content, it can be a little confusing. All these terms are important when creating a 3D configurator.
Against this background we would like to inform you about the WebXR-API today. This API will adopt the current WebVR API and extend it to even more devices, paving the way for a truly immersive Web experience in the coming years.
A quick note before you start: This API is still “in the works” and could change if you read this article again. We will try not to dive too much into the technical specifications, but if you want to look at the details, we recommend that you look at the official specification.
What is XR and why does it need the web?
As you may already know, the “R” in AR/VR/MR/XR stands for reality. What does X mean in XR reality?
The answer is … everything. Since we can’t really know what the future will bring and what “R” will remain, “X” is the variable, so it can be practically anything.
What does development mean for XR? It means that it should support all current R’s – whether VR, AR, MR or whatever comes next. Developing an API for devices that haven’t been invented yet, especially if you want to streamline the entire market that could be flooded with different types of devices every minute.
OpenXR does just that – define the standard and API for all devices, so developers won’t have to customize their products for each device in the future. WebXR does that too, but as you may have guessed, it focuses on integrating devices into our browsers.
The goals for WebXR are quite simple, as you can see in the very detailed explanation:
Targets.
Enable XR applications on the Web by allowing pages to do the following:
No destinations.
But what do the individual goals actually mean and why are they important?
Building future-proof XR experiences.
At the moment there are about a dozen mainstream XR platforms on the market and most of them focus on VR. But in the near future the devices will be sold by many manufacturers – each with different specifications, similar to the smartphone market.
If you’ve ever designed a mobile-friendly website, you know the problems we’re hinting at. Since the display dimensions vary from device to device, you need to consider all options when creating a perfect website – because relying on automatic detection can often fail.
Now imagine that every website needs to know how to display it for every XR device. If you thought the display dimensions were a problem, now each site needs to manage the specifications of the XR devices, the communication protocol with the browser, and the display settings. This is an integration nightmare.
The WebXR API is the gateway through which the devices communicate with the browser and give it information about their capabilities. This allows developers and designers to leverage this information and customize the Web site for each device.
Without this option, we would have to develop a different Web page for each resolution separately. The WebXR API gives us the tools to integrate everything into a single Web site and make the necessary changes for each ad smoothly.
Stay immersive on the Web.
Recognizing and receiving specifications is one thing – delivering the website to the device is another. Because most devices have different graphical capabilities, you can’t just send them in a one-for-all format and hope for the best.
It’s even more critical in XR devices – wrong frame rates and bad latency can cause nausea and prevent people from taking advantage of these experiences. Immersion is the key and the website must support it accordingly.
Through a communication channel between the browser and the device, the device can synchronize with the browser and deliver a delay-free and synchronized experience.
The XR session also has a private sphere, which becomes mandatory. While the browser should always recognize if a device is connected to enable smooth transitions, you don’t want all device information to be automatically sent to a Web site.
That’s why the device only sends this information to the browser when you start a session. Because the session should always be initiated by the user, you can control what and when you send through your device to ensure that your data stays secure and is only shared when needed.
Why is that so useful?
To understand the potential of the WebXR API, you don’t have to look very far – you can see it radiating from your so-called “non-targets”.
“The Metaverse” is a term coined in the book “Snow Crash” by Neal Stephenson, which describes a Virtual Reality Internet as early as 1992, when it was published. Although it looked like science fiction 25 years ago, WebXR is the foundation and protocol on which “The Metaverse” can actually be built.
Imagine surfing your Facebook profile and watching a live video – and if you use your VR device, you can watch the video in 360 format or if you want to buy a dress and see what it looks like, you can simply put on your AR device and see it – and above all, without additional apps and middleware.
What am I supposed to use?
First, you should decide which technology you want to use for your XR website. At the moment, the decision can only be made on A-Frame or React 360.
If you just want to get a taste of what’s coming, download the WebXR Viewer for iOS and try it for yourself.
Thank you very much for your visit.