VR開發教程:Unity開發VR眼鏡中文入門教程四
VR的使用者介面
在設計VR的使用者介面時,傳統的UI設計方案可能會出現一些問題,現在我們來討論和解決VR中製作使用者介面的問題.
UI的解析度和外觀
DK2的解析度是1920 x 1080 (960 x 1080 每隻眼), Gear VR 是 2560 x 1440 (1280 x 1440 每隻眼),這意味著在螢幕上能看得清任何元素的畫素.
特別要注意的是使用者介面元素在螢幕上的大小,我們推薦使用更大的字型或者加粗字型以及避免用很細的線設計介面.
UI型別
非故事類
在非VR專案中,UI通常覆蓋在螢幕上顯示如血條等資訊,我們稱之為HUD(抬頭顯示器).這就是所謂的非故事類介面,它不真實存在,但它有利於玩家檢視遊戲中的資訊.
這個詞同樣用在電影中作為非故事的聲音,如電影或電視的背景音樂.
在Unity中新增HUD樣式的非故事類UI是更改相機的UI Canvas渲染模式為Screen Space – Overlay或Screen Space實現的.
而VR中通常不用這種方法,我們眼睛無法集中在很近的一個點上,而且Screen Space-Overlay是不支援的.
空間UI
相反我們通常需要在場景中呈現我們的UI,把相機改成World SpaceCanvas渲染模式.這將讓我們的眼睛能聚焦到UI上,被稱為空間介面(Spatial UI)
在場景空間中放置UI也需要一些思考設計.太靠近使用者會引起視覺疲勞,太遠又會讓使用者覺得視點聚焦在地平線上,不過放置遠一些是適合在戶外場景中,小房間中就不適合了.還需要根據需求動態的縮放使用者介面的大小.
最好在一個相對舒適的閱讀距離上顯示使用者介面,並相應的調整它的尺寸.在Menu場景中可以看這個例子:它在面前幾米遠的距離,文字和影象都很大,很易於檢視.
如果在某些特定距離上進行空間使用者介面顯示,可能會發現介面與遊戲物件發生了穿插,那麼請看我們前面將的如何避免穿插或直接使用VR示例中的著色器.或者使用Text的著色器.
許多開發者最初會將使用者介面附加到相機上,所以當使用者移動視角時,介面會始終保持在視野中的一個固定位置,這如果用來做準心是很有用的,但如果是其他較大的介面元素就會影響到玩家的觀察視線,並可能導致使用者噁心不適感.在360度射擊遊戲示例中,介面會在檢視中做短暫的停留,便於使用者熟悉場景環境,避免遮擋使用者視野.
VR技術為我們提供了一個模擬360度真實環境的機會,有時我們可以需要顯示給使用者讓使用者去尋找一個特定的方向.在示例場景中,我們在場景中使用了一些箭頭來提示使用者找到正確的方向,如果方向在正常範圍內,這淡出箭頭提醒.
可以用GUIArrows預置,它們的用途就是比較頭部的角度,如果頭部角度超過預設角度(GUIArrows指令碼里Show Angle)時變會淡入提醒使用者往正確的方向看.
故事介面
空間介面的另一種實現方式就是將場景中的元素現實給使用者.這可能是牆上的一個掛鐘,電視機,顯示器,手機,或者一個帶有全息顯示的未來科技槍.這就是故事UI,我們可以看下示例Flyer場景的飛船介面或者射擊遊戲的槍的介面.
雖然這不是嚴格意義上的故事介面,但在能讓使用者能很直觀的得到遊戲中想要了解的資訊.
使用者介面開發的深入閱讀
深入分析這些型別的介面可以閱讀本文Gamasutra(www.gamasutra.com/view/feature/4286/game_ui_discoveries_what_players_.php).
使用者介面互動
利用前面VR互動中的VREyeRaycaster,VRInput, 和VRInteractiveItem我們可以建立一個類來處理使用者介面的互動.
在Maze場景中有一個特定的開關作為使用者介面互動,在每個遊戲開始前都有個閱讀說明介面,可檢視Oculus部落格上的“Unity’s UI System in VR”,那裡還提供了示例程式碼.
VR示例中的使用者介面
讓我們看看VR示例中用到了哪些技術製作使用者介面
Menu
在場景中自定義了彎曲網格來作為使用者介面.
Flyer
遊戲介紹和遊戲結束介面都是在世界空間裡的靜態介面.
然而,我們把一些重要資訊放在在了飛船上,作為故事介面能讓玩家隨時檢視到是很有意義的.
這個UI會始終旋轉面向鏡頭,這樣可以避免較大的傾斜角度影響使用者觀看閱讀介面.
Maze
在Maze場景,我們同樣用世界空間裡的靜態介面做了遊戲介紹和遊戲結束畫面.:
當觸控滑動可用時,場景中的使用者介面也被用來提示玩家進行互動.
Shooter 180 (Target Gallery)
用世界空間裡的靜態介面做了遊戲介紹和遊戲結束畫面:
正如上面所說的,在槍上用了故事介面來顯示分數和時間:
Shooter 360 (Target Arena)
最後,在這場景中用了空間使用者介面,但有輕微扭動,當玩家環顧四周時,我們在移動使用者介面中做了個短暫延遲,以滿足玩家自由的環顧四周.
同樣,槍上使用了固定的使用者介面:
VR中為文字做抗鋸齒
在場景中使用Canvas Scaler,UI就會有 “Reference Pixels Per Unit”設定項,預設為1,然後改變“Dynamic Pixels Per Unit”,知道看到文字略微柔化的邊緣.在這裡可以看到”Dynamic Pixels Per Unit”被設定為1.75和設定為3時的差異.設定為3時,邊緣較硬,設定為1.75時,邊緣會有點柔化.
我們現在應該可以使用VREyeRaycaster,VRInput, 和VRInteractiveItem來建立基本的互動介面了.
聯絡方式:0755-81699111
課程網址: http://www.vrkuo.com/course/vr.html
相關文章
- Unity3D開發入門教程(二)—— Lua入門Unity3D
- Unity3D開發入門教程(四)——用Lua實現元件Unity3D元件
- C#遊戲開發快速入門教程Unity5.5教程C#遊戲開發Unity
- 敏捷開發入門教程敏捷
- Unity下個月將推出開源VR編輯器,讓VR內容開發soeasyUnityVR
- 寫給VR手遊開發小白的教程:(四)補充篇,詳細介紹Unity中相機的投影矩陣VRUnity矩陣
- 虛幻4引擎Gear VR開發入門(上)VR
- 虛幻4引擎Gear VR開發入門(下)VR
- iOS VR視訊開發iOSVR
- Google VR 開發簡介GoVR
- 《VR入門系列教程》之9---谷歌紙盒VR谷歌
- 【Unity3D開發小遊戲】《戰棋小遊戲》Unity開發教程Unity3D遊戲
- ?HealthKit開發快速入門教程大學霸內部教程
- git 入門教程之協同開發Git
- Apple Watch開發快速入門教程APP
- OUYA遊戲開發快速入門教程遊戲開發
- AngularJS開發實戰入門教程AngularJS
- 【Android開發入門教程】四.使用者介面之LayoutAndroid
- 【Android 開發 VR 實戰】三. 開發一個尋寶類 VR 遊戲 TreasureHuntAndroidVR遊戲
- 【Android開發入門教程】三.Activity入門指南!Android
- 搭建CARDBOARD+ANDROID+unity3d的VR開發環境AndroidUnity3DVR開發環境
- HealthKit開發快速入門教程之HealthKit開發概述簡介
- QT開發快速入門-教程1:搭建QT開發環境QT開發環境
- 【三星官方教程】如何為Gear VR開發應用(五):新增功能VR
- Python開發的入門教程(五)-setPython
- Flutter入門教程(二)開發環境搭建Flutter開發環境
- odoo 開發入門教程系列-繼承(Inheritance)Odoo繼承
- odoo 開發入門教程系列-模組互動Odoo
- odoo 開發入門教程系列-QWeb簡史OdooWeb
- Node.js 原生開發入門完全教程Node.js
- Android手機遊戲開發入門教程Android遊戲開發
- Arduino可穿戴開發入門教程Arduino開發環境介紹UI開發環境
- 【URLOS開發入門】docker官方系統映象——Alpine入門教程Docker
- Web閱讀器開發系列教程(入門篇)Web
- web前端開發教程,最全JavaScript入門講解Web前端JavaScript
- Go Web開發(Gin框架)簡易入門教程GoWeb框架
- Python開發的入門教程(六)-函式Python函式
- 傻瓜式Android APP開發入門教程AndroidAPP