WebXR Scene

The WebXR scene is an ongoing project to create an entire website that can be viewed in three dimensions. It can contain all of the information as a traditional website, but can be navigated and viewed in novel ways using either traditional game-like character control to walk around and interact with elements or immersively using XR. This scene will contain multiple rooms to represent the different pages of a website, as well as built-in demos of apps being offered.

Main Focus

WebXR is still a very new and in-progress technology and will take some time before it is stable enough to fully execute this vision. Like other projects, I am working within Unity to make this dream a reality. Unity does not yet officially support building to WebXR, so it was necessary to find an option that would work elsewhere. After exploring and testing out various options, I found a GitHub repo that I could use to support building to WebXR from Unity.

Unity is considering official WebXR support in the future, so this project is likely to change over time as the technology evolves.

The goal with this version is to create a straightforward prototype and test the existing technology. The main backend features tested include hosting the assets on a cloud storage service, DigitalOcean, in order to load them independently from the runtime scene embedded in the website itself. This is made possible by Unity’s Addressables system.

The main challenge when designing an environment to be implemented as a website is that every kind of device has to be considered, from phones to high-end computers. Different internet browsers have their own limitations and capabilities as well.

To account for this, the runtime project that is initially loaded by the user device has to be as lightweight as possible. I created a nearly empty Unity project consisting of only a few scripts. The scripts include functionality to check device and browser information which is then used to determine what the device is capable of displaying. The Addressables loading system can dynamically adjust the quality of assets it chooses to load into the project. A traditional game typically has quality adjustment settings to change the visual to alleviate the load on the GPU, but when designing for the web, the first consideration is memory capacity. If all of the assets are included in the build, even if they are not being used in the display, the device still needs the memory to store them. In many cases, this would surpass the capabilities of the device and cause the scene to crash. This is why it is necessary to store the assets separate from the scene and load them only after determining what the device can handle.

Completed Project

The WebXR build below is the result of the prototyping I have achieved so far. It uses the MyRoom reconstruction scene, and all the assets are loaded from a cloud location at runtime. The user can fly around the scene or enter VR for a more immersive experience.

Conclusion

Working with technology still in development is a very complex endeavor. There is no shortage of challenges, many of which you will not find solutions to online. The reward is a deep understanding of a technology that may someday become standard. I expect much of the internet to start using 3D scenes for experiencing their content over time, and my goal is to get a head start and become an expert early on.

(temporarily down)