Augmented reality has already proven its positive impact on many businesses. One of the latest trends is so-called WebAR. Indeed, what can be easier than just opening the web page for instant immersive experience?

Project Description

The goal of this project was to develop and optimize the image detection and tracking algorithm for AR applications. The main challenge was to make it work directly in the mobile web front-end with all computations done on the edge.

Technical Aspects

To avoid dependence on internet connection and potential lags, we have built an efficient data processing pipeline for web front-end deployment. Firstly, a custom C++ code was developed for content-based image retrieval and tracking. Secondly, we modified and recompiled the C++ code to the WebAssembly binary code using Emscripten SDK to run it directly in the browser. Finally, the algorithm was fine-tuned and optimized within the Emscripten to ensure proper performance on the web.

WebAR Infrastructure Overview

The image processing engine was just a part of the overall WebAR system. Here is a high-level overview of the created infrastructure:

In principle, the architecture of such systems is similar to a common SDKs for mobile AR. The key difference is in the way how it runs in browser. A huge advantage is that you do not need to install any application. Moreover, the WebAR front-end works in both mobile and desktop browsers.

The demo below demonstrates how our WebAR solution works.

If you would like to read more about It-Jim’s WebAR development, please check the blog post and our paper.

Interested in building your own WebAR system or boost your business with cool content in the browser?  Let’s discuss! Use the form below to get in touch with us.

WebAR: Augmented Reality in Web