開始使用

使用 Jetpack Compose Glimmer UI 架構建構應用程式,在光學透視螢幕上提供擴增體驗。Jetpack Compose Glimmer 是首批針對透明螢幕和眼鏡板型規格最佳化的 UI 架構之一。

1. 決定使用者歷程

著重於符合眼鏡板型規格「一目瞭然」原則的關鍵使用者歷程 (CUJ)。這可以透過最精簡的使用者介面或純音訊呈現,同時讓使用者能專注於周遭環境。如要尋找機會,請考慮在目前的應用程式中,從可受益於智慧眼鏡的進入點開始。

舉例來說,使用者可以透過免持即時路線步行路線,前往目的地。

選擇的使用者歷程也應考量安全性、舒適度和效能原則。舉例來說,請勿選擇需要使用者長時間使用相機,或侵犯使用者隱私的工作。

瞭解基本原則。

從行動應用程式中擷取適合眼鏡板型規格的功能。例如一目瞭然的體驗。
將整個手機應用程式移植到眼鏡,因為應用程式不會配合眼鏡板型規格調整。

2. 縮小及翻譯

如果是顯示模式 UI,請從核心應用程式的 CUJ 開始:

  • 最佳化版面配置,讓使用者專注:版面配置會優先顯示重要資訊,減少動作和視覺元素數量,讓使用者保持專注。

  • 使用深度表示階層:深度可用來表示元素優先順序。

  • 由下而上設計:建構模擬時,請從底部開始,向上排列元件。

  • 翻譯視覺元件:如果是顯示型眼鏡,請使用 Jetpack Compose Glimmer 元件和版面配置模式。

進一步瞭解元件和應用程式資料檢視。

購物清單應用程式會將清單檢視畫面縮減為最精簡的清單體驗,且只需要意見回饋 UI。
圖 1:購物清單應用程式轉換成顯示型眼鏡的元素。顯示型眼鏡的 UI 通常是空白的,因此系統資訊列在視覺上會很明顯。應用程式列可轉換為標題方塊,而 Material 清單元素則可轉換為 Jetpack Compose Glimmer 清單。

3. 音訊流程和提示

與音訊內容對話。即使在顯示型眼鏡上,音訊也應占應用程式體驗的一大部分,但您也需要考量語音眼鏡的純音訊體驗。您可以建立純音訊流程圖,描述這項體驗。使用音訊提示和對話,標註互動和意見回饋。請評估設計,避免音訊流程讓使用者感到不適。

建立純音訊流程圖,協助您規劃不會讓使用者感到負擔的對話式體驗。

4. 地圖輸入控制項

請務必對應裝置控制項和手勢的輸入內容。您可以先將基本的應用程式互動 (例如輕觸) 轉換為觸控板輕觸。

繼續輸入。

XR 差異化應用程式的使用者體驗專為 XR 設計,並導入 XR 專屬功能。

5. 考量 SysUI

其他系統介面的帳戶。

您的應用程式會顯示在主畫面和其他系統功能中,例如通知 (如有使用)。這些圖示會顯示在系統資訊列中。

進一步瞭解系統 UI

建立純音訊流程圖,規劃不會讓使用者感到負擔的對話式體驗。

6. 其他狀態

應用程式在音訊和顯示型眼鏡上會遇到不同情況,例如連線或權限問題。請在核心應用程式和眼鏡應用程式中,考量這些不同狀態。

請務必要求裝置功能權限。

請記得,您需要透過視覺化使用者介面和音訊來考量這些因素。舉例來說,您可以提供音訊回饋,告知使用者應在行動裝置上完成權限流程,或朗讀錯誤。

考量核心應用程式和眼鏡應用程式的不同狀態。 注意:請先前往 Figma 取得 Jetpack Compose Glimmer UI Kit。