用一篇超全面的文章,讓你掌握VR設計的基礎知識

本文旨在向不了解 VR 設計的人介紹一些基礎概念(資料來源于谷歌和一些其他機構)。

此前,我有幸參與了一個大客戶的 VR 項目,這讓我能夠在這個有趣的新方向上擴展知識,并加深對設計的理解。在那期間,我閱讀了很多資料,從中獲得了關鍵的知識,并將它們總結為 3 個設計概念,指導著我的設計決策。

第一臺商業(yè)計算機是在五十多年前推出的,今天,我們的電子設備擁有了更高的處理能力。臺式機提高了工作效率,筆記本電腦提升了便攜性,而智能手機則進一步豐富了我們社交和信息獲取的方式。有趣的是,隨著設備越變越小,屏幕距離我們的眼睛也越來越近。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 筆記本電腦、手機和手表的標準視距

隨著頭戴式顯示器(HMD)的發(fā)展,這些不斷縮小的設備更是直接戴到了臉上。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 圖片來源:Mike Alger

設計師從未擁有如此多的自由來創(chuàng)造一個沉浸式的世界。在 VR 中,用戶可以從 6 個維度與環(huán)境發(fā)生交互,這是最接近真實世界的互動方式。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 圖片來源:Mike Alger

虛擬現(xiàn)實的發(fā)展前景

虛擬現(xiàn)實帶來了前所未有的沉浸感,標志著沉浸式 3D 內(nèi)容時代的開始。

1. 重新定義故事敘述的方式

VR 中用戶高度沉浸的特點為故事敘述提供了巨大的機會,也為由敘事驅(qū)動的教育、游戲和娛樂等產(chǎn)業(yè)帶來了無限的可能。它將影響整個消費媒體領域,或會使得 VR 成為未來消費的獨特沉浸式媒體。

2. 重新定義醫(yī)療健康行業(yè)

VR 技術已經(jīng)開始滲透醫(yī)療健康領域,它被用于訓練外科醫(yī)生、制定手術計劃、直播手術過程以及治療恐懼、疼痛和創(chuàng)傷后應激障礙等。

3. 重新定義購物方式

房地產(chǎn)和電商行業(yè)已經(jīng)開始采用 VR 技術,因為它可以創(chuàng)建逼真的虛擬環(huán)境,讓潛在買家在決定購買前可以真實體驗。

4. 重新定義工作方式

虛擬現(xiàn)實甚至可以改變我們的工作方式。 我們可以根據(jù)個人喜好定制自己的 VR 工作空間,360° 的「屏幕」空間能減少工作中的移動障礙和在不同任務之間切換的時間,將效率提高約 40%。

虛擬現(xiàn)實的發(fā)展歷史

用一篇超全面的文章,讓你掌握VR設計的基礎知識

有趣的是,第一個虛擬現(xiàn)實頭戴式顯示器(HMD)是在電腦圖形用戶界面之前發(fā)明的。這篇文章用 9 分鐘介紹了虛擬現(xiàn)實技術 30 多年的演變歷程:https://medium.com/ossic/the-history-of-virtual-reality-e517983b1253。了解 VR 技術發(fā)展的歷史,可以讓我們客觀地看待和預見它未來的發(fā)展。

虛擬現(xiàn)實設計中的核心挑戰(zhàn)

1. 內(nèi)容位置

對于手機、平板和筆記本電腦,設計師在一開始就知道載體形式和屏幕尺寸。但是在 360° 的 VR 空間中,載體形式和屏幕尺寸取決于 VR 環(huán)境的設計和布局,而這又由 VR 應用的目的決定。因此,VR 的載體形式和屏幕尺寸,甚至形狀可能隨項目而變化。

2. 用戶安全

VR 強大的沉浸能力,讓產(chǎn)品對用戶安全負有重要責任。與當今大多數(shù)二維界面設計對人體工程學理論的忽視不同,VR 的廣泛應用將迫使設計師了解并嚴格遵守人們的健康習慣和運動標準,因為VR中不符合人體工程學的設計會導致明顯的不適,如由于相機移動過快引起的惡心。

輸入方法

用戶在 VR 環(huán)境中操作的方法主要有如下 3 種。

1. 射線輸入

這種輸入方法要求用戶握著一到兩個控制器??刂破鞒掷m(xù)投射的激光(就像激光指示器)是用戶在 VR 世界中選擇和操作的主要工具。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 帶激光的控制器,來源:Google I / O 2017

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 基于射線輸入的菜單交互概念 來源:Mike Alger

2. 注視輸入

這種方式認為用戶對一個對象的持續(xù)注視表明對該對象的興趣。該方法通常有一個始終保持在用戶視野中心并跟隨用戶眼睛運動的視覺標記。雖然這種輸入方法快捷又輕松,但它的設計非常具有挑戰(zhàn)性,因為人眼經(jīng)常在無意識地移動。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 基于注視時間的輸入方法,來源:Ateo

3. 手勢輸入

使用手作為輸入工具使這種交互方式最直觀和自然,它讓用戶可以自由使用不同類型的手勢來與虛擬世界進行交互。與前兩種輸入方法不同的是,手勢輸入通常要求交互對象位于用戶手可觸及的范圍內(nèi),以便操作它們。因此,基于手勢的輸入有時會與基于射線的輸入結合使用,以達到最好的效果。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 交互概念:用手觸發(fā)的圓形菜單,來源:Mike Angler

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 交互概念:基于手勢的手腕菜單,來源:Mike Angler

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ VR中的按鈕交互概念,來源:Mike Angle

虛擬現(xiàn)實設備

用一篇超全面的文章,讓你掌握VR設計的基礎知識

以下列表能讓你快速了解目前?VR市場上流行的設備

  • Oculus VR?,?被 Facebook 用 20 億美元收購
  • HTC Vive
  • Google DayDream
  • Google Cardboard
  • Sony’s Project Morpheus?,PS4 VR System
  • Samsung’s Gear VR
  • StarVR,Ultra-wide field of view
  • Visbox,?Cave VR system

三個關鍵的VR設計概念

用一篇超全面的文章,讓你掌握VR設計的基礎知識

1. 設計概念1:Mike Alger的內(nèi)容區(qū)域

在谷歌工作的 Mike Alge r對 VR 中令人舒適的視角和內(nèi)容放置范圍進行了深入研究,提出了內(nèi)容區(qū)域的概念。

你應該將界面元素放在虛擬環(huán)境中的哪個位置?

首先假設我們坐在沙發(fā)(非旋轉椅子)上,我們會發(fā)現(xiàn)脖子動得太多會很不舒服。脖子和眼睛的運動限制決定了虛擬空間中可用于放置內(nèi)容的區(qū)域。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 來源:Mike Angler

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 我們可以在脖子不動的情況下將眼睛向任何方向轉約30°,來源:Google IO 2017

坐在不能旋轉的椅子上,我們可以輕松將眼睛向任何方向移動 30-35°,稍微用力則可以移動到 55-60°,由此形成的圓形區(qū)域,用于放置 VR 中主要的用戶界面元素;和它同心的 120° 區(qū)域,則放置次要的用戶界面元素。注意,我們的視線通常在水平線下 6° 左右,所以用戶界面不應放置在空間的正中間,而是略低于水平線。

現(xiàn)在,讓我們添加頸部運動。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 生理限制下頭部的垂直運動區(qū)域,來源:Mike Alger

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 生理限制下頭部的水平運動區(qū)域,來源:Mike Alger

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 身體在(舒適或)輕微壓力下,可以看到的物體區(qū)域,來源:Mike Alger

將所有這些放在一個圖表中就是 Mike Alger 的內(nèi)容區(qū)域:

用一篇超全面的文章,讓你掌握VR設計的基礎知識

Mike Alger 認為,距離用戶 0.5 米范圍內(nèi)不應該持續(xù)出現(xiàn)界面,因為距離太近會讓人難以專注。但是,這個區(qū)域(譯者注:No-No Zone)適合觸發(fā)設置和菜單的手勢交互,距離用戶超過 20 米的空間深度將無法被感知,因此,0.5 米到 20 米之間的區(qū)域被稱為黃金區(qū)(譯者注:Goldilocks Zone),這里展示的內(nèi)容可以被舒服地感知。

然而,鑒于目前基于屏幕的 VR 顯示器的技術限制,視線焦點在2米、內(nèi)容放置在 2-10 米之間會令人感覺最自然和舒適。將脖子和眼睛運動的生理范圍投射到黃金區(qū)上就是主要內(nèi)容區(qū)域(譯者注:Main Content Zone),設計師應該將重要的內(nèi)容放在這個區(qū)域。周邊區(qū)域(譯者注:Peripheral Zone)中的內(nèi)容只能通過我們的周邊視覺檢測到(除非轉頭),因此,它不適合放置重要的內(nèi)容。好奇區(qū)域(譯者注:Curiosity Zone)的內(nèi)容則需要我們將身體轉向它才能看到,這也是它名字的由來。

由此,你可以看到用戶的身體方向極大地影響了 VR 中的內(nèi)容放置和設計決定。

注意:在任何 VR 項目開始前回答以下問題非常重要,因為它影響著我們未來的設計決策。

  • 用戶體驗 VR 環(huán)境時將站著還是坐著?
  • 用戶在 VR 環(huán)境中將如何移動?
  • 如果站著,用戶可以在物理空間中走動嗎?
  • 如果坐著,椅子是可以旋轉的還是固定的?
2. 設計概念2:內(nèi)容尺寸

這個概念是由谷歌提出的,他們將 VR 界面屏幕稱為「虛擬屏幕」。

虛擬屏幕中的內(nèi)容尺寸應該如何決定?

每種尺寸的屏幕都有一個標準視距,決定了屏幕內(nèi)容的大小。通過內(nèi)容區(qū)域的概念,我們可以了解 VR 界面的視距。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

不同設備的標準視距,來源:Google I/O 2017

我們(VR體驗設計師)不僅僅是手機或電腦界面的設計師,我們還是廣告牌設計師、停車標志設計師和房間出口標志設計師。──Chris McKenzie,用戶體驗設計師,Google DayDream(2017)

VR 設計的挑戰(zhàn)在于保持內(nèi)容在不同屏幕尺寸下的一致性。針對這個,谷歌提出了不受距離影響的毫米(DMM)概念。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

dmm是什么?來源:Google I/O 2017

1 dmm(發(fā)音為「dim」)的定義是 1 米處的 1 毫米。該角度測量單位規(guī)范化了虛擬屏幕空間的尺寸,并有助于在不同距離和屏幕尺寸下保持內(nèi)容的一致性。

如何利用dmms來設計?

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 來源:Google I/O 2017(https://www.youtube.com/watch?v=ES9jArHRFHQ&feature=youtu.be

如上圖所示,左上角是屏幕空間坐標中的界面內(nèi)容,即 dmms。在 1 米處時,屏幕空間坐標和世界空間坐標之間沒有區(qū)別;但到 2 米處時,世界空間坐標變?yōu)槠聊豢臻g坐標的 2 倍,即屏幕尺寸增加到原來的 2 倍。因此,dmms 可以讓設計師更方便地根據(jù)距離縮放屏幕的大小,而不用擔心失去內(nèi)容的一致性。

dmm 現(xiàn)在有一個針對屏幕內(nèi)容的標準衡量單位,即谷歌制定的包含標準文字大小和命中區(qū)域的規(guī)范,可以作為 VR 設計的參考。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 谷歌VR指南,來源:Google I/O 2017

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 當需要長時間展示文字時,令人舒服的放置位置,來源: Mike Alger

VR 的三維空間為虛擬屏幕帶來了一些獨特的屬性,谷歌稱之為「超級力量」。

虛擬屏幕可以有深度

由于虛擬屏幕擁有 z 軸,因此它們可以具有深度。深度可用于表達元素之間的區(qū)別以及在屏幕內(nèi)容中建立層次結構。需要注意的是,我們對深度的感知能力會隨著距離而減少,如之前內(nèi)容區(qū)域中所述,我們對 20 米外的事物的深度幾乎沒有感知能力。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 虛擬屏幕深度的例子,來源:Google I/O 2017

虛擬屏幕可以是任何形狀

虛擬屏幕可以在任何形狀的載體上呈現(xiàn),它可以是平面屏、曲面屏、折疊屏或分離屏,載體的形狀影響著屏幕的內(nèi)容放置和交互方式。

用一篇超全面的文章,讓你掌握VR設計的基礎知識

△ 在三種不同形狀的載體上的虛擬屏幕,來源:Google I/O 2017

3. 設計概念3:用戶代入感和舒適性

用戶代入感

設計得好的 VR 體驗會讓我們感覺自己是虛擬空間的一部分,這種融入的感覺被稱為「代入感」。這個概念對于依賴互動的應用(如游戲和娛樂)尤為重要。

代入感可以通過以下方式實現(xiàn):

技術:保持幀速率穩(wěn)定并高于 60 fps 至關重要,它可以避免運動給用戶帶來的惡心;高質(zhì)量渲染使環(huán)境看起來更「逼真」;使用合適的聲音/音樂可以進一步增強代入感。

一致性:虛擬世界不必在每個細節(jié)上都和現(xiàn)實世界一模一樣,但是它應該像現(xiàn)實世界一樣始終遵循一套統(tǒng)一的規(guī)則。

探索精神與UI設計方法

每個人天生都具有好奇心。在一個陌生的虛擬現(xiàn)實世界中,好奇心使我們比平常更有探索欲。因此,為了更好地理解這個虛擬世界,我們不斷操作和探索,這種探索本能指導著 UI 設計。用戶應該如何與 VR 世界互動并沒有范例,因此,應用的目的在很大程度上決定了用戶界面和交互方式。 VR 應用根據(jù)它們的核心目標可以分為兩種基本類型:

1. 以體驗為核心的應用

在這種類型的應用中,設計師可以充分利用用戶的探索精神,因為用戶沒有特定的任務需要完成,他們也更愿意發(fā)現(xiàn)和學習與他們原有認知不同的界面和交互方式。游戲、故事和娛樂相關的 VR 應用是這種類型的典例。

2. 以任務為核心的應用

在以任務為中心的應用中,用戶有一個期望完成的任務,他們不太愿意探索和學習新的概念模型,除非新模型使完成這件事變得更加容易。這迫使設計師在設計這類應用時需要盡量遵循現(xiàn)有的交互模型和界面規(guī)范。

用戶定位

在一個陌生的虛擬現(xiàn)實環(huán)境中,我們需要花大約 10 秒鐘來定位。隨著與虛擬現(xiàn)實的接觸增加,這種適應時間也會逐漸減少。我們相對于虛擬對象與場景的位置,告訴我們所處的背景,并影響著我們對虛擬世界當前狀態(tài)的理解。如果初始場景的設置沒有給用戶提供足夠的信息,用戶就需要依靠文本、音效、語音和指引箭頭等來引導。為用戶提供背景信息的方法有很多,但不管用什么方法,都應該有意識地系統(tǒng)地規(guī)劃。

符合用戶期望原則

人類進化過程中,在生理和心理上都形成了一些關于世界的既定認識。無論在現(xiàn)實還是虛擬世界中,我們的潛意識都會產(chǎn)生這樣的期望。根據(jù)這些,我們可以歸納出以下 VR 設計準則

1. 不要在相機上附加任何東西

你有過眼鏡上有污漬的經(jīng)歷嗎?如果我們無法將視線從某些東西上移開,我們會很難受。因此將任何 UI 元素長期附加到相機上,都不利于用戶體驗。

2. 移動相機要溫和

攝像機應以恒定速度移動(上下左右),沒有任何加速/減速。相機切換的時候要快,而相機旋轉的時候則應該慢一些。如果你不了解這些知識和人的前庭系統(tǒng),就可能因為移動而使用戶產(chǎn)生惡心感。更好的方式是讓用戶自己調(diào)整相機的位置。

3. 遵循現(xiàn)實世界的尺度

想象一下,坐在看起來像普通沙發(fā)兩倍的沙發(fā)上?如果物體明顯大于或小于現(xiàn)實世界的物體,它會讓我們感覺自己像矮人或巨人。除非另有目的,否則虛擬現(xiàn)實應始終遵循現(xiàn)實世界的尺度。同樣,VR 中的視線高度應與用戶現(xiàn)實世界中的身高相匹配。眼動追蹤系統(tǒng)使這點實現(xiàn)起來更容易了,但即使沒有眼動追蹤系統(tǒng),也可以通過提前了解用戶的身高來實現(xiàn)。

4. 讓用戶始終感覺在地上

將用戶置于某種實體平面上,并通過視覺反饋不斷提醒他們「在地上」,沒有什么比「懸在空中」更令人難受了。

5. 設置天空/背景

用戶期望虛擬世界中擁有天空或背景,沒有這些,會令用戶困惑并影響沉浸感。

6. 不要驚嚇用戶

你是否曾經(jīng)被一輛你沒注意到的超速駕駛的汽車驚嚇到?非常驚悚,對吧?VR 世界中的物體應該平緩地朝向或遠離用戶移動,這樣才不會驚嚇他們。

7. 有意識地設計環(huán)境

用戶下意識地期望虛擬現(xiàn)實中的環(huán)境設計能夠讓他們知道什么是重要的。設計師應巧妙地引導用戶往預期的目標和方向前進。

8. 巧妙運用聲音

VR 中聲音的運用,可以加強空間感、按鈕和其他 UI 元素的響應。聲音可以影響 VR 體驗的基調(diào)。

9. 清晰的功能可見性

除非我們通過設計使功能直接明了,否則用戶不會知道 VR 中什么是可以操作的。這篇文章《What Do VR Interfaces and Teapots Have in Common?》通過比較茶壺和 VR 界面解釋了可見性的概念。通過巧妙地使用動效、尺寸變化、聲音、光和顏色,我們可以讓用戶了解元件的交互能力和狀態(tài)(如:選擇,懸停,活動狀態(tài)等)。

當然,這篇文章僅僅觸及了 VR 設計中比較基礎的部分,但我希望它能使你對 VR 設計中的挑戰(zhàn)和概念形成一個基本的了解。

原文鏈接:《New to VR? Here is what you must know to get started》?Raunaq Shah

歡迎關注譯者的微信公眾號:「彩云譯設計

用一篇超全面的文章,讓你掌握VR設計的基礎知識

收藏 92
點贊 31

復制本文鏈接 文章為作者獨立觀點不代表優(yōu)設網(wǎng)立場,未經(jīng)允許不得轉載。