作為一種較為新穎的交互方式，VR交互與常規(guī)應(yīng)用交互有所不同，而相應(yīng)的UI設(shè)計人員也需要尋找更恰當(dāng)?shù)脑O(shè)計策略，以適應(yīng)設(shè)備的發(fā)展與普及。那么在當(dāng)下，VR交互設(shè)計應(yīng)該怎么做？本篇文章里，作者便做了一定總結(jié)，一起來看。

我最近入手了VR設(shè)備，體驗大大超出預(yù)期，難怪老羅覺得VR是下一代硬件平臺，我覺得還真的有可能。在VR中有很多新奇的交互體驗，視覺沖擊感強，所以我對VR設(shè)計具體怎么做，充滿好奇，不知道你有沒有興趣？

不管你將來做不做VR設(shè)計，其實都應(yīng)該了解一下，作為設(shè)計的廣度，拓展下知識面也是必要的，萬一哪天就要做了呢？就像多年前的UI設(shè)計一樣，所以這篇文章值得點贊收藏。

之前也有寫過兩篇VR相關(guān)文章，結(jié)合起來看效果會更好。下面2篇，同樣超干貨，值得一讀。

• 《國外大佬手把手教你從0開始學(xué)好VR設(shè)計》
• 《想了解VR設(shè)計？看完這篇就夠了！》

VR應(yīng)用具有非常直觀的UI界面，與可穿戴設(shè)備、手機、平板、PC上的應(yīng)用類似，使得大眾能夠使用VR。想出新穎的交互會比較有趣，但它卻增加了用戶的學(xué)習(xí)曲線。

類似于2D界面，VR設(shè)計師會用大小、對比和顏色設(shè)計出界面層次結(jié)構(gòu)。在VR里，大小取決于用戶和內(nèi)容之間的距離，因此了解內(nèi)容的大小和適當(dāng)?shù)挠^看距離至關(guān)重要。

比如，知道要設(shè)計多大的字體是很棘手的，但幸運的是，在現(xiàn)實世界中有很多先例。在為VR設(shè)計內(nèi)容時，對印刷設(shè)計（廣告牌、海報、書籍）也需要類似的思考，對VR設(shè)計有借鑒意義。

考慮下你現(xiàn)在是如何與一個觸摸屏進行互動。我們必須慢慢去學(xué)習(xí)理解許多模式，比如滑動、捏縮放，長按出現(xiàn)更多選項。這些在做VR設(shè)計時也必須要去考慮好。

我相信隨著越來越多的設(shè)計師進入VR領(lǐng)域，將會有更多的想法來創(chuàng)建和打造新的UI模式，從而幫助行業(yè)向前發(fā)展。

一、視野

視野，或任何給定時間可觀察環(huán)境的范圍，是設(shè)計VR界面時非常重要的一個方面。更寬的視野，用戶在體驗過程中的沉靜感就更強。有2種類型的FOV共同作用形成人類視覺。

單眼FOV描述的是我們一只眼睛的視野。對于一只健康的眼睛，單眼FOV的視野水平在170°-175°，包括從瞳孔到鼻子的角度。鼻前視野FOV通常為50°-65°，對于鼻子較大的人來說較小，而從瞳孔到頭部一側(cè)的視野為顳FOV，其較寬，通常為100°-110°。

二、新建Figma文件

1. 畫板

當(dāng)做VR設(shè)計時，我使用的畫板尺寸為3600×1800（360度），然后我繪制出完美的FOV區(qū)域來集中主要設(shè)計。

2. 消失點

在透視理論中有一個消失點的概念，這個概念在VR設(shè)計中很有用，因為它能幫助設(shè)計師在設(shè)計軟件中創(chuàng)建一個便于感知深度和距離的參考。

我總結(jié)了一種在我的設(shè)計中創(chuàng)建消失點的方法，通過在一個圓內(nèi)以10-15度的角度畫分隔線。之后，我將線條引入畫板，并拉伸線條，直到它在框架內(nèi)。

完成后，將以連續(xù)間隔的直線放到畫板中。（彩云注：這個方法也很適合用到畫透視線中）

3. 選擇主題并豐富背景

一旦消失點畫好了，主要的參考線已經(jīng)變明朗了，接下來就取決于你想如何在環(huán)境中發(fā)揮創(chuàng)造力。

大多數(shù)時候，我使用漸變來創(chuàng)建天空和陸地等效果，然后添加了氣泡、結(jié)構(gòu)或使用形狀的建筑物，這為環(huán)境添加了很多細(xì)節(jié)，使其感覺更3D逼真。

4. 設(shè)計UI

到這一步的時候，你可以基于產(chǎn)品目標(biāo)開始設(shè)計UI了。在設(shè)計VR時，對比是最重要的，因此，盡量減少文本和背景周圍的顏色。

通常，背景一般是半透明，在UI設(shè)計中一個白色背景最好適配深色環(huán)境，而對于深色背景最好適配白色環(huán)境。按鈕通常包括兩種形式，主要按鈕和次要按鈕，顏色保持簡單同樣是最好的。

5. 布局

與桌面和手機的傳統(tǒng)UI設(shè)計不同，在VR或者AR中，嵌套導(dǎo)航保持在同一環(huán)境中，而界面框架利用了環(huán)境中可用的巨大空間。

只有當(dāng)有新的游戲場景可供探索時，環(huán)境才會發(fā)生變化。其他時候，也可以實現(xiàn)彈出窗口，新層疊加在舊UI之上。

6. 使用XR工具創(chuàng)建曲面UI

僅用Figma就可以了，設(shè)計工具這塊原來就足夠了，有一種快速簡單的方法來設(shè)計原型3D，VR，AR界面。

有一個插件叫3D UI Generator，能夠自動縮放和調(diào)整任何圖形，畫板以創(chuàng)建3D界面和環(huán)境。它支持旋轉(zhuǎn)、斜切、縮放、遠近、FOV、曲面程度和等距視圖。在Figma上可以安裝 3D for XR https://www.figma.com/community/plugin/1043890631255427270/3D-for-XR

7. 聲音用戶體驗

雖然在使用網(wǎng)頁或APP時，聲音往往很煩人，但它是VR開發(fā)不可或缺的一部分?？紤]通感現(xiàn)象，其中一種感覺的刺激導(dǎo)致另一種感覺自動觸發(fā)。

例如，你聞到一些東西，就會產(chǎn)生味覺錯覺。這也適用于聲音。由于VR中仍然缺乏觸覺反饋，因此當(dāng)用戶觸摸物體時，聲音是提供反饋的一種很好的方式。

3D聲音（又稱Holophonic聲音）仍處于起步階段，但將對我們體驗VR的方式產(chǎn)生變革。我們都習(xí)慣于立體聲，它提供來自兩個聲道（左/右）的聲音，但全音可以讓我們分辨聲音是來自上方、下方還是后方。

想想當(dāng)你在外面聽到飛機的聲音，你憑直覺向上看，對嗎？在VR中擁有這種聲音體驗將使用戶真正身臨其境。

三、總結(jié)

這是VR設(shè)計最基本的底層原理。這幾篇VR相關(guān)文章一起看完，總算讓VR中的設(shè)計不再神秘了。

元宇宙是未來發(fā)展一大趨勢，不少人都想上這趟車，VR設(shè)計就是最靠近這一趨勢的領(lǐng)域之一，VR設(shè)計師這個崗位在將來會越來越緊缺。

為我投票

我在參加人人都是產(chǎn)品經(jīng)理2022年度作者評選，希望喜歡我的文章的朋友都能來支持我一下~

點擊下方鏈接進入我的個人參選頁面，點擊紅心即可為我投票。

每人每天最多可投35票，投票即可獲得抽獎機會，抽取書籍、人人都是產(chǎn)品經(jīng)理紀(jì)念周邊和起點課堂會員等好禮哦！

投票傳送門：https://996.pm/MZ9B9