AR op websites

Webshops – Education – E-commerce & more

home > Oplossingen > Augmented Reality on your website

webAR: webbased Augmented Reality

webAR: webbased Augmented Reality


The release of iOS12 (Apple) has made it easier to integrate Augmented Reality into websites. This is called inline-AR or webAR or webXR.

Why AR on your website?

Downloading an app to experience AR is no longer always necessary. You can now also experience Augmented Reality on the website with a browser. Most major browsers nowadays support Augmented Reality. Ideal for web shops, E-commerse and education. Put a 3D model of your coffee machine on your website and the customer can see how that works at home.

Social-media and AR

The importance of immersive visual communication for the social media channels and websites is now ever greater. For example, in addition to Augmented Reality on your website with inline AR, you can also create AR (or have it made) for Facebook with Spark AR studio.

WebAR, print media and advertising

Where printed advertising has had to sacrifice, WebAR can add value again with its interactive dimension to print media. It is not very difficult anymore to add webAR to your website. All you need is a piece of HTML code and of course a 3D model of what you want to show.

Call-to-action

Then you must clearly state the “call-to-action” on your website (or in print media). A desktop cannot show AR, a smartphone can. So you will have to entice the visitor to go to your mobile website. Nowadays easy to do with the help of a QR code, which everyone knows by now.

AR and VR Crash course

If you don’t know the difference between AR and VR: At its core, the next generation of computing is all about sensory experiences. Both AR and VR play an important role in this. Then it is about computers learning about reality: Teaching computers about reality. In the case of Augmented Reality, we teach the computer how the real world works. We then add AR in the form of digital visualisations to this computer-perceived environment. In the case of Virtual Reality we see a completely computer generated and simulated world instead of our own real environment. So it is a Virtual Reality.

Links 2 AR voorbeelden, Rechts 2 VR voorbeelden.

No more app downloads

You use the camera of your smartphone (or tablet) to experience the AR of your products. As an entrepreneur ideal to show your sofa or cabinet at the customer’s home without having to be there. As a customer you don’t have to go outside to the store. You will no longer have to download the IKEA place app. The AR is simply integrated in the IKEA webshop.

Via the browser

Web shops (such as made with Magento) can integrate Augmented Reality products into their website. The customer can first view the possible purchase in AR in his own home or office. The product can also be viewed in 3D on your desktop or laptop. Just like here on this page.

web- & social AR: International Film Festival Rotterdam
Tiger on the Loose! During the International Film Festival Rotterdam you can -at your own risk- enter the film world of the tiger with web-based AR (Augmented Reality).
Check it out!

WebAR is also ideal for education and teaching

Augmented Reality is a valuable addition to many existing web pages. For example, it can help people learn better and enable potential buyers to visualize products in their home while shopping. With webAR, users can experience an almost lifelike display product as if it were actually there, ideal for education and training.

How does webAR work ?

WebAR provides access to web-based Augmented Reality through the web browser and web pages using a combination of technologies including WebRTC, WebGL, WebVR and the other modern means.

How do you use webAR?

You can view the 3D model on your smartphone and convert it to Augmented Reality via a button. You place the AR experience using a button on the web page via the smartphone. You then first scan the flat environment such as a floor or table top. You will see the model appear transparent. Then by touching the screen you place the 3D model. The AR experience remains in place because the software “understands” the environment. You can now move around it or experience it up close or further away. The AR therefore uses the floor and surroundings as a reference to position itself. The underlying technology is ARkit (Apple) and ARcode (Android).

It gives customers a better understanding of products than is possible with a two-dimensional image such as images.

WebAR examples

Here you see a number of 3D example models that you can put on your site. It could be a closet, a chair, a pair of sneakers, a car or model train. This already looks great on your site anyway. If you are viewing this page on your smartphone, tap the AR logo at the top right. Scan the QR code on the right with your mobile. Then you will also come to this page. Then you can view the model in AR. You can also go directly to it, then scan the QR code that you see when you touch the AR icon.

Thgis couch in your livingroom?

QRcode for webAR

Scan for AR!

You are now on the desktop. Do you want to view this 3D in AR? Then go to this page on your smartphone or scan the QR code for a direct link. On your mobile, tap the AR logo at the top right to activate the AR.

Conversion with AR and online media

Since the user can experience WebAR on their phone through a browser without having to install an app, it will be much easier for the user to convert. By introducing a call to action during the WebAR experience, we can make it easier for users to identify with a brand because it is stored as a real experience (emotion). Not only in combination with printed media but also on E-commerse we will see a strong increase in WebAR.

How usable is WebAR?

As digital marketing and social media have become purposeful and cost-effective, the more traditional print media marketing methods seem to be pushed aside. The print media has had to give up considerably, just think of newspapers and television guides. WebAR can add value to this print media. Interactive print media is more than a QR code. Augmented Reality provides personalized and interactive “real” experiences.

Note. Keep in mind that webAR is compatible from iOS 12 (iPhones and iPads) and Android from version 7.0 (Nougat). You can find more about Android compatibility here.

More information about webAR

Visuele communicatie in het Corona-tijdperk
Het belang van goede visuele communicatie is belangrijker dan ooit. Kwalitatieve 3D animaties en webAR spelen een belangrijke rol.
Lees update