2023年5月20日，由中共福州市委宣傳部作為指導(dǎo)單位，福州廣播電視臺(tái)、93913-XR信息與產(chǎn)業(yè)服務(wù)、OmgXR元宇宙興趣社群主辦的“2023 XRIC產(chǎn)業(yè)年會(huì)暨「金V獎(jiǎng)」頒獎(jiǎng)盛典”，在福州海峽國(guó)際會(huì)展中心隆重舉行。

XRIC產(chǎn)業(yè)年會(huì)暨「金V獎(jiǎng)」頒獎(jiǎng)盛典是目前我國(guó)XR產(chǎn)業(yè)規(guī)格最高、規(guī)模最大的年度盛會(huì)，大會(huì)梳理了元宇宙技術(shù)體系與產(chǎn)業(yè)鏈各環(huán)節(jié)發(fā)展情況，涵蓋了元宇宙新技術(shù)基礎(chǔ)設(shè)施、虛擬世界建設(shè)及內(nèi)容、虛擬數(shù)字人以及元宇宙價(jià)值體系等內(nèi)容。現(xiàn)場(chǎng)菁英齊聚，大咖云集，同時(shí)還有數(shù)萬(wàn)名觀眾通過(guò)在線直播收看了本場(chǎng)活動(dòng)。

在大會(huì)的主旨演講環(huán)節(jié)，來(lái)自Meta Reality Labs VR Web Platform的Felix Zhang（張?zhí)祛＃┳髁祟}為「Unleashing The Future of WebXR」的分享。

如今，隨著虛擬現(xiàn)實(shí)技術(shù)的發(fā)展，開(kāi)發(fā)者們?cè)诨ヂ?lián)網(wǎng)中創(chuàng)建出越來(lái)越多身臨其境、引人入勝的虛擬現(xiàn)實(shí)體驗(yàn)，元宇宙的概念也正在成為現(xiàn)實(shí)。而WebXR則處于這一趨勢(shì)的前沿，提供了一種可訪問(wèn)且跨平臺(tái)的方式來(lái)構(gòu)建虛擬現(xiàn)實(shí)和增強(qiáng)現(xiàn)實(shí)體驗(yàn)。Felix Zhang（張?zhí)祛＃┰谘葜v中詳細(xì)介紹了WebXR平臺(tái)及其功能，總結(jié)了關(guān)于WebXR的關(guān)鍵操作步驟，分享了自身的開(kāi)發(fā)經(jīng)驗(yàn)，以幫助廣大開(kāi)發(fā)者更好地了解并著手WebXR開(kāi)發(fā)。

WebXR平臺(tái)及其功能介紹

Felix Zhang首先對(duì)WebXR平臺(tái)及其功能進(jìn)行了介紹。WebXR平臺(tái)用于在網(wǎng)絡(luò)上創(chuàng)建身臨其境的增強(qiáng)現(xiàn)實(shí) (AR) 和虛擬現(xiàn)實(shí) (VR) 體驗(yàn)，它建立在開(kāi)放標(biāo)準(zhǔn)之上，為平臺(tái)提供了一組統(tǒng)一的API，實(shí)現(xiàn)了跨越各種設(shè)備和瀏覽器的跨平臺(tái)兼容性。作為WebVR的繼任者，WebXR現(xiàn)在還加入了MR功能，使其成為面向VR和AR開(kāi)發(fā)者的更加通用的平臺(tái)。

Felix Zhang（張?zhí)祛＃┍硎?，廣大開(kāi)發(fā)者之所以不開(kāi)發(fā)原生XR應(yīng)用，而是廣泛應(yīng)用WebXR進(jìn)行開(kāi)發(fā)，是基于以下幾點(diǎn)原因：

1、易于訪問(wèn)。在WebXR平臺(tái)，用戶可以通過(guò)網(wǎng)絡(luò)瀏覽器直接訪問(wèn)體驗(yàn)，無(wú)需下載或安裝其他應(yīng)用程序。

2、跨平臺(tái)兼容性。開(kāi)發(fā)者只需開(kāi)發(fā)一次，應(yīng)用程序即可在多個(gè)設(shè)備上運(yùn)行，只需進(jìn)行最少量的平臺(tái)特定調(diào)整。

3、便于更新維護(hù)。只需在服務(wù)器上更新，用戶就能體驗(yàn)到最新版本，無(wú)需手動(dòng)更新。

4、豐富用戶體驗(yàn)。WebXR允許開(kāi)發(fā)者使用他們熟悉的網(wǎng)絡(luò)技術(shù)進(jìn)行開(kāi)發(fā)，例如HTML、CSS和JavaScript，從而進(jìn)一步組合并豐富用戶的體驗(yàn)。

不過(guò)Felix Zhang（張?zhí)祛＃┮脖硎?，盡管WebXR平臺(tái)擁有更強(qiáng)大的功能，但相較于原生XR應(yīng)用，WebXR目前依然不夠流行。他認(rèn)為，對(duì)于開(kāi)發(fā)者而言，這兩個(gè)平臺(tái)雖然有所差別，但這些差別目前正在縮小，如果開(kāi)發(fā)者在設(shè)計(jì)WebXR體驗(yàn)時(shí)將性能問(wèn)題納入考量，并采用正確的技術(shù)來(lái)進(jìn)行構(gòu)建，完全可以創(chuàng)造出可以媲美原生XR體驗(yàn)的美妙體驗(yàn)。

接下來(lái)，F(xiàn)elix Zhang（張?zhí)祛＃榇蠹椰F(xiàn)場(chǎng)演示了兩個(gè)屢獲殊榮的WebXR體驗(yàn)，分別是Project Flowerbed和Spatial Fusion。

Project Flowerbed是一個(gè)沉浸式、冥想式的VR園藝體驗(yàn)，旨在展現(xiàn)WebXR的無(wú)限可能。該項(xiàng)目去年在Meta Connect大會(huì)上公布，今年早些時(shí)候Meta已經(jīng)正式將其開(kāi)源。在構(gòu)建Project Flowerbed的過(guò)程中，Meta站在WebXR開(kāi)發(fā)人員的立場(chǎng)上，找出了WebXR與原生XR應(yīng)用的差異并彌合了它們。這個(gè)過(guò)程還催生了新一代的WebXR模擬器——Immersive Web Emulator。

Spatial Fusion則專為在Meta Quest 2和Meta Quest Pro上獲得最佳體驗(yàn)而設(shè)計(jì)。這也是Meta首次嘗試在Quest瀏覽器平臺(tái)創(chuàng)建優(yōu)質(zhì)的WebXR混合現(xiàn)實(shí)體驗(yàn)，并集中展示了Presence Platform上所有Meta認(rèn)為對(duì)WebXR未來(lái)十分重要的特性。

Felix Zhang（張?zhí)祛＃┻M(jìn)一步指出了WebXR可支持的Presence Platform的五大特性，即：Passthrough（直通）、Anchors（錨點(diǎn)）、Hit-test（碰撞檢測(cè)）、Planes（平面識(shí)別）和Hands（手部追蹤）。

1、Passthrough（直通）。這是WebXR中的一項(xiàng)特性，即允許用戶在查看周圍的真實(shí)環(huán)境的同時(shí)對(duì)其進(jìn)行增強(qiáng)，將虛擬對(duì)象疊加其上。在WebXR平臺(tái)上，Passthrough使用Meta Quest設(shè)備上的攝像頭來(lái)捕捉用戶周圍環(huán)境的視頻，然后將虛擬內(nèi)容疊加到實(shí)時(shí)視頻流上。這創(chuàng)造了虛擬對(duì)象是現(xiàn)實(shí)世界的一部分的錯(cuò)覺(jué)，并允許用戶以更自然的方式與它們交互。WebXR Passthrough是創(chuàng)建沉浸式MR體驗(yàn)的重要功能，可無(wú)縫融合虛擬和現(xiàn)實(shí)世界的元素。

2、Anchors（錨點(diǎn)）。在WebXR中，Anchor（錨點(diǎn)）是現(xiàn)實(shí)世界中被設(shè)備追蹤的一個(gè)點(diǎn)，成為混合現(xiàn)實(shí)體驗(yàn)中放置虛擬對(duì)象的參考。錨點(diǎn)允許將虛擬對(duì)象放置在現(xiàn)實(shí)世界中的特定位置并在會(huì)話中（Session）持久存在，以便后續(xù)重新訪問(wèn)這些虛擬對(duì)象并與之交互。錨點(diǎn)一旦被創(chuàng)建，就可以用于在現(xiàn)實(shí)世界中放置虛擬物體以及調(diào)整虛擬物體的姿態(tài)。此外，WebXR平臺(tái)還支持Persistent Anchors（持久化錨點(diǎn)），可以根據(jù)來(lái)源保存錨點(diǎn)，并通過(guò)JavaScript API 恢復(fù)或刪除。

3、Hit-test（碰撞檢測(cè)）。這是一種允許開(kāi)發(fā)人員將虛擬對(duì)象準(zhǔn)確地放置在現(xiàn)實(shí)世界中的功能。它涉及從用戶設(shè)備投射虛擬光線并檢查與現(xiàn)實(shí)世界對(duì)象的交叉點(diǎn)。這將允許開(kāi)發(fā)人員以與現(xiàn)實(shí)世界一致的方式將虛擬對(duì)象放置在用戶的環(huán)境中。

4、Planes（平面識(shí)別）。這是一項(xiàng)類似但更強(qiáng)大的功能，它允許MR應(yīng)用程序檢測(cè)現(xiàn)實(shí)世界中的平面，例如桌子、地板或墻壁，從而幫助 WebXR 應(yīng)用程序了解用戶在現(xiàn)實(shí)世界所處的環(huán)境。一旦檢測(cè)到平坦表面，WebXR API就可以返回有關(guān)該表面相對(duì)于設(shè)備坐標(biāo)系的位置、方向和幾何數(shù)據(jù)的信息。然后用戶就可以使用此信息將虛擬對(duì)象更逼真、更準(zhǔn)確地放置在現(xiàn)實(shí)世界中。此外，用戶還可以重建WebXR體驗(yàn)中的平面，甚至可以為其添加逼真的物理效果。

5、Hands（手部追蹤）。Hand-tracking是一種替代輸入方法，用戶可以通過(guò)手部追蹤功能使用自然的手勢(shì)和動(dòng)作與虛擬對(duì)象進(jìn)行交互，例如抓取和投擲對(duì)象，做出手勢(shì)來(lái)觸發(fā)動(dòng)作等等。手部追蹤還可用于創(chuàng)造更加身臨其境的體驗(yàn)，例如讓用戶在VR中看到自己的手和手指。

如何設(shè)置開(kāi)發(fā)環(huán)境

接下來(lái)，F(xiàn)elix Zhang（張?zhí)祛＃┻M(jìn)一步講解了在開(kāi)始構(gòu)建WebXR前，開(kāi)發(fā)者如何設(shè)置開(kāi)發(fā)環(huán)境。他表示，開(kāi)發(fā)環(huán)境的設(shè)置十分重要：目前有多種WebXR框架和引擎供開(kāi)發(fā)者應(yīng)用，而選擇合適的WebXR開(kāi)發(fā)工具則可以讓開(kāi)發(fā)者事半功倍。

Felix Zhang（張?zhí)祛＃┦紫冉榻B了一些開(kāi)發(fā)者目前最常用的支持WebXR的框架和引擎。

1、Three.js。這是一個(gè)多功能且適應(yīng)性強(qiáng)的3D庫(kù)，可以勝任從簡(jiǎn)單的3D動(dòng)畫(huà)到復(fù)雜的虛擬現(xiàn)實(shí)體驗(yàn)等大量項(xiàng)目。它擁有一個(gè)龐大的開(kāi)發(fā)者社區(qū)，從而產(chǎn)生了廣泛的開(kāi)發(fā)資源，其中包括教程、綜合文檔和活躍的論壇討論。

2、Babylon.js。Babylon.js以其易于使用的API和對(duì)簡(jiǎn)單性的高度重視脫穎而出，它特別易于3D或游戲開(kāi)發(fā)的新手上手。Babylon.js還集成了一個(gè)物理引擎，簡(jiǎn)化了開(kāi)發(fā)者在沉浸式體驗(yàn)中實(shí)現(xiàn)真實(shí)世界物理效果的工作。

3、A-Frame。A-Frame利用Entity-Component-System提供強(qiáng)大、靈活的設(shè)計(jì)模式，這在專業(yè)游戲引擎中很常見(jiàn)。它允許開(kāi)發(fā)人員將基本的Entity（實(shí)體）組合在一起，構(gòu)建復(fù)雜的 3D 場(chǎng)景。A-Frame憑借其聲明性、類似 HTML 的語(yǔ)法，提供了一種簡(jiǎn)單直觀的開(kāi)發(fā)方法，即使對(duì)于3D開(kāi)發(fā)經(jīng)驗(yàn)有限的開(kāi)發(fā)者也十分友好。

4、Wonderland Engine和PlayCanvas。這兩個(gè)現(xiàn)代3D引擎適用于喜歡在開(kāi)發(fā)時(shí)使用視覺(jué)方法與3D場(chǎng)景進(jìn)行交互的開(kāi)發(fā)者，擁有大量功能，可以使WebXR應(yīng)用程序的開(kāi)發(fā)更加容易。

Felix Zhang（張?zhí)祛＃┍硎?，這些框架和引擎都有其獨(dú)特的功能和優(yōu)勢(shì)，適用于有不同需求的開(kāi)發(fā)者。除框架和引擎以外，F(xiàn)elix Zhang（張?zhí)祛＃┻€介紹了一些開(kāi)發(fā)者工具和庫(kù)。

首先是Immersive Web Emulator。這是一個(gè)可以幫助創(chuàng)建WebXR內(nèi)容的瀏覽器擴(kuò)展程序，由Felix Zhang（張?zhí)祛＃┖推鋱F(tuán)隊(duì)開(kāi)發(fā)。它能夠使開(kāi)發(fā)人員響應(yīng)式地在桌面瀏覽器上運(yùn)行WebXR應(yīng)用程序，而無(wú)需XR設(shè)備的支持。該擴(kuò)展程序受Mozilla Reality的WebXR Emulator Extension啟發(fā)，同時(shí)Felix Zhang（張?zhí)祛＃┖蛨F(tuán)隊(duì)成員努力對(duì)其進(jìn)行了擴(kuò)展以實(shí)現(xiàn)更好的體驗(yàn)。Immersive Web Emulator的設(shè)計(jì)和構(gòu)建重點(diǎn)是實(shí)現(xiàn)完整的輸入模擬、更高的可用性和更多的功能，例如鍵盤(pán)輸入鏡像/轉(zhuǎn)發(fā)。

Meta于今年2月在Chrome和Edge擴(kuò)展程序商店正式推出了該工具，此后發(fā)布了2次重大更新。最新更新的V1.2版本完全實(shí)現(xiàn)了Immersive Web Emulator與Quest頭顯的功能對(duì)等，這意味著Quest頭顯支持的所有WebXR功能現(xiàn)在也被模擬器所支持。

接下來(lái)是Reality Accelerator Toolkit，簡(jiǎn)稱RATK。這是一個(gè)WebXR實(shí)用程序庫(kù)，旨在簡(jiǎn)化混合現(xiàn)實(shí)功能在WebXR應(yīng)用程序中的集成。該程序庫(kù)目前與Three.js 3D庫(kù)兼容，旨在彌合底層WebXR API和Three.js提供的高層 API 之間的差距。它能夠管理錨點(diǎn)、檢測(cè)到的平面和現(xiàn)實(shí)世界中碰撞檢測(cè)的目標(biāo)，并自動(dòng)將它們轉(zhuǎn)換為Three.js場(chǎng)景中的Object3D實(shí)例，使開(kāi)發(fā)者更容易訪問(wèn)和使用它們。

最后是WebXR Samples Repo，這是Felix Zhang一直在從事研發(fā)的新項(xiàng)目。這是一個(gè)能用于實(shí)際生產(chǎn)環(huán)境的THREE.js模板應(yīng)用程序，集成了許多Felix Zhang和團(tuán)隊(duì)在開(kāi)發(fā)Project Flowerbed過(guò)程中發(fā)現(xiàn)的實(shí)用庫(kù)和實(shí)用應(yīng)用。WebXR Samples Repo中包括了：RATK支持、Becsy ECS、其他實(shí)用庫(kù)如對(duì)游戲手柄的封裝、以及更多示例系統(tǒng)和組件，以便開(kāi)發(fā)者能更快的投入WebXR內(nèi)容創(chuàng)建工作。

測(cè)試、調(diào)試和優(yōu)化WebXR體驗(yàn)

在分享的第三個(gè)環(huán)節(jié)中，F(xiàn)elix Zhang（張?zhí)祛＃┙榻B了開(kāi)發(fā)者如何測(cè)試、調(diào)試和優(yōu)化WebXR應(yīng)用程序，以確保它按預(yù)期工作并且給用戶更滿意的體驗(yàn)。他分享了自己常用的幾種工具和技術(shù)。

第一個(gè)工具是Chrome DevTools。這是一個(gè)用于調(diào)試和測(cè)試Web應(yīng)用的程序，其中包括WebXR體驗(yàn)。開(kāi)發(fā)者可以使用Chrome遠(yuǎn)程調(diào)試器在聯(lián)機(jī)設(shè)備上調(diào)試WebXR頁(yè)面、獲取控制臺(tái)日志、檢查網(wǎng)絡(luò)流量或捕獲準(zhǔn)確的性能快照。

將Immersive Web Emulator與Chrome DevTools兩個(gè)工具相結(jié)合，開(kāi)發(fā)者可以在不需要物理設(shè)備的情況下調(diào)試自己的WebXR體驗(yàn)——開(kāi)發(fā)者可直接從瀏覽器窗口進(jìn)入體驗(yàn)，在模擬器的幫助下，無(wú)需佩戴XR頭顯即可完成體驗(yàn)及調(diào)試。

但Felix Zhang（張?zhí)祛＃┮仓赋?，這種方法有一個(gè)缺點(diǎn)，即由于硬件之間的明顯差異，開(kāi)發(fā)者在筆記本電腦/PC上拍攝的性能快照并不代表在Meta Quest頭顯上運(yùn)行體驗(yàn)的實(shí)際性能。雖然Immersive Web Emulator在調(diào)試體驗(yàn)方面效果很好，但Felix Zhang建議開(kāi)發(fā)者仍需定期測(cè)試頭顯端的體驗(yàn)，以更好地了解其實(shí)際性能，以便進(jìn)行相應(yīng)地調(diào)整和更改。

第二個(gè)工具是Meta Quest Developer Hub。該開(kāi)發(fā)工具為開(kāi)發(fā)者提供了多種功能來(lái)調(diào)試和分析其沉浸式體驗(yàn)，其中包括：

1、輕松查看logcat日志；

2、專用的性能分析器選項(xiàng)卡；

3、幫助開(kāi)發(fā)者輕松安裝OVR Metrics工具。

第三個(gè)工具是Performance Analyzer，這是Meta Quest頭顯的實(shí)時(shí)指標(biāo)監(jiān)視器。該工具允許開(kāi)發(fā)者查看和自定義利用率圖表，包括CPU、GPU、幀速率、內(nèi)存等圖形化參數(shù)。

第四個(gè)工具是OVR Metrics，這是Meta Quest頭顯的性能監(jiān)控工具。它提供各種性能指標(biāo)，包括幀速率、熱量、GPU和CPU統(tǒng)計(jì)數(shù)據(jù)。該工具通過(guò)頭顯中的屏幕圖形、正在運(yùn)行的應(yīng)用程序或可從設(shè)備檢索的報(bào)告提供這些數(shù)據(jù)。

第五個(gè)工具是用于Quest的RenderDoc。這是一款功能齊全的圖形調(diào)試工具，可以處理3D WEB內(nèi)容，開(kāi)發(fā)者可以在GPU上捕獲、重放和調(diào)試場(chǎng)景。捕獲回放會(huì)向開(kāi)發(fā)者一步一步展示GPU正在做些什么，幫助了解場(chǎng)景是如何渲染的，并允許檢查紋理和繪制緩沖區(qū)。

RenderDoc還提供硬件性能指標(biāo)，讓開(kāi)發(fā)者了解GPU性能并找到GPU優(yōu)化的潛在領(lǐng)域。Meta會(huì)維護(hù)自己的RenderDoc分支。這個(gè)分支可以提供對(duì)Quest 芯片組底層GPU分析數(shù)據(jù)的訪問(wèn)。

在分享的最后，F(xiàn)elix Zhang（張?zhí)祛＃┲赋觯琖ebXR為開(kāi)發(fā)者創(chuàng)建出更為優(yōu)質(zhì)的沉浸式體驗(yàn)提供了強(qiáng)力的支持，他也呼吁廣大XR內(nèi)容開(kāi)發(fā)者們加入WebXR平臺(tái)。

開(kāi)發(fā)者如想了解更多關(guān)于WebXR的最新功能及更新內(nèi)容，可關(guān)注Oculus開(kāi)發(fā)者網(wǎng)站和Meta的社交媒體。