A declarative framework for creating virtual reality games.
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>XR-Tag Demo</title>
<style>html,body{overflow:hidden;width:100%;height:100%;margin:0;padding:0;}</style>
<script type="module" src="https://esm.sh/xr-tag@0.1.0/register"></script>
</head>
<body>
<xr-scene id="scene">
<xr-camera id="camera" type="free" position="0, 5, -10"></xr-camera>
<xr-light id="light" type="hemispheric" direction="0, 1, 0" intensity="0.7"></xr-light>
<xr-sphere id="sphere" position="0.0, 1.0, 0.0" radius="1"></xr-sphere>
</xr-scene>
</body>
</html>Declarative🦢 • XR-Tag makes it easy for anyone to create their own games. Thanks to HTML, you can focus on what you want, not how to do it.
Data-driven🎯 • Data is the heart of every video game, and XR-Tag was designed with this in mind. Simply describe where you want your data to flow from and to, and we'll take care of the rest.
High Performance🚀 • The highest priority of XR-Tag is to provide immersive experiences. Even the tiniest bit of latensy can ruin your entire game. By using Babylon.js, XR-Tag does everything it can to coax the maximum amount of performance out of your system.
Cross-platform🌎 • XR-Tag works in every browser and headset. Even if AR or VR is unavailable, XR-Tag games will still play fine in 3D.
Modern Standards🧑💻 • Features like ESM and Web Components are powerful and highly optimized tools that are essential for developer ergonomics. The web always wins in the end, so XR-Tag tries to work with it rather than against it.
Written in TypeScript🚸 • Type-safety is non-negotiable for developing a large-scale project. XR-Tag was designed to scale, and a large part of that is making sure TypeScript is enabled for creating and customizing new elements.
Accessible♿ • One of the biggest under-explored opportunities of VR is the chance to allow people with disabilities to play, and XR-Tag intends to correct this.
To run the Smilophobe demo, first clone the repository and build the project:
npm install
npm run buildAfter that, run Smilophobe from the demos/ folder:
cd demos
cd smilophobe
npm install
npm run devAfter that, open http://localhost:5173/ in a web browser. Please note that WebXR requires HTTPS unless localhost is being used.
XR-Tag needs your help to survive. Please consider donating or funding XR-Tag to continue development.
- Should package name include a namespace (
https://esm.sh/@xr-tag/xr-tag@0.1.0/register,https://esm.sh/@xr-tag/core@0.1.0/register)? - Rename
object3Dmember tomeshbecause the former only comes from Three'sObject3Dclass?
Copyright © XR-Tag authors.
Available under the MIT license.