電視導航

電視裝置為應用程式提供一組有限的導覽控制項。如要為電視 UI 建立有效的導覽配置,請考慮以下有限的控制選項,以及使用者如何使用遙控器按鈕 (而非觸控螢幕) 進行瀏覽。

導覽主頁橫幅

重點特色

  • 控制器提供的導覽功能有限 (從左下角),因此請留意這如何塑造應用程式 UI 設計。
  • 導覽功能應會出現自然而熟悉的操作方式。
  • 使用遙控器的返回按鈕,打造簡單的導航體驗。
  • 如果使用者沒有進入控制項的直接路徑,請考慮移動控制項。

原則

目標是打造自然而熟悉的導覽體驗,而非凸顯使用者介面,或無法分離內容。下列原則有助於設定基準,讓 TV 應用程式提供一致且直覺的使用者體驗。

有效率

方便使用者快速取得內容。使用者想快速存取內容,而且次數最少。以最少的畫面整理資訊。

易於預測

遵循最佳做法和建議,讓使用者清楚瞭解導覽內容。請勿不必要的瀏覽模式,以免造成混淆和無法預測。

符合直覺

導覽設計應簡單明瞭,流暢地支援廣泛採用的使用者行為。請勿加入不必要的導覽層,導致內容過於複雜。

遙控器

控制器有多種樣式,從極簡的遙控器到複雜的遊戲控制器,應有盡有。所有控制器都提供方向鍵 (D-Pad) 以及選取、主畫面和返回按鈕。其他按鈕因型號而異。

遙控器

  • 方向鍵 (D-pad) - 電視上的主要瀏覽方式是使用 D-Pad,包括向上、向下、向左和向右方向硬體按鈕。
  • 選取按鈕 - 選取焦點項目。按住鍵可以顯示更多選項。
  • 首頁按鈕 - 將使用者導向系統主畫面。
  • 返回按鈕 - 讓使用者能返回上一個檢視畫面。
  • 麥克風按鈕 - 叫用 Google 助理或語音輸入。

D-Pad 導覽

使用電視裝置時,使用者可使用 4 向 D-Pad 進行瀏覽:向上、向下、向左、向右。 如要打造最佳 TV 應用程式,請設計一種導覽配置,讓使用者能快速瞭解如何透過四個方向鍵使用應用程式。D-Pad 會將焦點從一個元素移至對應方向最近的元素。

如要透過電視裝置使用 D-Pad 測試應用程式的導覽功能,請考慮下列事項:

  • 確保使用者能夠前往畫面上所有可聚焦的元素。
  • 確保導覽方向簡單且可預測。
  • 針對捲動清單,請確認 D-Pad 的向上和向下按鈕會捲動整個清單,並可以選取每個清單項目。

[首頁] 按鈕

按下主畫面按鈕一律會將使用者導向 Google TV 主畫面或啟動器。根據預設,目前的應用程式會在背景暫停。

長按主畫面按鈕,Google TV 和 Android TV 上的應用程式排列顯示畫面。預設行為可能因製造商而異。

[首頁] 按鈕

「返回」按鈕

為了在平台中的應用程式之間保持一致,請確認返回按鈕的行為符合以下規範。

使用可預測的返回按鈕行為

如要提供可預測的導航體驗,當使用者按下遙控器的返回按鈕時,請將他們導向上一個目的地。最後,如果使用者持續按下返回按鈕,他們應會來到 Google TV 主畫面或啟動器。

含有頂端導覽的應用程式

使用者只要快速捲動並啟用選單焦點,即可回到頁面頂端。

含有頂端導覽的應用程式
採用左側導覽面板的應用程式

左側選單啟用後,使用者的焦點會移到使用中的選單項目。

提供左側導覽面板的應用程式

確認返回按鈕未受到確認畫面或有限迴圈的一部分限制。

請避免退出閘門。使用者應能在不進行任何確認的情況下退出應用程式。

不要顯示返回按鈕

與手持裝置不同,遙控器上的返回按鈕是用來在電視上返回瀏覽。您不需要在螢幕上顯示虛擬返回按鈕。

避免在螢幕上顯示返回按鈕。使用者可以使用遙控器上的返回按鈕。

視需要顯示「取消」按鈕

如果唯一可見的動作是確認、破壞或購買動作,最好的做法是提供「取消」按鈕,讓按鈕回到上一個目的地。

視需要顯示取消按鈕,讓使用者返回上一頁。

固定的起始目的地

使用者從啟動器啟動應用程式時,看到的第一個畫面也是使用者在按下返回按鈕後,返回啟動器時看到的最後一個畫面。

深層連結會模擬手動導覽

無論是深層連結或手動導覽至特定目的地,使用者都可以使用返回按鈕,從應用程式的任何位置前往起始目的地。

深層連結會模擬手動導覽

從其他應用程式深層連結到應用程式的深層連結,會模擬手動導覽。舉例來說,如果使用者從 Google TV 直接前往 Moviestar 應用程式的詳細資料頁面,然後按下返回按鈕,就會前往 Moviestar 應用程式的首頁。

清除所有可聚焦元素的路徑

讓使用者以明確方向瀏覽 UI。如果沒有能輕鬆進入控制項的路徑,請考慮重新放置控制項。

在不會與其他可點擊元素重疊的位置中,放置控制項 (例如搜尋動作)。
請避免在難以觸及的位置中加入控制項。執行這裡顯示的搜尋動作並不容易使用 D-Pad 管理。

Axis

設計版面配置,請善用水平和垂直軸。請為每個方向提供特定函式,以便快速瀏覽大型階層。

垂直軸可對類別進行週遊,而每個類別中的項目可在水平軸上瀏覽。
避免使用複雜的巢狀版面配置階層。