設計思考:做好AR界面設計,什么是關鍵?

2 評論 4508 瀏覽 6 收藏 13 分鐘

在進行AR界面設計時,設計師需要將“空間場景”這一概念融入設計當中,做好手勢識別、眼動識別等多種交互情景下的界面設計。那么怎樣才可以將“空間場景”植入設計場景里,并在視覺效果、相對關系和操作方式這三個維度上搭建好設計策略,保證用戶的使用體驗呢?

AR(Augmented Reality),就是我們常說的增強現實,是將計算機生成的虛擬信息疊加到用戶所在的真實世界的一種新興技術。做AR界面設計,就是做增強的界面設計(Augmented User interface,AUI),界面上更直觀的體現就是虛擬和現實的融合,但是,要做好它,光理解到這一層可遠遠不夠。

在之前的《XR界面交互,到底要設計的是什么?》中,我講了XR界面設計,其實最終要設計的是一個空間場景,AR也是一樣,需要設計師把空間場景這個詞語植入到自己設計的每個界面里。

只有把空間場景作為設計對象植入到自己設計的每個界面里,你才會理解所有的設計元素需要在環境中保持識別性,才會理解可以使用手勢識別、眼動識別等多交互手段讓用戶與空間中的元素交互,才會理解如何運用顏色、動效、照明、貼圖等一系列設計手段給予用戶反饋、營造氛圍,最終增強用戶體驗。

但是,對于設計師來說,什么才是真正地把空間場景這個詞植入到了自己設計的每個界面里呢?

01

首先,我們來看最簡單的一層應用。

我給過一個簡單的例子,如下面一張圖:

設計思考:做好AR界面設計,什么是關鍵?

我們看到過很多AR界面是這張圖的樣子,現有的界面被搬進了環境空間中。似乎很簡單,好像和其他屏幕界面設計沒什么不同,但真的是搬進去就行了嗎?

即使是這簡單的一步,在搬的過程中,也需要對這個界面進行色彩的調試,整個界面需要考慮環境背景的影響,如果是以AR眼鏡為終端的界面,純黑色是看不見的,應該說偏暗深的色系如果沒有一個明亮色系襯托,其識別性都不高。

色彩只是一個方面。

你還需要考慮其相對運動關系、顯示內容效果、操作交互方式等等。因為AR界面設計最后形成的用戶所見內容不單是我們設計的那部分虛擬元素,而是和真實元素進行增強后的所有內容,即真實世界本身存在的、用戶看見的畫面,它們一起被呈現給用戶。

如圖一那樣,通過考慮環境變量和設備技術,把原有的界面經過處理后“搬”進空間里,只是植入空間場景這個關鍵詞的簡單應用。

進一步的空間場景這個詞,不僅僅指用戶的場景,還指你設計的畫布。

做界面設計和作畫類似,都是在一張畫布上創作的,有些可惜的是,這張畫布暫時還只能是平面的,它常常會不經意間限制我們的想象,但是,當我們將空間場景這個詞植入到你設計的每張界面里,你就知道,你的畫布,其實不一定是平的,在場景里,它可以是彎的。

就像下面這張圖。

設計思考:做好AR界面設計,什么是關鍵?

藍色邊框的區域是當前AR眼鏡可以給予的顯示區域,我們叫它顯示FOV(Field of View),是以可顯示范圍的邊緣與人 眼的夾角來計算的,又可以分為水平FOV和垂直FOV。

微軟Hololens 2的顯示FOV只有43°×29°,遠遠小于我們很多手機攝像機能拍攝的范圍。要做大顯示FOV,這里面有很多技術難點,暫時沒有看見跨越性的突破,于是,為了讓AR頭戴設備的顯示 FOV大一些,市面上一些設備對FOV參數的描述已經開始使用對角線來計算了,這樣可使得出的數字顯得更大一些。

雖然技術的現狀還有些不盡人意,但好在的是,當我們在設計每張界面的時候植入空間場景這個認知后,它對我們的影響就會少了很多,因為,在一個空間場景中,用戶的位置和姿態是可變的,你的畫布也是可延展的,即使某一個時刻只能顯示一小部分,但那并不是全部。

就像我們人類的視覺系統,在某一個時間點,實際看到的是下面這張圖的鬼樣子。但是,我們最終感知到的可不是這樣。

設計思考:做好AR界面設計,什么是關鍵?

做好AR界面設計,知道你的設計對象是場景很關鍵,把空間場景這個認知植入到你設計每一張界面里,它關系到如何讓用戶產生身臨其境的感覺,如何讓用戶在虛實并存的環境中進行自然的操作。為了實現這一目標,視覺效果、相對關系、操作方式等都是我們需要考慮的內容。

02

1. 視覺效果

空間場景的視覺效果,主要關注三個要點:距離、朝向和色彩。

距離感是深度帶給用戶的最直接的感知。在設計中,距離體現在兩個設計維度中:第一個是元素間的相對關系,包括虛擬元素和虛擬元素之間,以及虛擬元素和真實元素之間的關系;第二個是每個元素相對用戶的具體距離,也就是每個元素在以用戶為原點的Z 軸上的位置。

朝向,是指虛擬元素用哪個角度面對用戶。在這里,我將朝向具體分為靜態朝向和動態朝向兩種。靜態朝向是指當用戶視角固定時,虛像面對用戶的那個角度。動態朝向是指當用戶視角發生變化時,虛像面對用戶的角度。

在手機、計算機等屏幕UI的設計中,由于我們大多面對的是二維界面,朝向問題可以忽略不計,但在AUI的場景中,除非你的虛擬元素是一個從各個角度看沒有任何區別的圓球,否則朝向就是一個需要考慮的問題。

色彩,之所以是空間場景設計中需要關注的要點,是因為我們最終感知到的色彩,其實是光的作用。它包含3個方面的影響:光源的照射、物體反射的可見光(物體色)、環境與空間通過光線作用后的色彩影響。也就是說,我們感知到的色彩是由光源色、物體色和環境色共同組成的。

2. 相對關系

空間場景的相對關系,第一層指它的位置。

在場景里雖然既有實也有虛,但在具體設計的時候,設計師的落腳點還是只有虛實里的虛像,為了更好地理解和設計這個可以落腳的虛像,我們需要引入物理學中的一個很基礎的概念:參考系。

參考系是指在物理學中用以測量并記錄位置、定位其他物體屬性的坐標系;或指與觀測者的運動狀態相關的觀測參考系;又或同指兩者。參考系又稱參照系、 基準系、坐標系、參考坐標等,因為AUI是虛實結合的畫面,它和真實的物理世界息息相關,所以要設計與之相結合的虛擬內容,就必須引入這個概念,并在設計中時時刻刻考慮到它。

按照參考系,我們將AUI的虛像分為兩個大類:一類參考系為真實的物理世界, 一類參考系為用戶。基于第一類參考系設計的虛像,豐富了物理世界本身的內容, 設計時需要更多地參考物理知識,讓它更自然而然地成為原本世界的一部分?;诘诙悈⒖枷翟O計的虛像,多為用戶隨時調用,從屬于用戶本身。對這個參考系的設計,我們可以認為它增強了人本身的能力,就像用戶的手腳、用戶的眼睛、用戶的耳朵等。設計應以用戶為尊,設計的成果應成為用戶自身的一部分。

空間場景的相對關系,還可以衍生出第二層,第二層更貼近整體感知。

第一層以參考系考量的虛像本身的相對位置關系,還可以進一步從更完整和更表象的感官層面,考慮不同的虛像和實像關系中所呈現的整體效果。按照業內比較通用且易理解的話術, 可以分為3類:融合虛擬、孿生虛擬、沉浸虛擬。

  1. 融合虛擬需要借助同步定位與地圖構建的技術,只有AR設備能夠認識到真實環境,才能實現與真實世界的融合顯示,這是我們期望的虛實疊加方式。
  2. 孿生虛擬模式中的虛擬內容一般在真實物體旁邊孿生顯示。用戶在看真實物體時,畫面以真實內容為主;用戶在看虛擬物體時,畫面以虛擬內容為主。
  3. 沉浸虛擬是指基本和現實環境無交互,用戶關注的畫面以虛擬內容為主的一種內容顯示模式。VR是這種類別最極端的應用。

3. 操作方式

最后,操作方式,是互動,也就是如何讓用戶在虛擬環境中進行自然的操作。

手勢、語音、控制器、觸屏、按鍵、鍵盤、觸控板、鼠標、腦電波、凝視,還有數據手套、腳踏控制、操縱桿、手寫筆等等等等。所有的輸入和輸出技術都可以為創建更自然的用戶界面提供機會,全看設計師如何運用。

總的來說,設計成功的AR界面關鍵在于融入空間場景的認知,由淺入深,從視覺效果、相對關系和操作方式三個大方面將這個概念深化運用,才能為用戶提供更好的AR界面體驗。

文中部分內容摘抄至《AR界面設計》。

專欄作家

林影落,微信公眾號:林間有影落,人人都是產品經理專欄作家。一枚會玩卡的用戶體驗設計師,《AR界面設計》作者,10年+UIUX設計經驗,專注于AR及智能化領域用戶體驗設計6年;設計&心理學教育背景,國家職業認證高級OH卡師/天賦挖掘教練。愿意用我的一份努力,讓設計這個領域在智能化的未來更有價值,讓設計師這個職業更加值錢!

本文原創發布于人人都是產品經理,未經許可,禁止轉載。

題圖來自 Unsplash,基于 CC0 協議

該文觀點僅代表作者本人,人人都是產品經理平臺僅提供信息存儲空間服務。

更多精彩內容,請關注人人都是產品經理微信公眾號或下載App
評論
評論請登錄
  1. 哈哈哈很棒的科普

    來自上海 回復
  2. 文章不錯

    來自中國 回復