神魂顛倒論壇logo

icon
首頁Mobile行動手機與平板Apple 交流iPhone Apps軟體下載區 → [iPhone 遊戲]一個月的VR設計[MUX翻譯]

雷射溶脂 | 瘦小腹 | 植髮 | 眼袋 | 玻尿酸 | 電波拉皮 | Flash | 購物車 | Flash Player 11.2 | 豐胸 |

下一主題 上一主題


[iPhone 遊戲]一個月的VR設計[MUX翻譯]


[iPhone 遊戲]一個月的VR設計[MUX翻譯] 簡版






[iPhone 遊戲]一個月的VR設計[MUX翻譯]

類型:
iPhone 遊戲



在新視窗檢視

在4月份的時候,我花了幾個星期為三星Gear VR做設計。我想分享一下我為什麼要在VR領域做hack-a-month(在新團隊試驗工作的一段時間的術語),以及這短短兩周我在設計程序和設計樣式中的一些發現。

為什麼選VR?

我在學校學習的是工業設計和人機互動專業。我最大的興趣之一就是打通兩個學科。在當時,這意味?設計一個電子裝置的全部,所以我的大四專案就是設計一部手機——的要設計手機的物理形式又要設計數位界面和生態系統。而最讓我興奮的是事例互動,可以貫穿物理和數位平台。但是,現實世界中ID(工業設計)+HCI(人機互動)的應用非常少見。我最終在一家工業設計顧問公司工作,一年後我離開了,我的3D塑模技能從那時開始就很少用了。

?

在新視窗檢視

?

我+早期用iPhone加速感應器類比的頭部轉動模型

幾個月前,我參觀了Oculus 實驗室,這是在他們搬入Facebook不久後。我立刻想起了我在融合物理和數位界面方面的熱情。由於我程式碼方面的有經驗,這意味?我可以掌控整個設計和模型製作的程序。

在facebook ,鼓勵也支援員工追求他們有*的專案。我和我的經理一起組態我的工作時間,看是否有機會在VR工作。最終他給我安排出了一個hack-a-month,去和Joyce Hsu,?Sean Liu, 以及Joe Lifrieri一起工作。在四月的時候,我飛往加利福尼亞參正式開始這段工作。

設計工具:Unity vs Quartz Composer

(沒有相應軟體經驗的同學,此段會暈,可略過)

在Oculus我學到的第一個興奮的工作流程是他們是從 photoshop → Cinema 4D? →Unity → 程式碼(如果他們選擇不在Unity裡面做的話)

Unity就像Flash的3D版本。在場景裡面有可以行動的所見即所得的對象,同樣你也可以附上指令碼/直譯式程式做一些互動動作。大量的遊戲都是用它來製作的-它是跨平台的而且有很好的線上社區可以問答。

?

在新視窗檢視

?

你也需要用到這個荒涼的IDE叫做Monodevelop,它不支援OS X的文本編輯快捷作業,也不支援合適的vim編輯器…並且需要寫C語言或是一個輕微定製版本的javascript

自從在facebook撿起 ?,在驗證新互動模型的程序中,我最看重的一件事是調整和測試之間的即時回饋閉環。Unity 允許在一些專案進行時進行變數的調整,但是那先變化在播放後就會立即遺失。Unity的監視器管理和 Oculus DK2也會減慢閉環的迭代速度。一個DK2可以作為一個獨立的1080p解析度下全螢幕的監視器,但是Unity 不能提供即時的全螢幕視圖,除非你真的每次建立一個獨立的os x 或是android app。

由於unity的缺點,我決定研究一下QC來支援一下DK2。現有的線上外掛程式不能夠支援最新的sdk,所以我花了一晚把基礎的方向角打成更新檔,並且演算上色了兩個平面圖(沒有立體圖)結果呢?效果非常好。雖然沒有了深度感,但是我決定我可以很容易的把靜態UI放在Unity中,來測試3D場景中的放置。

?

在新視窗檢視

?

現在,有了在DK2上面設定的QC,我可以非常快速的迭代、調整、驗證

為了VR環境而設計

一個行動UI設計新手的暴露的標記是排版和點選目標過小。任何新的人體輸入形式,都需要調整界面,讓其容易被使用。對於VR來說,我發現有幾個主要的點對我的設計衝擊很大。

讓內容在一個舒適的可視區

在我做 hack-a-mouth之前,我做的第一個設計練習,是嘗試用Unity做出一些腦海中關於知會的模型。當你在虛擬現實中的時候,你被完全的從現實中隔開,快速的收到知會並且回復對你來說就非常有用。當時我並沒有DK2,所以我在桌面上建立所有模型。我認為這個元素應該掛在螢幕幕邊緣,如果快速轉動你的頭去看他們,它們會迅速行動到可視角度的中間並且啟動。

?

在新視窗檢視

?

不幸的是當我拿到DK2並且嘗試做模型時,發現完全失敗了:當你帶上頭盔,在你可視範圍邊緣的懸浮的物體是很難聚焦的。你可以這就試試:在你視線邊緣嘗試讀你手機的內容,並且不能轉頭,只能轉動眼睛。

結果當我開始hack-a-month的時候,團隊成員告訴我這是最好的初期練習之一:讓內容在特定的訊框架內,並且要在你的可視範圍中央。

為有限的頭部轉動,設計簡單的互動

最大的物理約束就是你戴了一個笨重的眼鏡。我有一個知會原型的想法,就是偵測頭部轉動的速度或角度,來作為啟動知會的意圖。在實踐中,它實在太尷尬了。Oculus團隊開始研發一個模型:在GEAR VR的觸控板上滑動,來避免這種限制,特別是有大量聚合內容要展現時(如應用商店)。這樣你就可以把周圍的內容呈現到眼前,而不需要讓頭部轉動太多。



我發現滑動是種讓人迷惑的互動方式,和眼鏡邊安裝的觸控板沒有什麼關聯性。在我「hack-a-month」中最新的一個界面設計中,Joyce和我用Sketch和PS快速探討了多種布局方式。我們很快淘汰了一些布局(柵格是種給人感覺不知所措又包含了無限內容的集合,然而我們想要的內容集合是感覺上單向且舒服的)

?

在新視窗檢視

我朝一個單行內容行動,開始你聚焦在第一個上,允許水平捲動。然而我不想去滑動,而且有個頁面控制浮動按鈕感覺累贅。我決定試試對映一個舒適視場的全部捲動寬度(~ 90度)。做了一些改進,像翻頁一樣貼合到任一內容,而不只是流體捲動,事實上它也以一個我們感覺很不錯的結果而告終。

?

懸浮狀態東山再起

在行動端,設計師們失去了一個有價值的工具,用來展示有遞進關係的內容和一個實用的圖層,就是懸浮狀態,在電腦和網頁時代長期被用於任何事物從工具提示到OS X的放大版DOCK。在虛擬現實中,懸浮狀態以視線方向的形式又回歸了。看?一個物體或控制住,可以透露出你可能不知道的更多訊息,就像一個縮略版的影片預覽。

另一件事我在第一個原型里嘗試的,是一個用「看?並且保持住」或「長時間注視」的互動方式去啟動內容而不需要任何形式的輸入。這是一個在Kinect界面里重度使用並且總是讓我感覺很好的互動方式,我想它可能會在VR領域裡更好用,因為這比在空氣中搖頭的準確度更高。不幸的是,當其它輸入方式允許你看?一個事物不需要互動,「看?並且保持住」則讓你的目光休息變得有些難,事實上在閱讀中還要擔心什麼東西會被觸發。

當我開始第一個專案,第一件我想要試試的事(還有些JOE的推動)就是為用游標作為選單瀏覽的影片遊戲,類比一個普通的互動方式:直接貼近最接近的互動欄位來補償不準確的游標控制。在虛擬現實中,游標事實上是相當準確的,但是它依然比只做必要的確切精準動作要難一些。

?

在新視窗檢視

?

我發現加入熱區去處理5~10度間的視線夾角是一個好的經驗法則(拇指規則)。這意味?某些事物你可以只通過視覺設計,就像影片行程欄一樣做的很窄,卻依然可以舒適的擦過而不再需要滑離控制。

另一件事我發現當用Quartz Composer做一個游標動效的時候,隱藏游標(或對它進行動畫處理,看起來它就像是貼近到控制項的懸浮狀態)實際上降低了游標與特定控制項間對齊的難度。

虛擬現實設計中結束時的思考

在「hack-a-month」的最後,我以一個非常立體的原型和新的互動方式為結尾,給了我工作的團隊一些靈感。所有的原型都用Quartz Composer做到了高保真的效果,在相對較短的時間裡(「hack-a-month」實際上只有2.5周)。不幸的是,我不能在旁邊經歷實作出的效果,但是我很興奮的看到了設計是如何應用到實際使用中的。

下一個是什麼:工具

在過去的幾年裡作為一個產品設計師,一件讓我越來越清晰的事就是:設計和程式碼的相互作用對我有?強烈的激發。通過我的設計經歷,我最喜歡的時刻就是那些當我遇到的技術障礙檢驗了設計方向的時候。不管是學習Objective C來攻克時間點,還是在JS中度過資料人生。

虛擬現實的工作進一步證明,我依然享受思考產品和設計在立體空間中的新的互動方式,我最喜歡的事就是搭建工具來幫助證明設計決策。這就是為什麼我和Brandon Walkin對我們在FACEBOOK的設計工具開啟了一個嚴肅而長遠的審視,他領導了Origami的開發。如果你喜歡設計工具的工作,並且在紐約生活也在你的日程中,就洽詢吧!

?

?

原文地址:https://medium.com/facebook-design/a-month-designing-in-vr-62474aef1f1c

譯文只有作學習用途,如有其它用途請洽詢原作者。

譯文轉載:本文來自MUX

keep calm and be awesome

?

想在手機查閱更多iPhone 遊戲資訊?免費下載【香港矽谷】Android App

在新視窗檢視







原文站台: 百度MUX











在新視窗檢視

分享到Facebook





雷射溶脂 | 回到頂部
下一主題 上一主題