Mozilla發布Firefox Reality WebVR開發者指南

而這是非常底層的事情。

（映維網 2018年09月18日）從零構建WebVR應用需要使用WebGL，而這是非常底層的事情。大多數開發者都需要某種庫，框架，或遊戲引擎來處理艱巨的任務。下面是一些支持WebVR的常用庫：

1. Three JS

2018年6月的ThreeJS已經提供了新的和優化的WebVR支持。它一般都可以解決問題。具體用法你可以參見這裡的官方示例。

2. AFrame

AFrame是一個基於ThreeJS的框架，它允許你使用類似syntax這樣的HTML來構建VR場景。如果你從未接觸過，VR將是最佳的入門點。

3. Babylon

Babylon.js是一個用於Web的開源高性能3D引擎，它從2.5版開始就提供了完整的WebVR支持。這個文檔解釋了如何使用WebVRFreeCamera類。

4. Amazon Sumerian

亞馬遜的Sumerian工具允許你輕鬆構建VR和AR體驗。當然，它顯然支持WebVR。

5. Play Canvas

Play Canvas是一款網頁遊戲引擎，它支持WebVR。

現有的WebGL應用

如果你手上已有一款WebGL應用，你可以輕鬆添加WebVR支持。映維網早前分享的文章已經提供了詳細信息。

延伸閱讀：Mozilla工程師展示如何將WebGL應用移植到WebVR

無論使用何種框架，請確保它支持WebVR 1.1 API，而不是較新的WebXR API。WebXR最終將成為一個完整的Web標準，但目前尚未有瀏覽器提供非實驗性的支持。現在請暫時使用WebVR，並在未來，一個polyfill將能確保現有的應用程序支持以後的WebXR。

請把它當成Mobile Web進行優化，因為它就是Mobile Web

為VR頭顯開發就像為移動設備開發一樣。儘管有VR頭顯是通過數據線連接至搭載強大顯卡的PC，但也有很多用戶都是使用智能手機VR或VR一體機，如Oculus Go或Lenovo Mirage。無論實際設備如何，渲染至頭顯至少需要兩倍於非沉浸式體驗的渲染成本，因為一切都必須渲染兩次，每隻眼睛一次。

為了幫助VR應用快速渲染，請將繪製調用計數保持在最低限度。繪製調用計數的重要性遠遠超過場景中的總多邊形（當然，多邊形也十分重要）。繪製10個多邊形100次遠遠慢於繪製100個多邊形10次。

移動設備上的照明成本一般也十分昂貴，因此請使用更少的照明或成本更低的材質。如果lambert或phong材料的效果與完整的PBR（基於物理的渲染）一樣好，這時顯然要勾中成本更低的選項。

將3D模型壓縮為GLB文件而不是GLTF。解壓時間大致相同，但前者的下載時間會快很多。有多種命令行工具可以執行這個操作，或者你可以使用這個基於Web的工具。只需將文件拖放其中即可獲得GLB。

總是使用powers of 2 texture sizes（兩次冪限制的紋理大小），並嘗試將紋理保持在1024×1024以下。移動GPU的紋理內存遠不及桌面。另外，大紋理需要很長的下載時間。對此，你總是可以使用512或128來處理凹凸貼圖和光照貼圖等。

對於你的2D內容，請不要假設任何特定的屏幕尺寸或解析度。

在載入asset上要「懶一點」，從而確保良好的初始體驗。大多數VR框架都有一種按需載入資源的方法。ThreeJS使用DefaultLoadingManager。你的目標是儘快啟動並運行初始屏幕。如果可以，將初始下載保持在1MB以下。快速載入體驗是人們不斷回頭的原因之一。

優先考慮幀率。對於VR而言，高幀率和流暢動畫比模型的細節更重要。與2D屏幕相比，人眼（和耳朵）在VR中對延遲，低幀率，跳幀和抖動更加敏感。只要體驗有趣且流暢，用戶就會對低多邊形的模型和不太逼真的圖形更加寬容。

不要做瀏覽器嗅探。如果你對某些設備進行硬編碼，代碼在今天可以正常運行，但一旦新設備推向市場，問題就會出現。WebVR生態系統正在不斷發展變化，而新設備即將來臨。所以，請檢查VR API實際返回的內容，或依靠框架來為你執行這個操作。

假設控制可以是任何一切。有些頭顯提供完整的6自由度控制器，有些只是3自由度，有些則是使用滑鼠或帶觸摸屏。另外還有些設備完全沒有輸入，並僅依賴於基於注視點的交互。確保你的應用程序適用於任何情況。如果應用在某些情況下無法運行，請嘗試僅提供只供觀影的降級體驗。即便沒有合適的設備，都不要妨礙用戶查看你的應用。某些人可能是擁有頭顯，只是目前沒有在使用而已。所以，請為每個人都提供一定程度的體驗。

除非來自VR頁面，否則切勿直接在頁面載入時進入VR。在某些設備上，如果沒有用戶交互頁面將不允許進入VR。在其他設備上，音頻同樣可能需要用戶交互。總是提供某種可以解釋用戶位置以及交互內容的2D啟動頁面，然後提供一個大大的「Enter VR」按鈕來實際進入沉浸式模式。例外情形是，用戶來自於另一個頁面並且已經在VR之中。在這種情況下，你可以直接進入。這個A-Frame文檔解釋了具體的原理。

在實際設備上進行調試

創建響應式和有趣WebVR體驗的真正關鍵是，在桌面，移動和至少一款真正的VR頭顯上進行調試。在開發過程中使用桌面瀏覽器很好，但沒有任何東西可以替代用戶頭上穿戴的實際設備。對於在桌面PC上看起來不錯的東西，它在VR中可能會十分糟糕。頭顯的視場與手機或桌面窗口完全不同，因此每款頭顯都可以看到不同的畫面。

Oculus Go的價格相當親民。當然，你同時可以考慮智能手機VR頭顯的選項。

Firefox Reality支持通過USB進行調試，因此你可以在桌面瀏覽器中瀏覽性能和控制面板。

The post Mozilla發布Firefox Reality WebVR開發者指南 appeared first on 映維網.

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！