How to get AR to work?

Hi community,

I am really interested in creating an app with markerless AR. It’s possible due to createDefaultXRExperience() but it’s not possible to use it properly since immersive webXR isn’t supported by most smartphones yet.

I stumbled across 8th Wall Web. They showed that you can use AR with Babylon JS (YouTube). How is that working? Is it possible to achieve something like this without using their service which costs minimum $100 per month?

Thanks for your help.

Best

The 8th wall has a collection of CV tools to enable AR on any device they support. They practically implemented ARCore/ARKit’s functionality for the browser. For that service they are more than allowed to charge whatever they want :slight_smile:

Babylon has its own set of CV/AR tools, located at GitHub - BabylonJS/BabylonAR: Home of the Babylon.AR project and created by the awesome @syntheticmagus.

Apart from that, WebXR is expanding rapidly. There is a small hint of support from apple, and firefox webxr viewer is available for iOS already - Firefox-based 'WebXR Viewer' Brings Browser-based AR to iOS . Apart from that, most android devices (I would say 3 years old and newer) should be able to support AR apps out of the box when using the native browser. The current available tools - hit-test, anchors and plane detection are working great.

2 Likes

Thanks for your reply, Raanan.

Of course I understand that they are allowed to charge people using their service. Nevertheless I like to look also for other alternatives. But it seems there aren’t many that support markerless AR.

I already use the WebXR Viewer on my iPhone for experimenting with AR and it works well. Unfortunately I can’t expect from other users that they download this app to use my application. It has to be just as easy as with 8th wall.

So I have the following options:

  1. I wait for WebXR support for all browsers and devices and go with the CV&AR tools of babylon.
  2. I use 8th wall.

Do you have other possibilities in mind?

Best

Hi samevision,

In addition to 8th Wall’s proprietary solution, there are a few open source implementations of SLAM (the computer vision problem underlying markerless tracking for AR and related purposes).

  • Microsoft (with help from the Babylon team :slightly_smiling_face:) recently open-sourced MAGE-SLAM, an RGB-based SLAM implementation that has been used for AR-style prototypes in the past.
  • If the GPL license isn’t an obstacle for you, Raul Mur-Artal’s implementation of ORB-SLAM 2 is available from his own repository.
  • There are likely others as well; I’m less familiar with them, but many academics who create SLAM algorithms for research papers subsequently open-source their implementations and provide links alongside their papers.

Both of the implementations referenced above are C++ codebases, and neither (so far as I know) has been adapted to be run in a browser – so far. :upside_down_face: The fastest approach to getting such an algorithm running in a browser would be to compile it to WASM, solve any resulting performance problems, then connect it to something like Babylon.js to interpret and display the results. There’s a lot of work required to make that happen, and the effort would involve a lot of highly specialized skillsets and tools.

So, as “other possibilities” versus WebXR and 8th Wall go, I think using an open-source SLAM implementation definitely wouldn’t be easy. It is, however, (probably) a possibility.

Best of luck!

1 Like

Hi syntheticmagnus,

I appreciate your reply. I completely believe that it isn’t easy to use the SLAM implementation. I would love to do it but my skill level is way to low for something like this.

Using 8th wall would be much more convenient for me to use. Otherwise I noticed that google offers a model-viewer (https://modelviewer.dev/) which allows to enable AR for models easily. In my case it is enough to display the model. It’s not necessary to have physics, etc.

Do you have any suggestions how to combine babylon with it? I imagine to build the whole app with babylon but by clicking a GUI button the AR functionality of model-viewer starts.

Best

I gave it a try and modified the model-viewer files to work without canvas and any other features. It just loads the model in AR directly after clicking the button. It’s still just a model viewer but it works for ios. That may be enough for some people. Android is not working right now.

https://playground.babylonjs.com/#2F2CT0#10

1 Like

Android has native AR support. iOS/Apple IS the problem… So if you solved the problem (as opposed to apple), seems like you are on the right path.

1 Like