致開發者：全套 AR 應用設計攻略都在這裡！

通過將虛擬內容與現實世界融合，增強現實技術 (AR) 以身臨其境的互動式體驗，增強了我們與周圍世界的交流與互動。ARCore 正是為了讓大家能在 Android 上輕鬆構建增強現實應用而誕生。利用動作跟蹤、環境理解和光估測這三項關鍵技術，將虛擬內容與用戶通過手機攝像頭看到的真實世界整合在一起。

從根本上說，ARCore 做了兩件事：在移動設備移動時跟蹤它的位置，並構建自己對現實世界的理解。

本文是基於對教育、購物、藝術及遊戲等案例的基礎研究及早期 AR 應用設計經驗，對 AR 應用設計提供的一些設計指南，我們相信本指南的內容也會隨著大家的探索而進一步演進。我們整理出這篇長文，希望幫助您建立一套 AR 體驗設計的基礎性和框架性的認識，並能對您的應用設計有所啟發。

環境

1. 現實世界的環境

AR 設計意味著需要針對許多不同的環境場景進行設計。您需要幫助用戶理解使用您的應用的理想環境條件。從屋內的私密空間到廣闊開放的外部環境，您需要考慮到用戶使用您的應用的可能場景，並預測其中存在的潛在障礙，並確保和用戶做出有效的溝通和提示。

GIF

2. 增強環境

增強環境是設備攝像頭捕獲的現實世界圖像與虛擬內容 (如數字物體或信息) 的結合。

當您的手機在現實世界中移動時，ARCore 會通過一個名為並行測距與映射 (Concurrent Odometry and Mapping, COM) 的過程來理解手機相對於周圍世界的位置。ARCore 會檢測捕獲的攝像頭圖像中的視覺差異特徵 (稱為特徵點)，並使用這些點來計算其位置變化。這些視覺信息將與設備感測器測量結果結合，一起用於估測攝像頭隨著時間推移而相對於周圍世界的姿態 (位置和朝向)。

通過將渲染 3D 內容的虛擬攝像頭的姿態與 ARCore 提供的設備攝像頭的姿態對齊，開發者能夠從正確的透視角度渲染虛擬內容。渲染的虛擬圖像可以疊加到從設備攝像頭獲取的圖像上，讓虛擬內容看起來就像現實世界的一部分一樣。

而通過檢測特徵點和平面，ARCore 將不斷改進其對現實環境的理解。ARCore 可以查找看起來位於常見水平或傾斜表面上的成簇特徵點，並讓這些表面可以在您的應用用作承載內容的平面。

請注意，如果用戶移動到了預設的交互區域的邊界，請做出明確的提示，並引導用戶回到正確的位置。

GIF

用戶差異

1. 用戶的移動

用戶才剛開始嘗試著熟悉 360 度實時環境交互，所以在他們最初進行 AR 體驗時，由於習慣了 2D 交互，往往都傾向於保持靜止。如果應用體驗需要探索環境才能實現，或者用戶沉浸在體驗中不願移動，則需要您來推動用戶。例如，將虛擬角色稍微放在視野之外，迫使用戶移動並探索它。

通常來說，根據每個用戶的環境和舒適度，他的移動可能會經歷四個階段 —— 坐著且雙手固定，坐著但雙手移動，站定且雙手固定，自由移動。每個階段都有重要的注意事項，如需注意保持用戶的舒適度等。此外，雖然移動可能會提高用戶的參與度，但除非必要，否則不要強制用戶移動。

另外也需要考慮用戶由於身體條件等原因確實無法移動的可能 (如疲勞，或者其他主客觀原因) 。如果用戶無法移動，則需要提供替代的體驗方式。譬如說，不再鼓勵用戶靠近，而是強調其他活動，比如說物體交互及變換。但這個時候，確保文字及註解在各個角度都清晰可見則十分重要。

GIF

確保文字在各個角度都清晰可見

2. 用戶舒適度

考慮到長時間拿著移動設備可能會很累，您需要時刻注意用戶的身體舒適度：在您應用體驗的所有階段都考慮到用戶的身體舒適度；注意控制應用體驗的時長，考慮用戶何時需要休息；讓用戶可以暫停或保存進度，以使他們隨時隨地都可以繼續體驗。

3. 減少用戶的挫折感

您還需要預測用戶所處空間的局限性 —— 室內或室外，空間的實體大小，以及包括傢具、物體或人在內的障礙物。雖然無法準確預知用戶在使用應用時的位置，但可以盡量提供建議或反饋以減少用戶的沮喪感。

GIF

注意用戶空間狀況

初始化並添加虛擬內容

1. 平面發現

平面發現包括查找與檢測兩個階段。

首先，ARCore 通過識別視覺上不同的特徵點來檢測平面。您需要為用戶提供有關如何掃描其環境的明確說明。此外，請使用清晰的視覺線索來引導用戶正確地移動手機，以便準確捕捉他們的環境。

當用戶掃描他們的環境時，根據平面檢測結果，您需要提供關於用戶下一步應該做什麼的指導性提示 (例如放置物體或修改手機動作)。

在多重平面上，您可以利用平面可視化來幫助用戶放置物體。譬如說，突出顯示已檢測到且可以放置物體的平面；創建不同平面之間的視覺差異，以免之後放置 3D 物體時出現混淆；突出顯示用戶正在查看或指向的平面，而不要一次性突出多個平面。

GIF

創造不同平面之間的視覺差異

2. 最佳放置範圍

最佳放置範圍有助於確保用戶將物體放置在舒適的觀看距離上。為了確定最佳放置位置，您需要將場景進行分段、設置最大放置距離並確立目標點。

透過移動屏幕上的有限視野觀察世界時，可能會妨礙用戶感知深度、比例和距離，並影響用戶的應用體驗以及與物體進行交互的能力。尤其是深度感知，完全基於物體放置位置而改變。為幫助用戶更好地了解其環境中的深度，您可以通過標記屏幕的三個不同區域 —— 離用戶最近的前台、離用戶最遠的後台以及用戶最佳觀看範圍的中央舞台 —— 來考量舒適的觀看範圍。但請注意，三個區域的劃分與手機的視角有關。

而後，您需要引導用戶在場景中放置對象，幫助他們避免將物體置於場景內不舒適的距離。而設置最大放置距離的默認值有助於確保將物體放置在舒適的觀看距離內，也確保了用戶在繼續拖動該物體時可保持真實的比例。

此外，您可以使用視覺提示來指導用戶放置物體，比如陰影可以幫助指示目標點 (最終放置物體的位置)，並且使用戶更容易理解應該將物體放置在檢測到的平面上的哪個位置。

GIF

利用陰影來指明目標點

3. 放置

物體放置是指將虛擬內容置於現實世界的環境中，分為自動放置及手動放置兩種方式，您可以根據實際情況選擇適合您的應用體驗的方式。

自動放置是由應用控制的，一旦檢測到平面，虛擬物體就會被自動置於場景之中。

GIF

虛擬物體自動置於場景之中

手動放置是由用戶控制的，用戶可自行在場景內放置並移動物體。例如通過錨定一個遊戲空間或設置位置來啟動 AR 體驗。

與虛擬物體進行交互

1. 選取

物體選取意味著用戶可以識別、操控虛擬物體並與其進行交互。您可以通過創建視覺提示來突出用戶可以互動的物體。

GIF

突出用戶可以互動的物體

2. 平移

平移允許用戶沿著平面移動虛擬物體，或者將其從一個平面移動到另一個平面。用戶在選中物體之後，可以使用手指進行拖拽或實際移動手機設備。

GIF

選中物體並拖拽移動

3. 旋轉

旋轉是指使物體定向轉動到預定方向，包含自動及手動兩種方式。除非是故意設計的體驗，否則應盡量避免自動旋轉，以免讓用戶困惑。

4. 縮放

縮放指的是放大或縮小物體尺寸的能力，通常通過張合手勢 (Pinch Gesture) 來實現。

GIF

手指張合來進行縮放

5. 接近度和手勢

重疊在一起的物體可能會導致用戶難以選取，尺寸過小的交互對象也難以進行互動。

為了實現最佳的交互效果，您需要仔細考量觸摸目標的尺寸。對於用戶來說，對很小或距離很遠的物體進行精確操作是一個挑戰。當應用在物體附近檢測到手勢動作時，都會假定有用戶正在嘗試與其交互，您需要為其提供尺寸合理的觸摸目標 (比如臨時提供大一圈的 「交互用輪廓」 )，即使物體本身尺寸較小。

GIF

提供尺寸合理的觸摸目標

此外，您還需要為手勢和交互創建一套統一的系統。每個手勢對應到特定的交互或任務，避免使用類似的手勢來完成不同類型的任務。

設計應用體驗

1. UI 組件

設計 UI 組件來打造身臨其境的用戶體驗，力求在視覺上將現實空間和虛擬空間無縫整合：

畫廊 / 道具庫：擁有很多道具可供選擇是好事，但要盡量避免讓用戶在場景和屏幕之間來回切換，因為這可能會分散注意力並降低 AR 本身的沉浸感。試著減少屏幕上 UI 元素的數量，或將這些控制項放置在場景中。

刪除：利用用戶熟悉的方式，如將物體拖到垃圾桶圖標上以刪除它。

重置：當系統無響應或者應用體驗是基於任務完成度推進 (例如遊戲) 時，允許用戶放棄當前的體驗並重新開始。

許可權：僅在用戶需要推進相關體驗時才顯現許可權，否則用戶會猶豫是否授權。此外，還需明確告知每個許可權的用處和相關性。例如，告訴用戶為什麼需要訪問他們設備的攝像頭或位置。

錯誤：在設計時，需要讓用戶輕鬆地從錯誤中回復狀態。您可以使用可視化提示、動畫和文本的組合來為問題 (不論是系統相關還是用戶造成的問題) 提供清晰的解決方案。但需注意，指明錯誤的時候不可責怪用戶，只需引導用戶採取正確的行動即可。

GIF

上圖左: 正確。簡單的停靠菜單來避免注意力分散。

上圖右: 錯誤。不要讓用戶在 3D 場景和 2D 屏幕之間來回切換。

2. 體驗

界面：體驗有足夠的代入感，但同樣要讓用戶感覺可控。

初始化：需明確從 2D 到 AR 的轉換過程，可以使用視覺技術來清晰地指示系統狀態。例如，當轉換即將發生時，調暗手機或使用特效模糊屏幕。

新手流程和說明：允許用戶快速啟動 AR 體驗，並在首次運行體驗中教導用戶如何執行關鍵任務，有助於將說明和任務結合，並積累留存率。此外，需盡量不單純依靠文本，而是綜合使用視覺化提示、動效和動畫來指導用戶。

熟悉：使用不會打破沉浸式體驗的標準 UX 互動模型和模式，有助於減少提供指示或詳細新手流程的需求。

橫向和縱向模式：提供對縱向和橫向雙模式的支持。如果不可行，請選擇適合您的體驗的模式。支持這兩種模式可創造更加身臨其境的體驗，並增加用戶的舒適度。

音頻探索：利用音頻來鼓勵使用應用並 360 度探索周圍環境。但需確保聲音是在增強用戶體驗，而不是在分散注意力。

視覺探索：使用視覺化提示推動用戶脫離 2D 屏幕的束縛，去探索更廣闊的 AR 世界。例如，讓一隻鳥飛離屏幕，直到用戶將其帶回場景中，幫助引導用戶達成預期的目標。

深度碰撞：為了避免深度衝突 (即虛擬物體與現實世界相互交錯) ，請注意設置合理的空間大小以及用戶使用應用的各種可能環境。通過清晰地表明實現您的應用體驗需要多少空間 —— 是桌面還是整個房間，或者是世界級的空間 —— 提前為用戶設置期望值。

GIF

向用戶表明應用體驗所需的空間

真實性

深度：用戶在 AR 體驗中很難感知深度和距離。而利用陰影、遮擋、透視、紋理、常見物體的比例尺和參照物的放置可直觀傳達深度。

照明：當實際不存在照明時，虛光 (false ambient lighting) 可以為場景中的物體創造深度和真實感。

降低違和感：在 AR 體驗中的虛擬物體也需要考慮和周圍物體的一致性，不論是從視覺上還是物理特徵上。人類已經很熟悉真實環境了，所以如果出現違和感的話會非常 「齣戲」。當 AR 中的虛擬內容與現實世界環境做出互動時，需要統籌考慮通過陰影、光線、遮擋、反射和碰撞來降低違和感。

GIF

利用陰影、光線及反射來讓虛擬與現實更多地融合

相信看到這裡，您對於 AR 應用設計已經有了一定理解。但由於篇幅有限，本次我們只是總結性地為您介紹了大體要點。若您對 AR 應用設計有其他的困惑，也歡迎隨時與我們溝通，期待您的 AR 應用作品的出爐！

· END ·

喜歡這篇文章嗎？立刻分享出去讓更多人知道吧！