Web增强现实的技术原理

鉴于Web技术的最新进展，它在开发基于AR的解决方案时提供了一组新的选项。Web浏览器的最新更新为AR应用程序打开了大门。使用网络或本机应用程序构建AR体验哪个更好？在这篇文章中，我将简要概述JS在原生应用世界中的使用，然后我将深入探讨WebAR是什么、它是如何工作的、它如何与原生应用竞争，以及哪个是更好的解决方案。以下内容由公众号赞助：AIRX社区（国内领先的AI、AR、VR技术学习交流平台）相信大家已经通过之前的一篇文章介绍了WebAR：WebAR的实现与应用介绍。本文主要详细介绍WebAR与原生AR的区别。JS在应用端扮演什么角色？Javascript无处不在，包括嵌入在本机应用程序中。使用JS代码执行C++代码的能力使Blippar、Zappar、Facebook、Snapchat和其他此类平台能够让开发人员更好地控制他们的AR体验。JS有很多吸引人的特性，但最值得注意的是Java语言是iOS和Android原生的。为了提供有关JS和C++如何协同工作的上下文和详细信息，我将使用Blippar的移动SDK作为示例。BlipparSDK的核心是一个基于C++的OpenGL渲染引擎，它使该应用程序在跨平台时更具成本效益。Blippar的JavascriptAPI允许第三方开发人员使用JS控制底层引擎，但获得了C++的所有响应能力，并为用户提供原生效果。所有上述SDK/API都早于ARKit和ARCore。每个平台现在都有原生实现，ViroMedia创建了一个React插件，可以实现原生和跨平台AR开发。当我们讨论使用Java的AR平台时，我们不能忽视亚马逊。亚马逊推出了Sumerian平台，旨在弥合创作者/出版商职位之间的差距。Amazon在AWS之上构建了自己的XR渲染引擎和Studio。允许用户在AWS基础设施的所有支持下扩展他们的游戏/应用程序/体验。显然，这是亚马逊吸引新开发人员并留住现有客户在其平台上构建的一种方式。这里有几点需要注意，对于后端和架构师来说，这表明亚马逊看到了一个清晰的平台。对于前端人员，SomerianStudio都是基于网络的，脚本编写都是使用基于Javascript的API完成的。Adobe是创作者领域的另一个强大参与者，他们的ProjectAero处于私人测试阶段，使创作者能够使用USDZ格式。我们不能谈论所有这些，更不用说Sketchfab了。最初是3D艺术家用来上传和展示他们作品的存储库，现在已经发展成为一个带有API的市场，以及一个支持ARKit的iOS应用程序，允许用户将3D模型放置在他们的世界中。随着AR和VR越来越流行，Sketchfab是一家值得关注的公司。什么是WebAR？WebAR不仅仅是AR的一个子集，它还是一个涵盖许多不同实现的总称。WebAR解决方案的范围从使用设备的陀螺仪/加速计传感器作为背景和相机输入到更复杂的解决方案，如AR.js、TensorFlowJS和USDZ。从根本上说，AR是使用移动设备的传感器来跟踪其在增强场景中的位置。在过去的几年中，移动浏览器增加了对JS传感器API的支持，例如相机、陀螺仪、加速度计、方向、磁力计（阅读：指南针）。使用这些传感器，开发人员可以创造一系列体验。Blippar是首批推出带横幅广告的浏览器内AR体验的公司之一；布局在AR背景下是一个相对较新的概念，但在推出时引起了不小的轰动。该广告是一种360?汽车内饰体验3，按钮重叠以在显示汽车细节之间切换。我问的第一个问题是它的响应速度如何？AR的计算成本很高，那么它如何在浏览器中运行呢？WebAssembly是一种Web标准，允许浏览器使用二进制文件执行汇编代码。WebAssembly文件是通过将C/C++编译成使用JS代码执行的.wasm文件来创建的。让我们考虑一下这里的含义。使用WebAssembly，可以在使用原始Javascript的Web浏览器中以接近本机的性能运行计算密集型操作。WebAssembly支持TensorFlowJS和ML5JS等项目。WebAssembly很酷，但只有WebAR的一半。WebAssembly完成了AR计算机视觉中的所有繁重工作，我们有用于渲染的webGL。WebAssembly和WebGL是基础，但我们如何使用这些API来创建基于Web的AR体验？输入AR.js，这是一个由JeromeEtienne编写的框架，它使用A-Frame（构建在Three.js之上）和JSARToolkit5（ARToolKit的脚本端口），还有一些其他WebAR框架，但大多数需要特殊的Web浏览器应用程序或使用专有API。AR.js是开源的，不需要任何特殊的应用程序，它在默认浏览器中运行。要讨论AR.js及其对WebAR的意义，有必要快速了解一下为该框架提供支持的组件。A-Frame是Three.js之上的基于JS的API框架，使其更像是具有实体-组件关系的游戏编码。这简化了Three.js的语法，让开发者可以专注于体验/游戏。然后，AR.js使用JSARToolkit将3D场景跟踪到标记，并利用计算机视觉检测特征点。这就是支持大多数早期基于应用程序的AR体验的原因。AR.js让移动网络踏入了大门，可以与基于应用程序的AR竞争。看看苹果和谷歌的努力，我们看到他们已经采取措施，使3D模型与各自的移动浏览器之间更深入的集成。让我们从Apple的.usdz文件格式开始。什么是USDZ，它是如何运作的？简而言之，Apple已将ARkit功能内置到iOS版Safari中。只需几行html和一个.usdz文件，任何网站都可以包含AR元素。.USDZ是Apple用于其移动浏览器的标准本机文件格式，iMsg中的3D显示、电子邮件和笔记应用程序。在谈论USDZ和Apple之前，我们不得不提一下Google在WebXRDeviceAPI和WebXRHitTestAPI（在ChromeCanary中）方面的进展。谷歌希望将基于网络的AR放在首位。我将假设Google使用与Poly项目类似的文件类型.obj以及.glTF文件格式。与Apple不同，Google选择采用流行的标准格式表明Google正在考虑降低3D生态系统中已经采用的障碍。无需应用程序无应用程序AR是指使用本机Web浏览器提供AR体验，使其适用于所有平台、设备和移动操作系统。当Blippar推出AR数字展示位置（在网络浏览器中启动AR的横幅广告）时，我们看到了大量潜在客户。代理、零售、娱乐、制药等方面的需求巨大，所有这些都希望在不下载应用程序的情况下与用户互动。大多数机构和品牌都愿意为现有应用程序添加AR体验，但他们也意识到这种参与与删除应用程序下载的体验不同。网络是无障碍的，每个人都有一个带有二维码扫描仪的相机应用程序，可以链接到网站。回到我之前提到的AR广告投放；当时最大的战斗集中在浏览器兼容性上。迄今为止，基于网络的AR体验仍然是一个问题。并非每个移动浏览器都支持SensorsAPI，或者设备缺少某些传感器，这是我们看到的一个大问题，尤其是在Android设备上。当您通过商店发布应用程序时，您可以控制该应用程序可以安装在哪些设备上，但在Web上您没有该控制权。是的，它可以向网页添加检查，但随后您会看到一个屏幕显示“抱歉，不支持您的设备”，这令人沮丧！WebAR竞争力目前，网络浏览器在AR相机方面没有足够的访问权限。AR相机与传统相机的不同之处在于，它在操作系统级别而不是在操作系统级别处理增强功能。当前基于Web的AR实现需要在操作系统之上执行计算，这会导致计算滞后、限制渲染，有时甚至会导致可见滞后。使AR更易于通过网络访问的一大步是Web标准采用API来直接访问ARCamera对象。如果该抽象可以作为标准WebAPI存在，那么任何浏览器应用程序都可以利用ARkit/ARCore或任何现有的底层平台。WebAPI出现后，出现了许多不同的框架。有一些使用ARKit/ARCore的实验性浏览器，但它们需要特定的JS框架。USDZ是一个好的开始，但缺少重要的组件，这一层增加了对交互的支持。谷歌的努力仍然只在Chrome的金丝雀版本中可用，因此在正式发布之前它将落后于苹果。当我开始写这篇文章时，我的想法是会有一个明确的优缺点列表，但在坐下来仔细研究优缺点后我认为，只要Web和Native有不足之处，就有SDK和API可以补充.视觉搜索仅适用于基于应用程序的解决方案。例如，Blippar的识别引擎不依赖二维码，而是使用人工智能来识别其系统中的已知实体，并在匹配时提供体验。这对于希望利用现有印刷材料而无需更改设计的公司来说非常有用。视觉搜索的行为仍然很新，而且不是很直观，而且大多数人不习惯将手机指向事物，即使是很酷的AR内容。WebAR不依赖视觉搜索，而是依赖二维码。从设计的角度来看，QR码并不是很吸引人，但自从iOS和Android在其原生相机应用程序中添加了对QR码识别的支持后，扫描QR码的行为就得到了更广泛的应用。另一个论点是互联网和增强现实在全球范围内可用，我们需要记住，在一些新兴市场，互联网并不那么快速和可靠。这需要支持离线使用，只能通过应用程序使用。另一方面，让某人下载应用程序比访问网站要困难得多。所以最终的结论是……这真的取决于项目。WebAR是如何发展的很多人都对AR的未来做出了预测，无论是耳机、投影仪，还是植入芯片的极端性等等。为了加入这个世界大胆而勇敢的算命先生的行列，我将分享我的想法。目前，大多数AR内容（体验中的媒体）都托管在设备上或从云端加载。Blippar、Facebook、Snapchat、Zappar都使用基于云的CMS，该CMS根据某种触发器（链接、标记、面部、二维码等）下载AR体验。为了提供有关云交付AR如何工作的上下文，移动应用程序具有某种触发或入口点（链接、标记、面部、QR码等）来启动体验。此触发器提示应用程序向后端系统发出请求以发送体验的资产和代码。大多数平台会在启动之前下载整个体验，这解释了为什么Facebook和Snapchat的上限为4mb以保持快速运行。在Blippar，我们提供各种体验，因此有时我们必须发挥创意。该项目的内容范围从页面上的视频到3D世界、赛车上山，甚至在Apps上完全可用。所以我们的活动范围从>1mb到85mb或更多。为什么这么麻烦？就像我之前提到的，我们过去常常通过对场景进行编码以在后台下载资产来发挥创意，这有什么大不了的？事实证明为什么尺寸很重要，获得正确的平衡对于AR体验的成功至关重要，但它背后有一些强大的数字。在Blippar，我们发现所有加载（下载和初始化）时间超过30秒的体验都会损失大约50%的体验，而那些最初尝试交互的用户会损失大约75%的用户。这意味着较长的下载时间可能会导致多达90%的受众流失，大约10%的用户会重新参与。因此，现在不必以某种方式让某人下载应用程序，还可以让用户知道您的应用程序需要快速加载。如果平衡得当，体验可以让每个用户的参与度提高3倍，停留时间提高2倍。WebAR使用网络优化进行下载和交付，但大小仍然很重要。如果内容不是流式传输，体验越好，在移动浏览器中加载所需的时间就越长。更多机器学习、人工智能、增强现实资源和技术干货，可以关注公众号：AIRX社区，一起学习，一起进步！