Integrating 8th Wall for WebAR in Mobile Application
8th Wall — WebAR platform based on WebGL and custom SLAM engine, running straight in browser without ARKit/ARCore. This means AR experience launches by link or QR code, without app installation. For business, this is often decisive: conversion to "opened link" is orders of magnitude higher than "downloaded app".
Integration into existing mobile app is built through WKWebView (iOS) or WebView/Custom Tabs (Android), where 8th Wall scene renders inside native container. Or as standalone PWA with deeplinking from app.
Where Things Usually Break
Camera access inside WKWebView. From iOS 14.3, Apple allowed getUserMedia in WKWebView, but with caveats: mediaTypesRequiringUserActionForPlayback must be configured, and allowsInlineMediaPlayback = true. Without this, 8th Wall won't get camera access and throws NotAllowedError. On Android situation is simpler — Chrome WebView supports getUserMedia without specific flags from Chrome 89.
SLAM performance on budget devices. 8th Wall uses own world tracking instead of ARCore, heavier on CPU. On devices with Snapdragon 665 and below, FPS in scene with dynamic lighting and several 3D objects drops to 18-22. Solution: reduce poly count to 15k triangles, disable real-time shadows, use baked lightmaps in GLTF.
HTTPS requirement. 8th Wall requires secure context for camera API. Local development via localhost passes, but staging on HTTP — no. WKWebView in app works with any URL with NSAllowsLocalNetworking, but production scenes need valid SSL.
How We Build Integration
8th Wall project created in cloud IDE of platform — JavaScript/TypeScript scenes there based on A-Frame or Three.js + 8th Wall pipeline. For native integration:
iOS (WKWebView):
let config = WKWebViewConfiguration()
config.allowsInlineMediaPlayback = true
config.mediaTypesRequiringUserActionForPlayback = []
let webView = WKWebView(frame: .zero, configuration: config)
webView.load(URLRequest(url: URL(string: "https://your-8thwall-scene.8thwall.app/scene/")!))
WKUIDelegate needed to intercept webView(_:requestMediaCapturePermissionFor:) — otherwise permission dialog won't appear.
Android (Custom Tab vs WebView): Custom Tabs launch full Chrome with WebXR API and camera support — preferable option. Native WebView requires WebChromeClient with overridden onPermissionRequest. For seamless integration (no browser transition) — WebView with custom UA-string, if 8th Wall platform doesn't detect it as restricted.
Passing data between native layer and 8th Wall scene — via WKScriptMessageHandler / addJavascriptInterface. Typical case: pass userId or product SKU to scene so it loads correct 3D model from CDN.
Licensing and Limitations
8th Wall works by subscription: Starter ($99/mo), Pro ($250/mo), Enterprise (custom). License tied to domain. For white-label product or multiple client domains — Enterprise only. Account for this in budget.
Timeline
WebView container integration into existing app — 3-5 days. AR scene development on 8th Wall (1-2 objects, basic interaction) — another 5-10 days. Cost calculated individually after analysis of scene requirements and target devices.