放置類AR體驗框架和設計建議 (下篇)

百度AI互動設計院發表於2019-04-04

模型互動的

設計分析及體驗建議

1. 模型互動的作用範圍及互動特點

當使用者在真實環境的場景中穩定放下物體模型後,會有與模型進行進一步互動的需求。這類模型互動,通常會改變模型本身的物理屬性。例如:

移動:改變物體在環境中的位置
縮放:改變物體的大小

旋轉:旋轉物體便於⽤戶不改變自身位置觀察物體
刪除/重置:讓模型在環境中消失或出現...

基於目前的AR技術和手機裝置限制,⽬前的模型互動主要是透過螢幕利用二維互動驅動AR三維場景中的模型,從而與模型進行互動。螢幕二維互動設計,主要是利用二維手勢介面控制元件去達到互動的目的。例如:

按鈕/搖桿:在手機介面中設計按鈕、搖桿。

手勢:⽬前技術支援的瞬間的手勢操作、連續的手勢操作。比如單指點選、單指長按、雙指縮放、雙指旋轉等等,我們在日常使用APP常用的手勢操作。 

透過進⾏合理的分析設計,賦予這些手勢和介面控制元件具體的功能,去控制三維場景中模型的移動、旋轉、縮放。

放置類AR體驗框架和設計建議 (下篇)

2. 模型移動的互動定義及設計形式

使用者會與模型進行互動,移動是最為常見的一種操作行為。透過在手機螢幕的手勢操作或按鈕操作,控制模型在現實場景中的位移。

我們需要透過設計使用者使用常用並熟知的手勢與模型進行互動,利用二維手勢驅動三維空間中的模型在X軸、Y軸、Z軸的位移。

放置類AR體驗框架和設計建議 (下篇)

放置模型後根據移動範圍X軸、Y軸、Z軸,與在現實環境的虛擬模型進行移動互動操作,設計手段包括手勢、搖桿的方式。可以參考以下五種設計內容:

1.單指按住左右移動  模型移動以螢幕有效的外側邊沿為限。

2.單指按住前後移動  縱深移動遵循近大遠小的透視效果。

3.單指按住上下移動  模型以中軸線上下移動,實際為改變模型所在平面位置,投影以暗示高度。(需注意,單指按住前後和上下移動不會同時出現)

4.點哪去哪  模型從原位置向目標位置移動。

5.介面搖桿  若螢幕手勢互動有可能對控制物件造成持續遮擋,或者無法很好的完成複雜操作要求,可以透過螢幕控制元件滿足需求。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

模型移動的並非需要X、Y、Z三個軸均開放,實際是根據模型位移互動的具體需求去選擇開放維度,並設計合理的互動方式去響應模型的移動。可參考以下案例。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
3. 模型旋轉的互動定義及設計形式

在現實場景中除了移動模型的位置,還可以透過旋轉來360°觀察模型細節,不僅控制模型還能把玩模型,賦予模型生命感,讓使用者更好地與模型進行互動。設計手段主要是針對手勢的設計。可以參考以下三種設計內容:

1.雙指順/逆時擰  一隻手雙指順時/逆時擰旋轉模型。

2.雙指向左/向右滑動  一隻手雙指左右滑動。

3.單指向左/向右滑動  一隻手單指左右滑動。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

旋轉模型是為了全方位觀察模型,讓使用者更好地把玩模型。透過以下案例來進行說明。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

4. 模型縮放的互動定義及設計形式

移動模型、旋轉模型都是與模型互動,如果想深入瞭解模型則需要對模型進行縮放操作。設計手段包括手勢、滑動條、縮放倍數的按鈕。可以參考以下三種設計內容:

1.雙指擴充套件/捏合縮放  以模型的中心點等比縮放。

2.拖動滑動條縮放  拖動滑動條在0-100%的範圍內進行縮放,當標尺拖動到極限時,則模型不再響應縮放。

3.固定縮放倍數按鈕  倍數已經固定,限定縮放的大小 。 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

雙指擴充套件/捏合縮放是在二維手機介面被大家熟知的手勢操作,而滑動條、固定縮放倍數按鈕的縮放形式,在AR場景多用於遊戲類產品,一般在模型放置時固定模型大小,進入遊戲後不支援手持操作。可以參考以下案例。 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

有一種特殊的情況,當支援放置多個模型時,如何設計呢?此時,需要透過點選選中模型,模型進入選中態,與其他模型區分開,選中後進行的操作只作用於該模型,並支援刪除模型的功能。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

為了增加模型互動時體驗的豐富和細膩程度,模型互動(過程中、成功後)會有相應的反饋設計。包括:模型自身的動效、符合真實世界的視覺表現、音效、震動、語音反饋等。 

放置類AR體驗框架和設計建議 (下篇)

5. 模型互動的設計原則和建議

01.根據模型需要定義互動自由度

模型的互動程度,需根據特定模型的自身屬性/產品的型別去定義,並非所有可互動型別都需要涉及。跟核心模型體驗無關的互動可禁止或增加操作難度。例如科普類模型固定放置在平面後,需要便捷地旋轉以檢視模型細節,但Y軸移動檢視的需求不大,部分場景可考慮禁止Y軸操作。又例如遊戲類AR模型位置相對固定,更多的體驗在於與固定模型進行的細部互動。

02.手勢設計簡單且符合直覺

手勢設計優先使用通用的方式,若沒有通用的方式,則儘可能使用簡單和符合使用者直覺的方式進行設計。若違反該原則可能造成使用者的理解和記憶障礙,需要加重使用者引導,避免給使用者造成操作困難。

03.手勢設計按需搭配且不可衝突

在設定模型的互動自由度後,可選擇合適的手勢進行搭配使用。但一種操作方式只可匹配一個互動結果,不可出現手勢衝突。手勢的搭配需要成套考慮。例如以下搭配: 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

異常處理的

設計分析及體驗建議

1.AR中異常情況的定義及設計內容

傳統APP設計存在異常情況,比如無網路載入失敗,登入發生錯誤等情況,那在放置類AR中是否存在異常情況呢?

在放置類AR場景中體驗時,由於使用者操作不當,導致模型出屏或模型丟失,無法與其再進行互動,我們統稱為異常情況。還有一種情況比較特殊,當正在體驗放置類AR時,其它應用突然被喚起,再重新返回放置類AR場景的處理。所以我們從互動設計層面需要對異常情況進行及時處理,正確引導使用者解決困惑,給使用者一個良好的AR體驗。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

在與模型互動過程中,會出現異常情況,需要透過一些設計形式可以及時地幫助使用者解決異常問題,設計手段包括:文字、動圖、語音、輔助圖形、重置、復位,具體運用根據實際設計需求而定。可以參考以下設計內容:

1.模型出屏  模型出屏後視覺線索引導使用者找到模型,可以搭配文字、動圖、語音等形式,按照設計場景來自由組合。

2.模型丟失  當視覺線索引導未找到模型時,透過點選按鈕將模型復位。按鈕可以常駐或非常駐。 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)


當發生模型出屏、模型丟棄復位的異常情況,根據產品型別和場景選擇合適的設計手段,解決使用者的困惑。結合具體案例以說明。 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
在異常情況中有一些相對特殊的情況,第一種情況:體驗放置類AR時,手機來電後不得不離開,當再次返回時,根據技術能力來進行互動設計引導,保留場景及模型或引導使用者重新獲取平面建立AR場景;第二種情況:當進入AR場景後,模型是固定大小尺寸,在設計時,需要考慮讓使用者可以重新放置模型在新的位置,提供重置按鈕。

遊戲類、科普類設計時需要保留之前AR場景,有延續性的體驗,技術能做不到保留,則需要重新識別平面再次建立AR場景進行體驗,如果支援放置多個模型的場景,建議不保留。當進入AR場景後,模型是固定大小尺寸,在設計時,需要考慮介面上需要重置按鈕,讓使用者可以重新放置模型在新的位置。下面結合案例具體說明。 

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
此外,在AR內容體驗中也會發生丟失平面的異常情況。這裡的異常處理可以使用話術準確告知使用者原因,還可以配以圖片、動圖、語音,更具象更清晰引導使用者解決問題。需注意與平面識別引導的設計形式保持一致性,若平面識別未使用語音,則識別失敗提示也不能使用語音,避免突兀感。可以參考以下設計內容:

3.純文字話術  透過簡單明瞭的文字正確引導使用者操作。

4.圖片/動圖+文字話術  圖片/動圖詮釋文字的含義,幫助使用者理解如何操作。

5.語音+文字話術  語音輔助文字,使資訊更有效傳達,從而引導使用者操作。

放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)
放置類AR體驗框架和設計建議 (下篇)

2. 異常情況的設計原則和建議

1.模型出屏後需要及時引導使用者找到模型,避免焦慮感。

2.模型丟失後需要透過設計形式的組合搭配,以操作便捷的互動引導使用者。

3.建議在設計遊戲類、科普類AR產品時,再次返回APP需要保留之前的AR場景,保留延續性。

4.注意如果進入AR場景時無音效和語音,則異常情況引導不能出現音效和語音,避免突兀感。

5.平面識別失敗後需要及時反饋使用者如何操作,需注意設計形式保持前後一致。

放置類AR的設計核心原則

以上就是AR放置類互動節點的分析和設計建議的詳細內容。我們希望設計師能圍繞AR應用的真實場景,考慮到每個體驗節點的細節,結合上文提到設計建議,在設計過程中關注以下關鍵目標,為使用者創造更加友好和細膩的互動流程和體驗過程。

1. 清晰:傳達的內容清晰明瞭,不會產生疑惑或歧義。

2. 有效:能幫助使用者成功達到互動目標。

3. 流暢:無停頓感,過程一氣呵成。

4. 愉悅:使用者感覺愉快、無壓力。

5. 可控:可自主互動,過程反饋清晰,給使用者盡在掌握中的感受。

希望透過我們提出的設計內容、設計原則建議能幫助到作為閱讀的設計師、開發者們,在日後的產品設計、互動設計中能讓使用者在放置類AR場景有更好的體驗,這也是我們編寫的目的所在,為AI科技盡綿薄之力。

感謝閱讀!

相關文章