想了解VR設計?看完這篇就夠了!

6 評論 8348 瀏覽 61 收藏 25 分鐘

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

本文旨在向不了解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內容時代的開始。

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

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

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

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

(3)重新定義購物方式

房地產和電商行業(yè)已經開始采用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)內容位置

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

(2)用戶安全

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

輸入方法

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

(1)射線輸入

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

想了解VR設計?看完這篇就夠了!

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

想了解VR設計?看完這篇就夠了!

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

(2)注視輸入

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

想了解VR設計?看完這篇就夠了!

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

(3)手勢輸入

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

想了解VR設計?看完這篇就夠了!

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

想了解VR設計?看完這篇就夠了!

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

想了解VR設計?看完這篇就夠了!

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

虛擬現(xiàn)實設備

想了解VR設計?看完這篇就夠了!

以下列表能讓你快速了解目前VR市場上流行的設備,更多介紹查看:(https://medium.com/@mccannatron/virtual-reality-vr-market-ecosystem-map-e6090af2e2af)

  • 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:Mike Alger的內容區(qū)域

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

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

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

想了解VR設計?看完這篇就夠了!

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

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

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

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

  1. 用戶體驗VR環(huán)境時將站著還是坐著?
  2. 用戶在VR環(huán)境中將如何移動?
  3. 如果站著,用戶可以在物理空間中走動嗎?
  4. 如果坐著,椅子是可以旋轉的還是固定的?

設計概念2:內容尺寸

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

虛擬屏幕中的內容尺寸應該如何決定?

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

想了解VR設計?看完這篇就夠了!

不同設備的標準視距,來源:Google I/O 2017(https://www.youtube.com/watch?v=ES9jArHRFHQ&feature=youtu.be)

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

—— Chris McKenzie,用戶體驗設計師,Google DayDream(2017)

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

想了解VR設計?看完這篇就夠了!

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

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

如何利用dmms來設計?

想了解VR設計?看完這篇就夠了!

來源:Google I/O 2017

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

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

想了解VR設計?看完這篇就夠了!

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

想了解VR設計?看完這篇就夠了!

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

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

(1)虛擬屏幕可以有深度

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

想了解VR設計?看完這篇就夠了!

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

(2)虛擬屏幕可以是任何形狀

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

想了解VR設計?看完這篇就夠了!

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

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

(1)用戶代入感

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

  1. 技術:保持幀速率穩(wěn)定并高于60 fps至關重要,它可以避免運動給用戶帶來的惡心;高質量渲染使環(huán)境看起來更「逼真」;使用合適的聲音/音樂可以進一步增強代入感。
  2. 一致性:虛擬世界不必在每個細節(jié)上都和現(xiàn)實世界一模一樣,但是它應該像現(xiàn)實世界一樣始終遵循一套統(tǒng)一的規(guī)則。

(2)探索精神與UI設計方法

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

VR應用根據(jù)它們的核心目標可以分為兩種基本類型:

1)以體驗為核心的應用

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

2)以任務為核心的應用

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

(3)用戶定位

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

(4)符合用戶期望原則

人類進化過程中,在生理和心理上都形成了一些關于世界的既定認識。無論在現(xiàn)實還是虛擬世界中,我們的潛意識都會產生這樣的期望。根據(jù)這些,我們可以歸納出以下VR設計準則。 (資料來源:https://virtualrealitypop.com/practical-vr-ce80427e8e9d&http://blog.leapmotion.com/designing-vr-tools-good-bad-ugly/)

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

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

2)移動相機要溫和

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

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)不要驚嚇用戶

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

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

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

8)巧妙運用聲音

VR中聲音的運用,可以加強空間感、按鈕和其他UI元素的響應。聲音可以影響VR體驗的基調,更多信息查看:http://blog.leapmotion.com/4-ways-unleash-power-sound-vr/ & http://designingsound.org/2016/03/01/audio-design-for-vr-ustwos-lands-end/ 。

9)清晰的功能可見性

除非我們通過設計使功能直接明了,否則用戶不會知道VR中什么是可以操作的。這篇文章(http://blog.leapmotion.com/vr-interfaces-teapots-common/)通過比較茶壺和VR界面解釋了可見性的概念。通過巧妙地使用動效、尺寸變化、聲音、光和/或顏色,我們可以讓用戶了解元件的交互能力和狀態(tài)(如:選擇,懸停,活動狀態(tài)等)。

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

 

原文:https://uxdesign.cc/new-to-vr-here-is-what-you-must-know-to-get-started-bc98996ffe46

作者:Raunaq Shah

譯者: Melody,公眾號:彩云譯設計

本文由 @彩云sky 原創(chuàng)發(fā)布于人人都是產品經理。未經許可,禁止轉載

題圖來自Unsplash,基于CC0協(xié)議

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 你好,我是一個剛剛從事vr行業(yè)的產品,想請教下這行業(yè)發(fā)展咋地,咋感覺一片昏暗。

    來自北京 回復
    1. 我認為,目前來看你的感覺沒有錯 :mrgreen:

      來自江西 回復
    2. 感覺ok,很對

      來自廣東 回復
    3. 可加我微信,一起探討探討,我也是剛加入這行的產品

      回復
    4. 可以加微信一起探討嗎

      來自北京 回復
    5. 我也是,有微信嗎,一起探討下

      來自湖北 回復