Bear 71 和 WebVR

熊 71 螢幕截圖

觀看紀錄片

WebVR 是內建的 API,結合立體轉譯與即時頭部追蹤功能,讓使用者可輕鬆快速地在線上觀看 VR 內容。內容創作者可使用 WebVR 製作身歷其境的 VR 內容,並在各種 VR 硬體上執行。

關於 Bear 71

Bear 71 是加拿大國家電影委員會 (NFB) 製作的互動式紀錄片。最初內建於 Flash,Bear 71 最初是在 2011 年推出,廣受重大消費者青睞。此體驗的骨幹是 23 分鐘的語音與視訊影片,突顯了人類、自然、技術和單一棕熊之間的關係。這種瀏覽者是以抽象的符號格線表示,在資訊世界中,檢視者是一隻狐猴。令人驚訝的是,這並不會妨礙內心的情緒故事,而是能讓使用者親自理解。

挑戰

《Bear 71》先前是以 Flash 製作而成,可說是當時最佳的互動敘事媒介。我們投入許多心力在科技上 將這項技術視為頂尖技術五年後,原本的願景堅持不懈,故事依然密切相關,但背後的技術需要進行更新。任何在創意中使用任何技術都能讓故事更加精彩,但虛擬實境應特別關注。VR 未來好幾次,但終於到達主流。這是述說故事的絕佳機會。以傳統方式發生的故事,現在可在 VR 中經歷。

當初推出 Bear 71 時,Adobe Flash 就屬於黃金年代。每一年,Flash 的市佔率都會縮短,而之前可存取的作品也會更困難且難以檢視。但 Flash 的下滑情形是 HTML 5 的飽和度此外,VR 就像是述說故事的真實平台,因此越來越重視。

對我們耳朵和耳朵來說,VR 享受自然的沉浸式體驗,但 VR 技術在操作上仍存在許多障礙。乍看之下,有多種耳機應能滿足各種需求和預算,而市面上各種提供發行的應用程式商店也會有更大的選擇。但使用者明白,他們更偏好使用瀏覽器。使用者偏好盡可能地下載和安裝。HTML5 對使用者和內容創作者都具有吸引力,因為 HTML5 的豐富體驗只需要一個網址就能呈現。WebVR 正是如此。

WebVR 可在軟體和硬體上,在瀏覽器中提供舒適又舒適的 VR 內容。

NFB 發現了這個商機,並考慮利用 HTML5 和 WebVR 為 Bear 71 帶來新生命。這絕無僅止於許多 VR 專案常見的新挑戰:如何在各種平台上,以適當的影格速率,在音響視覺上實現美觀的成果,以及手機等各種平台?

解決方法

在 2016 年下半年的開發期間,WebVR 還無法使用,WebVR API 的發展迅速,而 WebVR 標準也目前正在擬定草稿。然而,社群並未阻止社群拼湊出適當的停靠點:WebVR polyfill。並可透過陀螺儀和 WebGL,使用頭部追蹤和立體轉譯功能。這個 polyfill 和 Google Cardboard 一起可讓我們開始建構並測試內容。隨著 Google Pixel 和 Daydream View 推出,加上 Chrome 中第一個 WebVR 的正式版本,我們的內容就已準備好大展身手。為了快速開發,我們仍在尚未提供 WebVR 的位置納入並使用 polyfill。舉例來說,我們在 Chrome 55 的行動模擬器上投入大量開發及偵錯作業。此外,在市面上可用的上進行開發和偵錯也相當常見,包括但不限於 HTC One M9、iPhone 5S、Samsung Galaxy 以及 Google 推出的 Pixel 手機。而 polyfill 的多功能就是不夠的。

儘管 polyfill 的公用程式,也無法模擬部分必要的 WebVR 功能。值得注意的是,VR 錶面最大的障礙之一就是動機。動作暈影與頭部追蹤的影格速率、速度和準確度有關,WebVR 提供幾項基本功能,例如投影和高速方向感應器。不過,維持高影格速率的內容創作者仍須負責由於 WebVR 需要為每個影格轉譯兩次場景 (每個眼睛一次),因此最佳化至關重要。本文章內容不涵蓋為 WebGL 內容進行最佳化調整,但請留意以下幾點重要事項:

  • 減少繪製呼叫次數。其中一種做法是合併共用素材的元素
  • 保持精簡著色器。標準材質和著色器非常適合用於最佳化未使用的功能,但有時最好是手動編寫著色器。
  • 讓繪製距離保持靠近,同時有效運用霧氣。
  • 偏好以紋理為基礎的文字,這類文字閱讀效果較佳,且轉譯速度比文字幾何圖形更快。
  • 請確保圖片風格符合成本效益,相較之下,Super Mario 64 每秒有 60 個影格數,勝過 6 fps 的 Mario Galaxy
  • 以使用者為立場:設法只模擬玩家周遭的世界。
  • 尋找機會,在型式陣列中快取昂貴的運算結果。記憶體通常比處理能力低。

這份清單並未列出所有項目,但涵蓋了我們用來在大多數裝置上以最佳影格速率執行的大部分最佳化作業。

專為 8 位貢獻者組成的小團隊,過去約 12 週的時間創作、改造和最佳化內容。這一路上的努力相當艱辛又痛苦。Bear 71 VR 在 2 部電影節期間亮相,也獲得正面的意見回饋。如果有人在音樂節路上找不到這項資訊, WebVR 提供最舒適的瀏覽器體驗。如果你考慮建立新的廣告素材專案,請記住:網路是提供豐富內容的內容放送平台,因此不應該接受。VR 是帶我們進入發明世界的新世界WebVR 則結合了這兩種技術的優點。