Blog
Web AR

WebAR for Chrome And Safari vs Mobile AR

Suppose you have an idea for an AR-enabled app. It is going to change the world and make you lots of money. Now you just need to decide on how exactly to implement these cool augmented reality features. The thing is, there are meaningful differences between WebAR for Chrome and Safari and mobile AR. And in this article, we will show them and give some advice on when to use which.

Mobile AR

Mobile AR covers augmented reality functionality that is included in a mobile app. It mostly operates on smartphones and tablets. Technically, the relevant software written for smart glasses also counts as mobile AR. But these devices are mostly used in industrial or military settings and so are out of this article’s scope.

Web AR

Web AR is augmented reality that is built into a web application. It takes the video feed from a webcam and displays it, with the attached AR effects, in a browser. WebAR for Chrome and Safari is supported by Google and Apple through WebXR and ARKit. However, there are a lot of third-party SDKs (software development kits) that also allow working with these browsers.

Web AR works on both mobile devices and desktop/laptop computers. 

Speaking about browsers, we will focus on Chrome and Safari. On desktop computers, the browser from Google dominates, taking 65% of the market, while its Apple-built counterpart comes second with 18,65%. On mobile devices, the situation is similar: Chrome’s market share is 63%, and Safari holds 24,3%. The rest of the browsers stay below the 10% line in both mobile and desktop markets.

StatCounter-browser-ww-monthly-202006-202107

WebAR for Chrome and Safari vs Mobile AR

Now, let’s take a look at the factors you need to consider when choosing whether to go with mobile or web AR.

Device compatibility


As stated previously, web AR works on pretty much any internet-connected device with a browser and a webcam. Mobile AR, however, requires the device to support the technology, which means certain older models can’t use these features.

The compatibility depends on both the smartphone model and the software that the AR is based on. For example, our Face AR SDK works with iPhones starting from 6S and newer and covers about 80% of Android devices. It also supports webAR for Chrome, Safari, and other major browsers.

To sum it up, web AR offers the best accessibility, while mobile AR has somewhat higher requirements.

beauty-Aug-03-2021-06-30-46-75-AM

Screen size


Certain tasks are much more convenient to execute when you have a larger screen. For example, creating and modifying virtual humans on a smartphone is a bit frustrating, even though the technology allows this. 

Other things, like virtual makeup try-on, can work fine on web, mobile, and even in-store “smart mirrors”. 

Before choosing web or mobile AR, take the screen size into account, as it can make or break the user experience.

img_sdk_f_makeup

Performance


All other things being equal, web AR offers worse performance and image quality than its mobile counterpart. It operates from the browser sandbox that gets resources from the device and that, in turn, allocates some of the CPU and GPU power to the AR application. As a result, having another app or a large video opened in a different tab will likely cause frame rate drops and lags.

Mobile apps, on the other hand, can use more resources and thus provide a better image.

Costs


Web AR for Chrome, Safari, Opera, and other browsers is, in fact, a single application adapted to multiple browsers. This is not the case for mobile AR. Even if you use React Native or Flutter to save on the development time, you still get two apps that need to be supported. Improving and updating both costs more. 

That is not to say that you can’t use both mobile and web applications.

img_masks-min-4

Offline mode


Web AR cannot work without an internet connection. Mobile AR, however, can. Moreover, even the features that require a user to be online, can be made to work without the internet. For example, saving a social media post/video and uploading it when the connection is restored.

How an AR SDK fits into this?

The easiest way to implement augmented reality features in your web or mobile application is to use an SDK - a premade module containing the said functionality. It can be integrated within a day while developing AR features from scratch could take many months.

Banuba Face AR SDK is focused on augmented reality that works with face recognition and modification. This includes:

  • Beautification. Smoothing the skin, evening out its tone, removing wrinkles, acne, and blemishes, etc.
  • Face filters. Augmented reality masks and stickers, on par with the ones in TikTok or Snapchat.
  • Virtual makeup. Applying powders, lipstick, nail polish, and other cosmetic products.
  • AR try-on. Realistically fitting hats, jewelry, eyeglasses, piercing, and the like.
  • Face morphing. Changing the size and shape of facial features for a comical effect.
  • Background replacement. Filtering out person and replacing the rest of the image with an image or 3D environment.
  • Avatars. Animated 3D objects that move in accordance with the user. 
  • LUTs (Instagram filters). Color change for the entire picture and video.

The SDK supports mobile AR (native iOS and Android, as well as React Native and Flutter) and WebAR for Chrome and Safari, thus covering pretty much all screen sizes. 

It can operate both online and offline. This includes the AR cloud option: storing certain effects and downloading them when the user actually needs them. A single mask could take 1-3 MBs of space, so AR cloud could be a great compromise that allows decreasing the app size while keeping the effects range varied. 

Conclusion

Both mobile and web AR are viable options for AR-powered applications. Mobile AR offers better performance/image quality and can work offline. Web AR for Chrome and Safari can work on more devices, is cheaper to maintain, and is better suited for larger screens. 

Mobile and web AR can be quickly and easily implemented by using an augmented reality SDK. And if you need augmented reality effects on people’s faces (makeup try-on, face filters, and so on), go ahead and try Banuba Face AR SDK. It has 14 days of free trial to see whether it is the right fit for you.

Start Free Trial

Top
# Tags: