Sometimes, AR features are implemented in a web application, not a mobile one. And there are compelling reasons to do so. In this article, we will explain why businesses choose to implement augmented reality on the web and show examples of augmented reality websites.
Why use AR for the Web?
We live in a time when everyone has a smartphone with them almost all the time. So why even bother with Web AR?
First and foremost, accessibility. Augmented reality on the web can run on almost any connected device, as long as it has a webcam and a browser. A user can just visit the website and use it, no downloads are required.
The second reason is maintainability. A web version is a single application that is comparatively easy to update and keep in working condition. And it covers users of iPhone and Android alike. On the other hand, maintaining a separate app for each platform takes more time and effort - and, of course, money.
The third reason is the ease of updating. With a web app you just need to implement the changes on your end, and the users will be able to access the new version. But mobile users will need to download the update.
Finally, AR for the Web is easier to work with. In the case of Banuba Face AR SDK, for example, all a developer needs to do is connect the Web AR face tracking library and implement the content component. AR can be a part of an existing website and integrate with all the other software (e.g. CRM and BI) that is hooked-up to it.
Still, Web AR has its limitations. Compared to its mobile counterpart, it offers lower image quality and can’t work without an internet connection.
Web-based AR examples
Now let’s see some specific applications of augmented reality on the web.
1. Virtual try-on
This is probably one of the most popular eCommerce applications of augmented reality. Spurred on by the pandemic, mid-sized and large brands started implementing virtual try-on to give their customers an opportunity to test products online and order them.
The results were outstanding: for example, Ulta saw their brand engagement increase by 700% and Estee Lauder got 60% more sales.
A good example of an online try-on is Maybelline. Through their augmented reality website a user can test entire looks or separate items right through their computer or smartphone camera. NYX, L’Oreal, and Mac also offer similar functionality.
With modern technology, virtual items look lifelike, which means the users can be sure that they will be happy with the purchase. Technically, this makeup is a form of AR face effects.
Virtual makeup try-on
2. 3D object placement
By using augmented reality, businesses could allow customers to see how products could look in their apartments. This is very similar to virtual try-on but instead of checking how they look in the new clothing, the users will be able to view furniture, art, and other household objects.
For example, Saatchi Art, a major online retailer that sells paintings, photos, sculptures, and other similar goods, recently launched a “view in my room” feature. After selecting the object that they like, the user needs to scan a QR code with their smartphone to be able to see how this object would look like in reality, wherever they want to place it.
3. Videoconferencing
Video chats, both business and personal, are another field where the use of augmented reality on the web is very popular. One of the features that gets used the most here is background replacement. It allows the app to track the user and replace everything else with a blur, a static picture, a GIF, or a video.
Having it is important for privacy. Imagine presenting a report to the directors when a kid or a cat walks into the camera’s field of view. Covering the background would help prevent such embarrassing situations.
In the case of dating apps, this is also a matter of security. On the one hand, video calls are getting more and more popular. On the other, stalking remains a problem. Background replacement is a way to decrease information that a user shares during a call, thus protecting themselves.
This effect can be achieved in different ways. Banuba, for example, uses neural networks trained on a dataset of over 200K photos. These pictures include men and women of all skin colors, and are taken under different lighting conditions with both cheap and high-end cameras. As a result, the apps using Banuba Face AR SDK can do background replacement even when the video feed quality is subpar.
If background segmentation is what you need, feel free to test our SDK. It costs nothing for the first two weeks.
The most notable example of use of AR for web-based videoconferencing apps is Google Meet. Its web version allows background replacement for privacy and convenience.
4. Online video editors with effects
Applications like these are based on AI video editor software and are popular with people who create clips for social media, e.g. marketers and influencers. Anyone can upload a video to an augmented reality website, then cut it, add various effects and download the completed version.
The augmented reality effects can be as diverse as it gets:
- LUTs (Instagram filters). Color adjustment for the entire clips.
- Video effects. VHS, Glitch, Zoom, and more.
- Time effects. The most popular of those are Slo-mo and Rapid.
- Face masks. AR overlays popularized by TikTok.
See our Banuba AI Video Editor SDK page for more information on the possible effects and how to get them.
Banuba AI Video Editor
5. Augmented reality ads
One of the most impressive things about AR is the ability to create interactive content. This has been especially useful for the advertising industry, as people who actively engage with ads tend to be better customers.
Augmented reality advertising has been more widespread on mobile platforms. For example, Snapchat offers sponsored lenses that brands can purchase and spread for users to enjoy and promote the said brand in the process. However, augmented reality on the web has its share of ads as well.
A good example would be “Jump into Africa”. Kinder, a German confectionary brand, launched a dedicated portal. Its visitors could scan QR codes on the product stickers, then access the web app and enter a “portal” to Africa where they could see various 3D animals and read info about them. The promotion was based around Tesco stores in the UK.
Another impressive example is ExploreJumanji.com, a promo website for Jumanji: the Next Level. It combines speech recognition and AR to deliver an immersive experience through the internet. A user can activate the web app by a voice command, travel through the important locations of the movie and even buy tickets - also with a voice command.
6. eLearning
Gamification and game-based learning are not just trendy - they have proven their effectiveness in helping people improve their knowledge. They work especially well with younger audiences but have an impact on the older ones as well. This is why there are many Web-based AR examples in eLearning.
Skyeng, a company that focuses on teaching English to non-native speakers, tested AR features to let instructors put on different faces and change the speaker’s background. Other examples can be general-purpose videoconferencing apps that can be used for teaching.
Conclusion
Thanks to its accessibility and maintainability, augmented reality on the Web is present in eCommerce, communications, video editing, and other industries. There are multiple successful examples of its use which aspiring founders could learn from. And if you need to implement AR features quickly, go no further than Banuba Face AR SDK. It has 2 weeks of free trial, so check it out.
