We’re starting a new series, periodically highlighting new tools and advancements that help to build immersive experiences on the open web. Look for more of these posts in the tools category. These can be new products, significant updates, or simply new discoveries.
A-Watch
A small library for building watch-like user interfaces in a-frame, supporting hand tracking. There is even a demo, and here is the announcement tweet with a brief video.
Gaussian Splat support for Three.js
Three.js is the basis for a lot of immersive web experiences, including a-frame. drei-vanilla is a collection of threejs modules and helpers, and they just released a splat module, which allows for the inclusion of multiple splats in a scene with the <Splat src={url} /> syntax.
3D comic dioramas with Needle Engine
This one is not a new tool, but an interesting use of an interesting tool.
Las Vegas Sphere with custom shaders
The Sphere in Las Vegas is a super cool engineering project. Weirdly enough the public reaction seems to focus more on the external part, which is being used for ads, and meta-ads like this one:
Developer Alexandre Devaux (who regularly posts super interesting webXR projects, check out this splat experiment of his) created a threejs page in which one can apply an arbitrary shader to the sphere. There are 5 examples, and you can also write your own, or copy-paste from the Hacker News thread, the smiley face is an highlight.
JSAR DOM
This one is a little exoteric. There is a company called Rokid, they make AR glasses and some pretty interesting software to go along, especially related to human-computer interaction. They seem to have several laboratories, one of which is called M-CreativeLab, and they run a project called JSAR, which is somehow related to the YodaOS used on the Rokid AR glasses. They have developed XSML, yet another 3D HTML-like language, SCSS, a spatial version of CSS, and a TypeScript runtime. Combined together these allow for the creation of web-based 3D scenes that can be embedded in a website or inside a native application. There is support for Babylon.js and Unity, and a Visual Studio Code extension.
There are a couple of demo scenes in their GitHub repository, which can be tested in a XSML runtime. For example we can go here: https://github.com/M-CreativeLab/jsar-gallery-flatten-lion, copy the CDN link https://cdn.jsdelivr.net/gh/M-CreativeLab/jsar-gallery-flatten-lion@main/lib/lion.xsml and paste it into the runtime hosted here: https://m-creativelab.github.io/jsar-dom/
We’ll get the scene in the Babylon.js inspector. The cool thing is that the XSML file is very easy to understand, for anyone who knows HTML.
As a personal aside, my one point of criticism is how much of the documentation, and even how much of the code, is written in Chinese. I strongly believe that computers should be used in English, and that having a lingua franca for technical work is extremely important, but I suspect this is now considered part of my 90s techno-optimism. Coming from a native English speaker it would also probably sound like some sort of xenophobia, luckily that’s not the case.
Simulate 3D plants in the browser
Extremely interesting plant simulations by undergrad (serious kudos!) Max Richter. The graph editor is so nice to play with!
Leave a Reply
Only people in my network can comment.