WebXR Wars

Interesting piece in Immersive Web Weekly on the "rift" between the Oculus/Chrome implementation of WebXR and the Firefox/HTC/others version. 

Today XR headset makers face a tough choice among immersive browsers: invest a considerable number of people to maintain a custom Google Chromium-based browser with great WebXR support (as Facebook does for the Quest) or port a Mozilla Gecko-based browser like Firefox Reality and deal with XR support that hasn't changed in any substantial way since Mozilla's Mixed Reality team was laid off more than a year ago.

Last week Shen Ye followed the path of the Pico team in revealing that HTC's new Vive Flow headset will ship with Firefox Reality and Stan Larroque also announced in a YouTube livestream that the Lynx team is working on a Firefox Reality port for their headset.

HTC, Lynx, Pico and Mozilla do not intend, as far as I can tell, to update Gecko's WebXR implementation. The divergence between Chromium- and Gecko-based browsers has already fragmented the fetal immersive web, forcing developers to choose between supporting only one browser engine or writing what is effectively two separate rending and input handling paths for their code. If we want a healthy and open immersive web then this must change.

(editor's note for transparency: I was the original product manager for Firefox Reality but left Mozilla before the layoffs. I have donated to the Mozilla Foundation for more than a decade and continue to do so but have no equity or other financial ties.)

We've bumped into this at Daden when looking at using Pico for a potential project. Pretty typical of the industry, agree a new standard and then immediately split it in two!

Introducing Daden Hub - Daden's new virtual home in Mozilla Hubs

 

We've just launched Daden Hub - Daden's virtual home in Mozilla Hubs. 

This 3D environment lets you find out about Daden and what we do, play with some of the Mozilla Hubs tools, and follow teleports to some of our other builds in Mozilla Hubs. 

We are increasingly using it instead of Zoom for some of our internal meetings, and don't be surprised if we invite you into it for external meetings too!

You can visit Daden Hub now in 2D or VR at https://hubs.mozilla.com/SJy5Hwn/daden-hub. 

Here's a short video giving you a tour of the Hub.

Give us a shout if you'd like to meet up in the space and get a more personal demo!

NASA's Perseverance Rover in Mozilla Hubs

 

What better way to celebrate the (hopefully successful) landing of NASA's Perseverance rover on Mars than by looking at it in Mozilla Hubs!

NASA wonderful model library at https://nasa3d.arc.nasa.gov/ not only has a nice model of Perseverance but its also a) a reasonable size and b) in the .glb format preferred by WebXR apps likeHubs - this is great news if NASA is now standardising on this format. The model is about 4x the recommended Hub size, so mobiles may have issues, but it loads in 20s or so.

As this is a quick build we've just dropped the model into our existing "mars-like" terrain. We checked it for scale and it looks pretty much spot on. We've not added any interpretation boards - we may do that later. 

If you're in VR then you can have great fun getting on your hands and knees to look under the rover - although we couldn't spot Ingenuity.

The model is at: https://hubs.mozilla.com/o3c26nJ/perseverance-mars-rover with a room code of 817861 if you're using a headset.

Remember that since this is WebXR you can just click immediately on the link above to go to Mars in your browser, no need to download or register, and it works with or without a VR headset.

Have fun, and do let us know how you get on in the comments and/or post images on Social Media and share with friends.

And don't forget to also check out our SpaceX Starship Hub room to look at the next generation of Mars spacecraft. That's at https://hubs.mozilla.com/SMUKcDy/starship-test. 

Update: Here's a video of the rover from inside our VR headset:

SpaceX Starship in MozillaHubs

 

MozillaHubs is designed to be a relatively low-poly environment so as to have speedy downloads and to work on mobile devices and standalone VR headsets.

Having been quiet pleased with the size of terrain mesh we could bring into MozillaHub we decided to try and use a more substantial 3D model - in this case of Elon Musk's SpaceX's Starship spacecraft. The model is by MartianDays on Sketchfab, and whilst not the highest rez (we were trying to avoid that!) it does look pretty good. For the record it's 20,600 triangles, which compares to 1.2 million (!) for a hi-rez model.

Again we're quite impressed at how well its come in. Load times are pretty variable from 30s to 1 minute, sometimes 2 minutes, but it displays very smoothly once you're in there. And with a VR headset on, looking all the way up to the top you get a real sense of the scale of the thing. We've lifted it off the ground so you can walk underneath to see the Raptor engine bells.

If you want to take a look - in a browser or in VR -  go  to:

https://hubs.mozilla.com/SMUKcDy/starship-test

The hub.link code is 416509 for easier access in VR.

Social Virtual Worlds/Social VR

The last couple of years have seen a dramatic increase in the number of social virtual worlds around. We define such platforms as internet based 3D environments which are open to general use, are multi-user (so you can see and talk to other people) and within which users are able to create their own spaces. The worlds are typically accessible by both a flat screen (PC/Mac, and sometimes mobile/tablet) and through a VR headset.

At Daden we’ve been using these sorts of environments since the early 2000s. What is really beginning to change the game now is the emergence of WebXR social virtual worlds. These are completely web-delivered, so you only need your browser to access them (from PC, mobile and even VR headset), so there is no download, minimal differences between platforms and really easy access. They are emerging as a great way to get people off of Zoom and into somewhere more engaging for whatever social or collaborative task you need to do. The key examples at the moment are probably Mozilla Hubs and Framevr.io.

Below we highlight some of the key affordances, benefits and uses of these WebXR Social Virtual Worlds.

• Fully 3D, multi-user, avatar based, with full freedom of exploration​
• In-world audio (often spatial) and text chat
• Runs without any download – and even on locked down desktops
• Graphics optimised for lower bandwidths and less powerful devices
• Out-the-box  set of collaboration tools, eg*: screen-share, document-share, whiteboard, shared web browser (*depends on world)
• Free access model for low usage, many also open source
• Developer ability (us) to build custom environments
• Limited scripting ability at the moment
• Give meetings more of a sense of “space” than video calls
• Use environment and movement to help anchor the sessions and learning in memory
• Help train what you can’t usually teach in the classroom
• Excite and engage students and employees

We're also working up an analysis summary tool to describe the capabilities of social virtual worlds (and similar spaces), and a comparison between them - watch this space and read the earlier blog post.

If you'd like to know more about business and educational use of Social Virtual Worlds and their underlying technologies then do get in touch and we can arrange a chat and live demo. We'll also be posting some live spaces here shortly, and you can also read about (and see some demos of) the the WebXR technology that underlies these worlds on our WebXR page.

​

Immersive 3D Visual Analytics in WebXR

Whilst this application was originally built as a side project it shows some principles and ideas which are probably worth sharing here. The application uses WebXR to display data in VR. The data is fetched from a web service, and the user can choose what data parameters are used on two of the point features, in this case size and height.  The key thing about WebXR is that it lets this visualisation run in a VR headset without any download or installs. Just point the in-built browser at the URL, click on Enter VR and the browser fades away and you are left in a 3D space with the data. 

The data itself is the star map used in the classic GDW Traveller game (think D&D in space) - but as we say the data isn't important, just the novel interaction.

To try out our Data Visualisation in WebXR just use the browser in your WebXR compatible VR headset to get to this page, and then click on the link below. Once the new page loads just click on the Enter VR button. 

Traveller 3D Map

​Note that whilst the page will open in an ordinary browser you won't be able to do much. But watch the video here to get an idea:

You can also read more about 3D Immersive Visual Analytics and the differences between allocentric and egocentric visualisation in our white paper. 

World Space Week - WebXR Solar System playground

 

Normally at this time of the year we'd be down at The Hive in Worcester for the BIS World Space Day event - the largest of its kind in the UK. Of course with COVID19 that's not happening, so here instead is a little "work in progress" of a solar system playground in WebXR. You can't view this on the web, but if you have a VR headset that is WebXR compatible (most of them now) you can use the headsets web browser to go to:

• https://www.daden.co.uk/webxr

Then follow the Solar System Playground link from that page to the WebXR page, click on the Enter VR button, and immerse yourself in the Solar System.

This is a quick tour of what you should see and what you can do:

The main features are:

• Set sizes of planets to linear or log scale
• Set orbit sizes to linear or log scale
• Just grab hold of a planet to bring it up close to look at it, and turn it over in your "hands"
• Display labels on planets and/or audio naming as you click on them
• Randomise planet positions, sort them into order, and then have your solution scored
• Hide the floor (not for those with vertigo!)
• Move with joystick or by clicking on the footsteps
• Set sizes and orbit sizes to "real" values, scaled to the sun. This make things VERY small and VERY spread out. There's a guideline to help you find all the planets, and Pluto (and maybe Neptune) might actually be outside of the "star" bubble - feels very otherworldly that far out!

Note that this is still a work-in-progress and may have a few bugs, but with World Space Week happening and lots of us in some sort of lockdown we thought it a good time to get it out!

Any bug reports or comments for improvements in the comment or by email to wsw@daden.co.uk.

Enjoy, and hopefully we can meet physically for World Space Week next year!

Garden VR

OK, why has it taken me 4 months of lockdown to realise that I've got the ideal room-scale VR space out in my garden! Having thought of the idea I did have some doubts about a) were there too few straight lines for it to manage the tracking, b) would rough grass flag as intruders in the scene and c) what happened if the dog walked through, but in the end it all worked swimmingly.

Wifi reaches about half way down - so that may be an issue, although I found it hard to draw out more  the first half the garden as a space. Oculus kept putting its "draw boundary" panel right where I was looking and walking and drawing didn't help - but I'll see if I can do better another time. I ended up with a space 15 paces by 7 - far bigger than the attic (and no slopey ceilings).

The image below shows a rough mapping of the space to the WebXR demo room - so I could walk about half of it (Oculus hides the warning barriers in photos - annoying in this case as I'd set myself up to show the exact extent!)

After that everything worked just as though I was indoors - apart from the occasional need to walk back closer to the recover the wifi. I certainly lost all sense of where I was in the garden and alignment, the soft grass didn't interfere with the immersion, and the slight slope up to the house end was a useful warning!

Not related to being in the garden I did notice that I felt more latency/unease with the 3D photospheres (and even more with the stereophotospheres) than with the true 3D spaces - where I felt none at all. Perhaps one reason why there were a lot of reports of unease with VR is a lot of people were having photosphere experiences - although admittedly true latency issues remain (but made worse by doing "crazy" things in VR - like rollercoasters - rather than just walking around in a room!

One experience which was heightened was the Mozilla vertigo experience - walking on ever smaller blocks over nothing. I suppose because I could move more in the garden I could better explore it and fully immerse myself in it - and it certainly made me check I could feel grass under my feet before I stepped - particularly when I just stepped off the blocks and into space.

Anyway all the space allowed me to have a good walk around the solar system model without using teleports and actually get the planets lined up for the first time! Even in the garden they are proving too big so need to at least halve the sizes!

Further Adventures in WebXR - Playing with the Solar System

Having a bit more of a play with WebGL/WebXR and now have a nice draggable solar system! Could be a neat learning tool once finished to get the planets in the right order, too  look at their globes in more detail, and perhaps access further information about them. With World Space Day/Week going virtual might be time to set up a gallery of experiences for people to try that week. 

Need to sort a few more things first though - like rings for Saturn, a starscape backdrop, and change the highlight colours. Maybe also the option to check your order and give the you the right one. Also need to add a sun, and shrink the planets even further!

The more we play with WebGL/WebXR the more excited we are by it as a tactical solution, quickly creating small but powerful bespoke VR experiences that can be instantly accessed by anyone with a WebXR compatible VR headseat without any need for an install!

DadenU Day: WebXR

MozVR Hello WebXR Demo Room

For my DadenU Day I decided to get to grips with WebXR. WebXR is an new standard (well an evolution of WebVR) designed to enable web-based 3D/VR applications to detect and run on any connected VR or AR hardware, and to detect user input controls (both 6POS and hand controllers). This should mean that:

• You can write and host VR applications natively on the web and launch then from a VR headsets built-in web browser
• Not worry whether its Oculus, HTC or A.N.Other headset, both for display and for reading controllers
• Have a 2D/3D view automatically available in the web browser for people without a VR HMD.

What WebXR does NOT do is actually build the scene, you use existing WebGL for that (essentially a 3D HTML standard, not to be confused with WebXR or WebVR!) through something like the Three.js or A-Frame frameworks.

There's a good introduction to WebXR at: https://developers.google.com/web/updates/2018/05/welcome-to-immersive#what_is_the_webxr_device_api

To get a good sense of what web-delivered VR (via WebXR) can do I headed over to Mozilla's demo at https://blog.mozvr.com/hello-webxr/. This room has a bunch of different demos, and a couple of "doorways" to additional spaces with further demos. If you view on a 2D browser you just see the room, but can't navigate or interact (don't see why WebXR should pick up ASDW same way as its picks up a 6DOF controller). If you go to the page in your Oculus Quest (or other) browser you also see the same 3D scene in 2D. BUT it also offers you an "Enter VR" button, click this and your VR lobby and the 2D browser disappears and you are fully in the VR space as though you'd loaded a dedicated VR app. Awesome. In the space you can:

• Play a virtual xylophone (2 sticks and sounds)
• Spray virtual graffiti
• Zoom in on some art
• View 360 photospheres - lovely interface clicking on a small sphere that replaces the VR room with a full 360/720 photosphere. I'd always been dubious about mixing photospheres and full 3D models in the same app but his works well
• View a stereoscopic 360 photosphere - so you can sense depth, pretty awesome
• Enter a room to chase sound and animation effects
• View a really nice photogrammetry statue which proves that web VR doesn't need to mean angular low-rez graphics 

MozVR Photogrammetry Demo

There's a really good "how we did it" post by the Mozilla team at: https://blog.mozvr.com/visualdev-hello-webxr/

Having seen just what you can do with WebXR the next step was to learn how its done. For that I went to the WebXR sample pages at https://immersive-web.github.io/webxr-samples/

Although thee are a lot simpler than the MozVR one, each shows how to do a particular task - such as user interaction, photospheres etc. You can also download the code and libraries for each from GitHub at https://github.com/immersive-web/webxr-samples.

Movement demo

Controller demo

The only downside of these seems to be that they use Cottontail - a small WebGL/WebXR library/framework purely developed for these demos and not recommended for general use - so adapting them to your own needs is not as simple as it would be if they were written in Three.js or A-Frame.

Keen to actually start making my own WebXR I started by copying the GitHUb repository to my own server and running the demo's up. Issue #1 was that any link from a web page to the WebXR page MUST use https, using http fails!

Starting simply I took the photosphere demo and replaced the image with one of my own. The image had worked fine on the photosphere display in Tabletop Simulator but refused to work in WebXR. Eventually I found that the image had to be in 2048x1024, higher resolutions (but same ratio) fail. Also the photosphere demo is for stereoscopic photospheres so you have to remove the " displayMode: 'stereoTopBottom'" parameter.

Hougoumont Farm at Waterloo in WebXR Photosphere

Next up was to try and add my own 3D object. I liked the block room in one of the demos and worked out how to remove their demo blocks form the middle, and to hide the stats screen. Nice empty room loaded up. Then I hit the bump that I usually write in Three.js or A-Frame and I could't just cut-and-past into their WebXR/Cottontail template. Then I ran out of time (it was Friday after all!)

I've now found a page of really basic Three.js WebXR demos at https://threejs.org/examples/?q=webxr so the aim for this week is to get those working and start on my own WebXR spaces.

It's obviously early days for WebXR, but given the MozVR demo this really could be a lovely download-free way of delivering both 2D/3D to ordinary browsers, and full VR to headsets without any downloads. Joy!