WebXR, A-Frame and Networked-Aframe
as a Basis for an Open Metaverse:
A Conceptual Architecture

The advent of extended reality (XR)—namely augmented reality (AR), mixed reality (MR), and virtual reality (AR)—together with a renewed interest in the metaverse after Facebook Inc. changed its name to Meta Platforms Inc., introduces not only unprecedented opportunities for the digital landscape but also significant challenges due to the considerable variation in capabilities between XR devices and conventional computing platforms such as smartphones, tablets, and desktop computers. Where once the primary considerations were screen size and input method (e.g. touch versus mouse and keyboard), developers now must navigate a complex array of sensory inputs, immersive environments and spatial interactions. Therefore, while the web expands to encompass these new immersive experiences, there is a crucial need for the right balance between embracing the unique features of each platform and ensuring universal accessibility. This would allow the web to harness the full potential of XR technologies, enabling creators to deliver rich, immersive experiences while preserving the user’s freedom to choose their preferred platform and interface.

Tim Berners-Lee, inventor of the World Wide Web, wanted his creature to be an “open platform that allows anyone to share information, access opportunities and collaborate across geographical boundaries” [1]. To achieve this result, the web should be based on open standards, avoiding proprietary systems [2]. The web indeed owes much of its success to the adoption of standards that allow content to be enjoyed by a wide audience, regardless of the browser or the operating system. Due to this inclusive and flexible nature, the web has already become a major platform for consuming two-dimensional content.

On the other hand, the journey of the web towards a universally accessible platform has not been without its challenges. Instances where proprietary technologies were widely adopted, included but not limited to the ones developed by Microsoft in the 1990s (e.g. ActiveX), exemplify the potential pitfalls of deviating from open standards. This approach led to a significant portion of web content being optimized exclusively for specific browsers, notably Internet Explorer for Windows, thereby limiting accessibility across different platforms. Similarly, the advent of mobile computing devices, including smartphones and tablets, initially posed significant obstacles for web usability due to the vast differences in screen sizes and interaction models compared to traditional desktop computers. However, the web community’s commitment to inclusivity and universal access spurred the evolution of standards to overcome these challenges: for example, CSS emerged as a pivotal solution, enabling web content to dynamically adapt to a highly diverse array of devices.

In the growing area of virtual reality and digital interconnectedness, the vision of an open metaverse—a vast, shared, and interoperable virtual space—has captivated the imagination of technologists, creators, and users alike. This work sets out to propose a WebXR-based cross-platform conceptual architecture designed to serve as a cornerstone for building such an open metaverse, delivered through the World Wide Web. Central to this exploration is the research question:

RQ: How can a WebXR-based cross-platform conceptual architecture facilitate the development of an open, accessible, and interoperable metaverse, and what are the implications for user engagement and content creation within this digital ecosystem?

The inquiry probes into the viability of leveraging WebXR technology, alongside the integration of the A-Frame and Networked-Aframe frameworks, which enhance the WebXR ecosystem by simplifying the creation of interactive 3D content and enabling real-time, multiplayer experiences across various devices.

Researchers started to identify WebXR, A-Frame, and Networked-Aframe as promising technologies for the metaverse in 2023, albeit with limited exploration in scholarly articles so far. Earlier works about Networked-Aframe and virtual worlds such as […] (without mentioning the metaverse) date back to 2019.

Dziwis, von Coler, and Porschmann [9] ventured into the realm of networked, immersive, and shared virtual environments for live coding performances, introducing two browser-based live coding languages for real-time, collaborative experiences within metaverse systems. This initiative not only showcases the utility of metaverse environments for artistic expression but also highlights the growing interest in integrating more interactive and immersive elements into these platforms. At the same time, the authors developed Orchestra [10], an open-source toolbox designed for live music performances within web-based metaverse environments, which were further explored by Tomasetti et al. [11].

Sobota et al. [12] presented a web-based educational cooperative virtual environment tailored for low-cost mobile VR headsets. This approach addresses the accessibility and cost barriers in educational VR, suggesting a wider applicability of these technologies in resource-constrained settings.

Earlier works by Scavarelli et al. [13] already recognized the importance of inclusive and social VR in educational settings, proposing frameworks that support accessible and collaborative content within social learning spaces. Their efforts culminated in Scavarelli’s thesis on a multi-platform virtual reality framework aimed at overcoming VR’s inclusion problem in learning environments [14].

Collectively, these studies underscore a growing trend towards the diversification of metaverse applications, ranging from music and art to education and collaborative workspaces. Despite the nascent state of research in this area, the body of work demonstrates a clear trajectory towards more immersive, interactive, and accessible metaverse experiences. The integration of advanced user interaction components, the development of tools for artistic expression, and the focus on educational and accessible VR solutions reflect a comprehensive effort to leverage WebXR, A-Frame, and Networked-Aframe technologies for a broad spectrum of metaverse applications.

The academic introduction of the term spatial computing is attributed to [15]:

In 2023, Apple stated: “Featuring visionOS, the world’s first spatial operating system, Vision Pro lets users interact with digital content in a way that feels like it is physically present in their space” [16]. Therefore, a spatial app is an app that needs a spatial operating system such as visionOS.

This paper introduces the concept of spatial web applications, i.e. spatial apps that do not need to run on a spatial operating system. To run a spatial web app, users merely have to open a URL. This can pave the way for creative frictionless experiences: for example, a user can scan a QR code (representing a URL) on a real world poster to launch a spatial WebXR app that transforms the poster into an XR app. Although no installation is required, app installation is still possible via features such as Progressive Web Apps (PWA) and “Add to Home Screen”, which allows mobile websites to open like native avoiding the Apple or Google App Stores. An app delivered as a regular web page will never have to be manually updated by the user, because it is sufficient for the developer to update the web page. Moreover, the app automatically benefits from browser distinctive features such as history or tabs, which are already well known to the general public.

Apple provides an example of “Hello world” in visionOS [17], i.e. a spatial app that shows a floating globe (Fig. 2); this downloadable Xcode project contains 180 files, for a total of about 250 MB of source code.

However, Apple Vision Pro also supports WebXR through Safari for visionOS, which allows the developer to create a spatial app without using Xcode and avoiding Apple’s review process. Instead of compiling a project of 180 files, WebXR does the same thing in very few lines of A-Frame code—even just one line—within one HTML document:

In general, a spatial web app basically consists of at least an HTML document with JavaScript, textures and 3D models. A minimal valid HTML page including the aforementioned code is available online,⁶⁶6https://www.giuseppemacario.men/webxr/hello-world where devices can also test the app.

All in all, this example shows some of the advantages of a WebXR spatial web app over a native visionOS app. Firstly, the app can run on any device and not just on Apple Vision Pro. Secondly, the source code of an HTML document is extremely light compared to a huge Xcode project, and does not need to be compiled. Furthermore, the spatial web app does not have to be distributed through an app store. The same advantages hold true for other non-Apple headsets.

The conceptual architecture, as illustrated in fig. 3, represents a layered approach to develo** spatial web applications. Each layer builds upon the foundational technologies:
1. JavaScript: Serves as the primary programming language, enabling the development of interactive web applications.
2. WebGL (OpenGL ES): Provides a low-level graphics API for rendering 2D and 3D graphics in the browser.
3. WebXR Device API: Facilitates direct interaction with XR hardware.
4. Three.js: Acts as a lightweight 3D library that builds on top of WebGL, simplifying 3D content creation.
5. A-Frame: Provides a web framework for building VR experiences, making Three.js accessible to web developers without deep knowledge of WebGL.
6. Networked-Aframe: Extends A-Frame for multiplayer experiences, enabling the development of a shared metaverse.

As seen in section II-B, the first three components are natively supported by web browsers; therefore, in fig. 3, they are encapsulated within a “browser” environment, indicating the stack’s capability to deliver immersive experiences directly through a web browser without the need for external applications.

According to the definitions provided in section II-A, persistence and multi-user concurrency are two key features of the metaverse. Besides, […]’s engineers described several “open problems” of WebXR […], which can be reformulated and classified into five groups: immersive web browsers, computer vision, geolocation, persistence, and multi-user concurrency. Let us see how these critical issues can be addressed and overcome in a state-of-the-art WebXR-based metaverse.

Following the conceptual architectural for spatial web apps, illustrated in fig. 3, a prototype was developed to demonstrate the practical application of the proposed stack. The prototype aimed to showcase a basic yet functional open metaverse environment, focusing on aspects such as user interaction, networked multiplayer capabilities, and cross-platform accessibility. The implementation phase of the research focused on leveraging […], an open-source project available on GitHub, as a prototype to demonstrate the practical application of the conceptual architecture for an open metaverse. […] represents a compelling example of how WebXR, A-Frame, and Networked-Aframe can be integrated to create immersive, cross-platform virtual environments. Through the implementation and prototy** phase, the goal was to demonstrate not only the feasibility of the conceptual architecture but also its practical value in creating accessible, immersive virtual environments. The implementation process encompassed the following steps:

The evaluation of the prototype aimed to assess both its technical performance and user experience to validate the effectiveness of the conceptual architecture for an open metaverse, as well as to understand the capabilities and limitations of employing WebXR, A-Frame, and Networked-Aframe in a real-world scenario.

The evaluation of the […] prototype, grounded in the proposed conceptual architecture for an open metaverse, provided significant insights into the practical application and potential of WebXR, A-Frame, and Networked-Aframe. This discussion elaborates on the findings, addressing the strengths, limitations, and implications for future research and development.

This work proposed a WebXR-based cross-platform conceptual architecture for develo** spatial web apps using the A-Frame and Networked-Aframe frameworks with a view to an open, accessible, and interoperable metaverse. A […] prototype was implemented and evaluated, supporting the capability of the proposed technology stack to enable immersive experiences across different platforms and devices. Positive feedback on ease of use of the immersive environment further corroborates the proposed approach, underscoring its effectiveness in facilitating engaging and interactive virtual spaces.

This research enriches the discourse on the metaverse by describing an architecture based on web technologies and open standards as opposed to proprietary technologies. By adhering to principles of interoperability and inclusivity, it lives up to Tim Berners-Lee’s vision of the World Wide Web as an open platform that transcends geographical boundaries, enabling creative and collaborative experiences in the digital realm.