Android 裝置有多種板型規格,例如手機、平板電腦、摺疊式裝置和 ChromeOS 裝置,且有多種螢幕大小。Android 支援多種顯示模式,包括多視窗模式、多螢幕、任意形式和子母畫面。摺疊式裝置可處於各種狀態或型態,例如桌面或書本。
開始設計應用程式時,請考量不同的用途。例如:
大螢幕裝置可讓使用者有更多空間,以不同方式與媒體應用程式的內容互動。
使用者可能會在多視窗模式設定中觀看影片時進行多工處理,或在擷取圖片後利用較大的螢幕進行更複雜的編輯。
使用者可能會透過平板電腦進行視訊通話,與親友保持聯繫,並更清楚地看到他們。應用程式可以在自訂播放重疊畫面中,顯示更豐富的標題或場景相關資訊,或在畫面上提供更多控制選項。
瀏覽檢視畫面中的輪轉介面可提供更多樣化的內容,提升視覺吸引力,媒體應用程式也可以在播放內容旁提供可瀏覽的動態消息,讓使用者持續參與。
請注意,媒體應用程式在標準手機、折疊式裝置、平板電腦和 ChromeOS 裝置上執行的程式碼相同,因此您應在應用程式開發初期就針對大螢幕進行設計。如需更多資訊和視覺範例,請參閱大螢幕圖庫。
根據預設,讓媒體應用程式具備回應能力
請讓媒體應用程式的版面配置能自動調整,以適應手機、平板電腦、摺疊式裝置和 ChromeOS 裝置,避免使用者體驗不佳。
應用程式應能配合不同的螢幕大小、螢幕方向和板型規格做出回應。自動調整式版面配置會配合可用的顯示空間而變化。詳情請參閱「支援不同的螢幕大小」。
根據指南設計
核心應用程式品質是所有 Android 應用程式的基礎,無論螢幕大小、裝置型態或其他裝置專屬考量為何,都適用。在開始設計大螢幕體驗前,應用程式應符合這些基本規定。詳情請參閱「核心應用程式品質」。
無論裝置板型規格、螢幕尺寸、顯示模式或形態為何,應用程式都應提供出色的使用者體驗,因此請根據下列第 1、2 和 3 級指南設計應用程式。
這些規範涵蓋了大部分 Android 應用程式適用的品質標準。
第 3 級:
在這個基本層級,應用程式仍須遵守使用者介面和圖形規定。應用程式可供大螢幕使用,使用者可以完成重要工作流程,但無法獲得最佳使用者體驗。
應用程式版面配置可能不理想,但確實能以全螢幕或多視窗模式下的完整視窗執行。不會顯示上下黑邊,也不會以相容模式執行。應用程式為外部輸入裝置提供基本支援服務,包括鍵盤、滑鼠和觸控板。詳情請參閱「支援大螢幕」。
第 2 級:
在這個層級,應用程式會針對所有螢幕尺寸和裝置設定實作版面配置最佳化功能,並加強支援外部輸入裝置。詳情請參閱「大螢幕最佳化」。
第 1 級:
這是最佳支援等級,可為使用者提供最優質的應用程式體驗,因為它指定了付費功能和功能。
在適用情況下,應用程式支援多工處理、折疊型態、拖曳和觸控筆輸入。在這個層級,應用程式會高度分化,因此請密切注意多工處理和摺疊狀態等指南。詳情請參閱「大螢幕差異化」。
最佳化版面配置
善用大螢幕的額外空間,避免上下黑邊 (因限制螢幕方向) 或畫面拉伸。針對媒體和社群媒體最佳化應用程式版面配置,可擴大應用程式觸及範圍,並在所有大螢幕板型規格 (平板電腦、摺疊式裝置和 ChromeOS 裝置) 上提供更優質的使用者體驗,同時支援所有手機尺寸。
導覽邊欄和導覽匣元件提供現成的導覽功能,讓使用者介面和控制項使用起來更輕鬆。這些元件也會將主要導覽目的地置於觸手可及的範圍內,同時占用最少的螢幕空間,藉此彌補標準版面配置 (清單/詳細資料、動態饋給和輔助窗格) 的不足。
媒體版面配置
為清單詳細資料、動態饋給和支援窗格導入媒體專用版面配置,提升應用程式可用性。如要瞭解 MDX、Flutter 和 Compose 版面配置,請參閱「版面配置資源」。
清單詳細資料: 使用互動式媒體瀏覽器設計應用程式,讓使用者在觀看或聆聽時瀏覽不同媒體。媒體名稱會與正在播放的影片或音訊檔案並排顯示。如果裝置螢幕方向改變,清單詳細資料版面配置會據此回應,保留應用程式狀態。詳情請參閱「清單/詳細資料版面配置」。
動態消息:動態消息版面配置會在可設定格線中,排列對等的內容元素,以便快速檢視大量內容,例如應用程式中的音樂動態消息或電影和電視資訊站。詳情請參閱「動態消息版面配置」。
輔助窗格: 應用程式可透過主要和次要顯示區域,嵌入輔助窗格,提供背景資訊、相關性或參考資料,例如類似標題的捲動清單、已發布的評論,或是相同藝人或演員的其他作品。詳情請參閱「支援窗格版面配置」。
如需精選媒體版面配置,請參閱媒體庫。
社群媒體版面配置
大螢幕為社群媒體使用者提供更多作業空間,方便他們創作、多工處理、在應用程式間拖曳內容,以及分享內容。大螢幕媒體應用程式具備小螢幕裝置無法提供的獨特功能,可充分運用清單詳細資料、動態消息和支援窗格版面配置。
清單/詳細資料: 很適合用於訊息應用程式、聯絡人管理工具或檔案瀏覽器。舉例來說,應用程式可以並排顯示對話清單和詳細資料,隨時掌握最新訊息。詳情請參閱「清單詳細資料版面配置」。
動態消息: 這種版面配置樣式的常見元件包括資訊卡和清單。舉例來說,您可以在靈活的方格介面中,用美術拼貼手法顯示貼文,或善用方格大小和位置,吸引讀者關注主打貼文。使用者可以快速查看大量內容。詳情請參閱「動態饋給版面配置」。
輔助窗格:搜尋和參考應用程式或效率提升應用程式,都適合採用這種版面配置。使用者可輕鬆存取內容創作工具。舉例來說,應用程式可讓使用者調整設定、存取調色盤、套用效果,以及立即查看變更。詳情請參閱「支援窗格版面配置」。
如需精選的社群媒體版面配置,請參閱社群媒體圖片庫頁面。
大螢幕媒體應用程式的最佳做法
採用大螢幕最佳做法,可避免不必要的應用程式重製工作。此外,從一開始就採用這些做法,可讓應用程式在更多裝置上更容易使用,尤其是在螢幕方向、鍵盤快速鍵、相機預覽支援和摺疊式裝置姿勢方面。
方向和調整大小
如果媒體應用程式宣告螢幕方向和大小調整限制,Android 會啟用相容模式。雖然相容模式可確保應用程式正常運作,但可用性會大幅降低,使用者體驗也會受到影響。
舉例來說,如果應用程式在平板電腦上執行,平板電腦會以橫向模式固定在座架上。如果應用程式僅限直向,就會出現上下黑邊,這對使用者來說並不理想。應用程式應允許使用者選擇偏好的螢幕方向,因此請在設計中充分利用大螢幕的可用大小。
任何螢幕方向限制都會減少使用者與內容互動或觀看媒體的方式,進而限制應用程式的使用。變更螢幕方向可能會在一定程度上影響大小,但調整大小不一定會變更螢幕方向。
鍵盤快速鍵
在大螢幕上,使用者更可能使用實體鍵盤上的鍵盤快速鍵,例如開始、停止、暫停、倒轉和快轉,讓使用者體驗與鍵盤一致。
使用者希望媒體應用程式提供這些功能。為減少使用者操作不便,建議您使用實體鍵盤測試應用程式。這有助於您在設計初期,就注意到並在應用程式中加入這些重要捷徑。
相機預覽支援
在大螢幕上,您可能會遇到更多拉伸、裁剪和旋轉的問題。因此,您無法假設相機預覽的大小就是媒體應用程式 UI 實際算繪的大小。
舉例來說,如果使用者用平板電腦拍照,但平板電腦螢幕顯示的畫面卻上下顛倒,這就不是理想的使用體驗。加入大螢幕相機預覽支援。
詳情請參閱 CameraX 預覽或 Camera2 預覽。
折疊型態
為大螢幕設計媒體應用程式時,也應考量摺疊式裝置的各種型態。舉例來說,應用程式可讓使用者在媒體播放時使用桌面模式,或在預覽和拍攝時使用後置螢幕和雙螢幕模式。
將摺疊式裝置形態納入開發計畫,應用程式就能在更多裝置上使用,並發揮更廣泛的影響力。您能以其他裝置無法做到的方式,為使用者放大媒體體驗,而不需要摺疊狀態。詳情請參閱「摺疊式裝置型態」。