Blog
Face Tracking

Getting Started With Web AR Face Tracking

Explore the possibilities and limitations of Web AR face tracking and discover some of its most prominent use cases.

face tracking

Web AR face tracking is actively gaining popularity. It can quickly immerse users into the brand’s communication campaign providing instant access to the AR experience where users only need to enable the web camera. For online retailers, Web AR is a great opportunity to give potential buyers an understanding of the product, improve online product discovery and increase satisfaction from the product choice. Here we explore the possibilities and limitations of Web AR face tracking and discover some of its most prominent use cases.

Understanding Web AR Face Tracking

Banuba Web AR face tracking lets you embed augmented reality experiences on a website and display them in real-time on the face via the web camera. Users can overlay fun face filters or realistic virtual try on, apply beautification effect that reduces noise and improves the quality of camera experience.

With Web AR face tracking, users don’t need to install any app to experience digital content. AR can be viewed and shared through mobile and desktop web browsers providing a fast and smooth user experience.

Try Web AR

Advantages of Web AR face tracking vs native app


Instant access to AR content

The key advantage of Web AR face tracking is that it doesn’t require users to install any apps. Users can click on a link to open a page in their browser or press the “Try On” button on the product page, activate their web camera and instantly experience AR content.


Data privacy

There have been many debates around the data processing and collection in some face tracking apps, raised by the public. Many consumers still are reluctant to download and grant permissions to apps as they don’t want to allow access to their personal data, which creates a barrier to software product adoption.

Banuba’s face tracking does not collect, store or access user data, images and videos taken with the user camera. Video processing occurs on a user device which means no user content or data is sent to our servers, therefore, we have no access to it both on Web AR or in mobile apps.


Motivation to experience AR

Downloading an app involves higher motivation from the user as it requires free space on the device and passing the onboarding. Users need to understand what benefits they will get from the app, and unless it’s something prominent, they may give up on their intention to experience AR.

Web-based augmented reality technology helps to solve that providing on-the-spot, fast and frictionless access to the digital content, helping the user to complete his task, e.g. find the best-fit pair of glasses or entertain playing browser games with AR.


Easier than building an app

Web AR solution implementation requires less time and effort spendings compared to native app development. To add face tracking to the website, you need to connect the Web AR face tracking library and implement the content component. The basis can be an existing site, which also makes the development more simplified.

Web AR Face Tracking Applications


1. Virtual Try On for Web

The audience of the online retailer’s site is already potentially ready for the purchase and has a clear intent, unlike the audience on social networks. The opportunity to see how the product will look like and try it on virtually can greatly influence the decision to buy, here and now.

Virtual Try-On

Web AR face tracking lets retailers embed virtual try on experience for glasses, hats, jewels or contact lenses. Our technology allows for a realistic representation of virtual objects and their natural behaviour in size, color and texture. 3D objects support physics and real-world lighting helping consumers get the right look and feel of the product and make a decision about the purchase.


2. Virtual Makeovers on Web

Virtual makeovers and online makeup tools help consumers discover makeup products and their best beauty looks. Above beauty try on, Web AR face tracking allows for implementing real-time How-tos and product instructions for makeup application or helps to visualize daily.

Virtual makeovers and online makeup tools help consumers discover makeup products and their best beauty looks. Above beauty try on, Web AR face tracking allows for implementing real-time How-tos and product instructions for makeup application or helps to visualize daily.

The Shopify online commerce platform that first introduced the ability to view products in augmented reality, shows the impact of AR on consumer behaviour:

  • Users who watched the AR version of the product were 44% more likely to send the product to the basket
  • 27% more often place an order
  • Made purchases 65% more often.

3. Richer Advertising 

Over the years, the mechanics of face augmenting and filtering won the love of users, in particular, due to the popular social network Instagram and the release of Spark AR editor that does not require knowledge of the development basics.


4.Brand Storytelling

Face filters in a web browser give an advantage to brands, developers and users - there's no need to download the application. Browser-based augmented reality and face tracking can expand the boundaries of perception of content, taking the viewer away from the usual 2D photo and video formats. Interaction with 3D makes it possible to immerse the user in the story that you want to present in a new and accessible way.

touch based face filter-1Banuba Face Filter example: Spider-man

Here are some examples and use cases:

  • Promote new movies allowing visitors to turn into famous characters 
  • Event-based marketing campaign 
  • Branded filters featuring its identity or product
  • Drive attention and communicate brand's mission letting your audience snap a photo with a filter and share on social networks
  • New product advertising campaigns 

5. AR-browser Games Based on Face Tracking

Augmented reality face tracking can be used to enhance the gameplay and add immersion. Users can overlay masks of their favourite game characters and play as live digital avatars. 

Avatar-1Banuba Avatar technology example

Web AR limitations


Browser support

Unlike mobile devices and platforms, not all browsers can support face tracking and the display of AR content. Our technology runs on Chrome and Firefox, however, bringing it to Safari turns out to be a challenge we're about to solve.


Functionality

So far, web browsers are not ready to show the quality and variety of Face AR content, like mobile applications. At the stage of developing an idea, it is necessary to take into account the optimization of each object and its interaction with them.


Video taking

At the moment, it’s problematic to add a “video recording” button to the browser, which can usually be easily integrated based on the application. Therefore, in most Web AR solutions you only see the “take photo” button.


Internet access

Web AR face tracking requires a stable connection to wi-fi so users could experience AR to the fullest. This is one of the most important conditions, which still leads over the speed of the Internet required to download the application from the store.


Browser support

Unlike mobile devices and platforms, not all browsers can support face tracking and the display of AR content. Our technology runs on Chrome and Firefox, however, bringing it to Safari turns out to be a challenge we're about to solve.


Functionality

So far, web browsers are not ready to show the quality and variety of Face AR content, like mobile applications. At the stage of developing an idea, it is necessary to take into account the optimization of each object and its interaction with them.


Video taking

At the moment, it’s problematic to add a “video recording” button to the browser, which can usually be easily integrated based on the application. Therefore, in most Web AR solutions you only see the “take photo” button.


Internet access

Web AR face tracking requires a stable connection to wi-fi so users could experience AR to the fullest. This is one of the most important conditions, which still leads over the speed of the Internet required to download the application from the store.

Getting started with Web AR face tracking

Consider implementing a Web AR experience based on the user face?  Explore how you can empower your website with Face AR features.


Web AR features

  • Basic Face AR SDK Kit
  • Multi-Face Tracking
  • Virtual try on for facewear: glasses, hats, jewelry
  • Virtual makeup try on (without lipstick)
  • 24 action units support for Avatar implementation

Browsers support

  • Chrome browser for Android, WinOS, MacOS.
  • Safari (coming soon)

Requirements

  • The latest Web AR release. You can get it emailing to us and requesting a Web AR trial.
  • Any local web server, e.g. Nginx.
  • The browser with the support of WebGL 2.0 and higher.

    Get in Touch
Top