WebXR: Bridging the Gap Between Immersive Experiences and Accessibility

Invisible Room
5 min readMay 17, 2023

--

Almost a century ago, our studio's journey began with Augmented Reality (AR), Virtual Reality (VR), and Mixed Reality (MR) — what a ride so far!

The digital space presented incredible opportunities for exploration and innovation. By utilizing game engines such as Unity 3D, we created immersive experiences and apps, mainly for B2B clients.

Look at that old, tethered Vive HMD with outside-in tracking that we once used to develop a mixed reality experience where users could interact with a real and virtual tree. Check out the project here: https://invisibleroom.com/en/Projects/wald

Although the results were impressive, accessibility remained a significant challenge for end-users.

VR headsets enabled these immersive experiences, but not everyone had access to them, and B2B-clients often faced complex device and account management. Furthermore, mobile applications require a tedious authorization, downloading and updating process from app stores. These barriers made the exciting world of VR, AR, and MR somewhat restrictive.

However, with the emergence of WebXR, the landscape has shifted dramatically.

WebXR makes the digital space accessible across different devices.

WebXR: The Game Changer

WebXR is a technology that allows three-dimensional experiences directly in your browser, with or without additional devices. It streamlines access to immersive experiences by eliminating the need to download specialized applications or use specific hardware.

While VR headsets and AR-capable smartphones can enhance immersion, the magic of WebXR can be experienced like any other website. Whether you’re on a smartphone, tablet, or desktop computer, these experiences are now just a click away.

Our interactive WebXR website for SolarZentrum Berlin allows users to configure 3D solar systems, access informative articles, and play educational mini-games in 3D on their laptops, tablets and Virtual Reality goggles. Check out the project here: https://invisibleroom.com/en/Projects/solarzentrum-berlin

Pros of WebXR

Like any technology, WebXR has its advantages and disadvantages. On the positive side, it offers:

1. Ease of Access

WebXR content can be entered on many devices with a web browser, making it far more accessible than traditional VR, AR, or MR content, which often requires specific hardware.

2. Ease of Distribution

There’s no need to go through an app store or perform a complex installation process. Users can simply visit a webpage to experience WebXR content.

3. Cross-Platform Compatibility

WebXR runs in a browser, making it compatible across a wide range of devices — from smartphones and tablets to desktop computers and VR/AR headsets.

4. Cost-Effective

Users don’t need to invest in expensive hardware to experience WebXR content, and developers can save costs associated with developing for multiple platforms.

5. Up-to-date Content

Since the content is web-based, updates can be made in real-time, ensuring users always have the most current version.

Cons of WebXR

However, it also presents challenges such as:

1. Performance Limitations

WebXR may not offer the same level of performance as native applications, particularly for more complex or graphics-intensive experiences.

2. Limited Access to Device Features

While WebXR can access some device features, others might be inaccessible due to browser security restrictions.

3. Internet Dependency

WebXR requires an internet connection, which might limit availability in areas with poor or no connectivity. But with clever techniques like service workers and cache features, this obstacle can be solved.

The Power of Frameworks

As we dive deeper into WebXR, it’s essential to comprehend the foundational tools that make these experiences possible. We use powerful frameworks like Three.js, a cross-browser JavaScript library and API that simplifies the creation and display of 3D computer graphics in a web browser.

Three.js is a cross-browser JavaScript library and application programming interface (API) that enables the creation and display of 3D computer graphics in a web browser. It abstracts the complexities of the WebGL library, which is the bedrock for 3D graphics in the browser, making it easier for developers to create intricate 3D scenes.

In the context of WebXR, Three.js plays a pivotal role. It is used to stage the 3D models and environments that are then displayed in the browser. The power of Three.js lies in its simplicity and flexibility; it provides a high level of control over the details of the 3D scene while keeping the codebase manageable and readable.

The ability to create rich, interactive 3D environments directly in the browser is a game-changer. It enables us to craft unique, immersive experiences that are accessible to anyone with a web browser. This capability, combined with the accessibility of WebXR, is transforming the way we interact with digital content.

Our workflow helps us bridge the gap between complex 3D graphics and the accessible, user-friendly interface of the web browser.

WebXR is the way to go for us

Despite these challenges, we firmly believe that the benefits of WebXR far outweigh the drawbacks, especially for our studio’s objectives and goals. Our emphasis is on creating meaningful and precise immersive experiences for our clients that can reach as many people as possible.

Furthermore: The ability to connect external internet-enabled devices with our WebXR experience, we have endless creative possibilities to embed, anchor and hybridize the virtual worlds with real, tangible and enhanced spaces.

For example, by connecting DMX interfaces to WebXR, we can bring the virtual experience into the physical world, creating stunning lighting effects that enhance the overall experience for events and an audience not wearing a VR headset.

By leveraging the power of WebXR to connect external devices, we can create truly unforgettable experiences that engage all of our senses accessible cross-platform and target.

Photo from our beloved project ‘Spatial Encounters’ for Sommerkonzerte Volkenroda togehter with Franzsika Ritter, Pablo Dornhege, Vincent Kaufmann and violinist David Wedel.

Is WebXR for you, too?

At our studio, we are passionate about immersive experiences and technology, and we love sharing our knowledge and expertise with others.

That’s why we offer workshops for creative teams and business development. These workshops are designed to provide a deeper understanding of WebXR and immersive experiences and help teams unlock the potential of this technology. We cover everything from technical aspects to creative approaches, ensuring that participants leave with the skills and inspiration needed to create their own immersive experiences. We are committed to empowering others and driving innovation in the industry through education and sharing knowledge.

Let´s share thoughts!

Contact us via
hallo@invisibleroom.com
and check our website invisibleroom.com/en
to tailor a workshop format on WebXR regarding your needs with us
or tell us about your goals for a development.

--

--