在为 Google I/O 做准备时，我们想重点介绍一下网络增强现实 (AR) 带来的令人兴奋的可能性。Chacmool 是一个教育类 Web 体验演示，旨在展示 Web AR 如何帮助用户轻松实现 AR 体验。网络让 AR 随时随地触手可及。
现在，我们已在搭载 Android O 或更高版本的与 ARCore 兼容的 Android 设备上的 Chrome Canary 中启用了此演示版。您还需要安装 ARCore。这项工作依赖于一个新的 WebXR 方案（WebXR Hit Test API），因此它带有标记，并且旨在保持 Canary 版，因为我们与 Immersive Web 社区小组的其他成员一起测试和优化新的 API 提案。实际上，如需访问演示，您需要在 chrome://flags:
#webxr 和 #webxr-hit-test 中启用两个标志。启用这两项功能并重启 Canary 后，您可以查看 Chacmool 演示。
恰克穆尔 AR 体验以教育为中心，利用 AR 的沉浸式互动特性帮助用户了解古老的查科莫尔雕塑。用户可以将真人大小的雕像放在现实中，然后四处移动，从各种不同的角度和距离观看雕塑。AR 的沉浸式特性让用户能够像在现实世界中一样自由探索、发现和畅玩内容。与在平面 2D 屏幕上查看对象不同，在 AR 中查看对象时，我们能够更深入地了解我们所查看的内容，因为我们可以使用非常直观的交互模型从许多不同的角度和距离查看对象：在该对象周围走动，以及越近或更远的距离。此外，在这种体验中，注释是直接放置在雕塑上。这样，用户就可以直接联系文本中描述的内容以及这些特征在雕塑上的位置。
本演示构建用了大约一个月的时间，利用了 WebXR 团队首个基于网络的 AR 演示 WebAR-Article 中的部分组件。该雕塑的相关信息来自 Google 的艺术与文化页面，该 3D 模型由 Google 艺术与文化的合作伙伴 CyArk 提供。为了让 3D 模型准备好在 Web 上运行，我们结合使用 Meshlab 和 Mesh Mixer 来修复模型并缩减其网格，以缩减文件大小。然后，使用 Draco（一个用于压缩和解压缩 3D 几何网格和点云的库）将模型的文件大小从 44.3 MB 缩减到 225 千字节。最后，使用网页工作器在后台线程上加载模型，以便页面在加载和解压缩模型时保持交互式状态，此操作通常会导致卡顿，并阻止页面滚动。
我们需要特别强调的是，由于我们在桌面设备上进行开发并部署到手机上，因此使用 Chrome 的远程调试工具来帮助检查体验，可在代码更改之间建立极短的快速迭代周期，此外，Chrome 中还有一些非常棒的开发者工具，可用于调试和检查性能。
AR/VR 体验最佳实践
针对原生 AR 体验进行设计的大多数设计和工程指南都适用于打造基于网络的 AR 体验。如果您想详细了解常规最佳实践，请查看我们近期发布的 AR 设计准则。
具体而言，在设计基于网络的 AR 体验时，最好在使用 AR 时利用整个屏幕（即，采用与移动设备上的视频播放器进入全屏模式类似的方式来进入全屏）。这可以防止用户滚动视图或被网页上的其他元素分散注意力。向 AR 的过渡应该是平滑、无缝的，在进入 AR 初始配置（例如，绘制十字线）之前显示相机视图。对于基于 Web 的 AR，需要注意的一点是，与原生不同的是，开发者（目前）无权访问摄像头取景框、光照估测、锚点或平面，因此在设计基于网络的 AR 体验时，请务必谨记这些限制。
此外，由于提供 Web 体验的设备多种多样，因此请务必优化性能以打造最佳用户体验。因此：要减少多边形数量，尽量减少光照数量，预计算阴影（如果可能），并尽量减少绘制调用。在 AR 中显示文本时，请使用新式（即基于带符号距离字段）的文本渲染技术，确保文本从任何距离和角度都清晰可辨。放置注释时，请将用户的目光视为另一种输入，并仅在相关注释时显示注释（即，在用户聚焦于感兴趣的区域时显示的基于近程的注释）。
最后，由于此内容是基于网络的，因此请务必遵循适用于 Web 的常规最佳设计做法。确保网站能够在各种设备（桌面设备、平板电脑、移动设备、头戴设备等）上提供良好的体验。支持渐进式增强意味着，在设计时还应针对不支持 AR 的设备进行设计（即在非 AR 设备上显示 3D 模型查看器）。
如果您有兴趣自行开发基于网络的 AR 体验，可以参阅我们的相关博文，详细了解如何开始自行在 Web 上构建 AR。（您还可以查看 Chacmool 演示的源代码）。WebXR Device API 处于积极开发阶段，我们非常期待收到您的反馈意见，以便我们能够确保它支持所有类型的应用和用例。因此，请前往 GitHub 参与讨论！