Apple TV 人機界面指南
Apple TV 人機界面指南-移動閱讀二維碼

1 概述

1.1 設計原則

無論你是在開發游戲、媒體流應用,還是家庭實用應用,在構想產品的時候請記住這些設計原則。

 

互聯?Connected

Apple TV通過革命性的Siri遙控器為電視帶來了觸控體驗。用戶可以在房間的任何一個角落,通過流暢、直觀的手勢與內容進行交互。 觸控板的操作猶如人們熟悉的trackpad,全新的遙控器支持輕觸、滑動和點按。 請利用觸控的優勢,運用令人愉悅、引人入勝的方式,將用戶和內容連接在一起。

tvos_1001

 

明確?Clear

Apple TV給人自然、直觀的感受,令你本能地知道該怎么做。你的應用應該增強這一體驗。用布局網格、動作和透明度打造語境。為每個元素賦予空間感,讓用戶清楚它們在你的應用中的位置。Apple TV的導航采用焦點模型。用戶使用遙控器在界面元素間移動,例如電影海報、應用或按鈕,通過點按選中某個元素。導航中的當前項是選中態,如果一個元素被選中聚焦,即使遠看也該一目了然。

tvos_1002

 

沉浸 Immersive

精美、綿延無邊框的藝術畫面將用戶吞沒在豐富多彩的影音體驗中。對單個內容的聚焦提升了這種體驗,遙控器的觸控版會讓你覺得自己在直接觸摸屏幕,與在iOS設備上操作無異。通過吸引人的內容、令人振奮的影像、以及精巧流暢的動畫力求沉浸感。

tvos_1003

 

1.2 應用 APP

tvOS為一系列本地運行的應用提供了開發框架,如吸引人的游戲、實用工具和其他Apple TV本地應用。如果你熟悉iOS應用設計,你就已經知道大部分你需要了解的東西了。大部分界面元素和開發框架在tvOS里也同樣存在。然而,想創造一個可以遙控、在電視屏幕運轉良好的出色影音體驗確實需要一些重要而且獨特的設計考量。

tvos_1004

仔細思考用戶交互。把你應用的體驗設計得直觀、簡潔、流暢。在iOS里,用戶看到的和觸摸的是同一個設備。在Apple TV上,用戶看著房間另一頭的屏幕,同時觸摸的是遙控器。尋找機會通過遙控器讓用戶感到和應用連接在一起,即使他們坐在一定距離之外。

 

 

考慮用戶與屏幕的距離,讓焦點醒目。你的應用將會是在距離電視10英尺外的沙發上也能被使用的。相應地去設計界面元素,讓用戶不會感到困惑。并且明確聚焦的事物以及明確在遙控器上操作帶來的反饋。

 

 

創造共享體驗。用戶通常在公共環境中享受電視??紤]你的應用應該怎樣吸引一組用戶,以及每次打開應用的都是不同的用戶。

 

 

應用開發相關信息,參閱?tvOS應用編程指南。

 

1.3 首頁

Apple TV首頁展現已安裝的應用。用戶瀏覽網格排列的一系列應用圖標,選中一個并通過點擊來啟動應用。

tvos_1005

在首頁上,你的應用圖標是講述你應用的故事以及與用戶建立情感連接的最好機會。你的應用圖標應該建立好的第一印象,所以請設計一個獨特、動人、便于記憶的圖標吧。設計指導參閱 4.2 應用圖標。

 

1.4 頂部展區 Top Shelf

頂部展區是首頁上位于首行應用列表之上的內容展示區域,用戶可以決定頂部展區展示哪些應用。當聚焦這些應用中的一個時,頂部展區展示于此應用相關的特定推薦內容。

tvos_1006

頂部展區突出展現應用中最新、推薦或者有價值的內容,并且給用戶提供直接跳轉的獨特機會。例如,當聚焦App Store時,橫幅突出展現值得關注的新應用。當聚焦iTunes TV Shows時,用戶可以看見一系列推薦節目。聚焦并且點擊一個節目,就會直接跳轉到應用內相關的節目詳情頁。聚焦到一個節目時,按下遙控器的播放/暫停鍵即刻開始回放該節目。

 

 

推薦內容的設計指南,參閱 4.3 頂部展區圖片。

 

1.5 焦點和視差

tvos_1007

在Apple TV上,導航過程中當前的界面元素,如某圖標、圖片、按鈕或其他的界面元素,可視為處于聚焦態。當一個元素被聚焦,它會被緩緩的提到前景。在遙控器觸控板上輕輕畫圓,元素會相應地做出搖擺動作。與此同時,元素上出現照明光澤,制造表面反光的視覺效果。如果用戶一段時間內沒有操作,非聚焦中的內容轉為暗淡而聚焦中的元素變的更大。這些共同作用的效果,與坐在沙發上的用戶保持一種聯系,并且提供了上下文和一種明確的感受,強調了什么在焦點。

 

視差效果是一種貫穿整個系統的精巧視覺效果,它傳達了聚焦元素的縱深和動態。通過圖片分層、透明度、縮放和動效,視差效果打造了活靈活現的、真實的3D感。為了支持視差效果,提供圖像分層是應用圖標的要求之一,也是首頁頂部展區的動態內容可以支持的。我們提倡應用中任何可被聚焦的圖片內容都使用分層圖片。

 

更多關于焦點的信息,見 3.2 焦點和選擇。在 4.5 圖像分層 中學習如何為視差設計圖片。聚焦和視差實現指南,見 tvOS應用編程指南。

2 遙控器與交互

使用革命性的Siri遙控器,與屏幕內容創建一種獨特、親密的聯系。

 

2.1 遙控器

遙控器為Apple TV最主要的操作設備,創造性地利用遙控器的觸控板、加速計以及陀螺儀,為用戶提供令人感嘆的和直觀的體驗。用戶在客廳使用遙控器時感覺像直接與電視交互一樣。

 

2.2 手勢

遙控器的觸控板可以檢測到多種直觀的單指手勢。利用手勢可以與你的內容建立一種實感的聯系。

 

滑動 Swipe

用戶可以在選項間向上、下、左、右移動焦點?;瑒邮謩莸臐L動通常帶有慣性,即基于滑動的力度,滾動開始快,隨后慢下來。通過這種方式,用戶可以毫不費勁地在大量內容中移動。

tvos_2002swipe

點擊 Click

點擊能激活控件或選擇一個選項。點擊是一個強意圖性的動作,也是觸發行動的主要形式。”點擊并長按”是用來觸發特定情境下的動作。舉個例子,點擊并長按界面元素可以進入編輯狀態。

tvos_2003click

 

輕觸 Tap

輕觸能在一系列的元素中逐個瀏覽。在基于UIKit的標準界面的應用中,輕觸導航的不同區域能直接導航。舉個例子,輕觸觸控板的頂部向上導航。一些應用會使用輕觸手勢來顯示隱藏的控件。

tvos_2004tap

 

為了避免在無意中觸發動作,所以要區分點擊和輕觸。點擊手勢是一種強意圖的交互行為,常適用于按下按鈕,確認選擇以及在游戲中發起一個動作。輕觸手勢適用于導航或者展示一些額外的信息。但需要注意的是用戶在拿起遙控器、移動遙控或把遙控器交給他人時,他們的手指可能會自然地放在遙控器上。

 

避免使用標準手勢執行非標準的行為,除非你的應用是一個需要手勢的互動游戲 (active gameplay)。重新定義標準手勢的含義會導致用戶困擾和交互復雜性。

 

當且僅當必要時,你的應用能定義新手勢。人們熟悉標準的手勢,不喜歡被迫學習其他的方法去完成相同的事情。在游戲或者其他沉浸式應用里,定制手勢也是體驗中有趣味的部分。但在其他應用里,最好還是使用標準手勢,這樣用戶就不需要額外的努力去發現或者記住它們。

 

適當時,不同位置的輕觸手勢能輔助導航和游戲。遙控器可以區分的觸控板上下左右的輕觸手勢。如果要對不同位置的輕觸做出響應,前提是你的應用和對應的情境需要該輕觸動作,且這一行為是直觀的、可發現的。

 

2.3 游戲手柄

在游戲里,游戲手柄可以提升可玩性以及增加沉浸感。游戲手柄也能對Apple TV的基于焦點的界面進行導航,省去切換輸入設備的需要。

tvos_2005

 

重要:游戲手柄是選購項,用戶不一定有購買。但每臺Apple TV一定會配置遙控器。如果你的應用可以支持游戲手柄,那么你必須讓遙控器也能控制游戲控制。

 

確認游戲手柄的連接。你的游戲可能隨時啟動,甚至在沒有游戲手柄連接的情況下。為了確??煽康挠脩趔w驗,應用啟動時應該檢查手柄是否就位,如手柄是必要的,可以友好地提示用戶連接手柄,還需要告知用戶游戲手柄比遙控器多提供的能力。

 

不要讓用戶在使用你的應用時切換操作設備。用遙控器和游戲手柄測試你的應用,以及確保它們能在菜單和必要的導航上能使用??紤]一下,在使用遙控器時,你還能使用什么交互。舉個例子,在賽車游戲里,你可以讓用戶在遙控器橫屏模式上進行旋轉和操作。參閱 2.4 按鈕 了解按鈕預期行為。

 

關于游戲手柄支持的相關信息,可以查看 tvOS應用編程指南 中的 Working with Game Controllers。了解如何開發游戲,請查閱 GameplayKit Programming Guide。

 

2.4 按鈕

遙控器上除了觸控板外,還有些可點擊的按鈕,例如播放/暫停鍵也可以用于你的應用或者游戲上。當菜單按鈕被按下時,使用游戲控制框架(Game Controller framework)的應用程序也能收到通知并采取適當行動。在你的應用或游戲的情境中,不管用戶使用遙控器還是游戲手柄,按鈕的行為應該一致且可預測的。

 

Siri遙控器的按鍵操作預期

tvos_2006

 

按鈕 應用里的預期行為 游戲里的預期行為
觸控板(輕觸?/?滑動) 導航改變焦點 視情景而異執行方向鍵的行為
觸控板(點擊) 激活控件或選項 執行主按鍵的行為
菜單鍵 返回到上一界面退出到Apple TV主屏 暫停 / 繼續游戲返回到上一界面、退出到游戲主菜單、推出到Apple TV主屏
播放 / 暫停鍵 開始媒體播暫停 / 繼續播放媒體 執行輔助按鍵行為跳過介紹視頻

游戲手柄的按鍵操作預期

tvos_2007

 

 

 

按鈕 應用里的預期行為 游戲里的預期行為
方向鍵 改變焦點 視情景而異
A 激活控件或選項 視情景而執行主按鍵的行為執行”確認”行為
B 返回到上一界面退出到Apple TV主屏 視情景而異執行輔助按鍵的行為執行”否定”行為
X 開始媒體播暫停 / 繼續播放媒體 視情景而
Y 視情景而
菜單 返回到上一界面退出到Apple TV主屏 暫停 / 繼續游戲返回到上一界面、退出到游戲主菜單、推出到Apple TV主屏
LS (Left Shoulder) 向左導航 視情景而
RS (Right Shoulder) 向右導航 視情景而
LT (Left Trigger) 向左導航 視情景而
RT (Right Trigger) 向右導航 視情景而
左搖桿 改變焦點 視情景而
右搖桿 視情景而

 

 

給用戶返回到上一屏以及離開你的應用或者游戲的路徑。用戶預期按下遙控器或者游戲手柄上的菜單按鈕時,可以回到上一屏或者Apple TV的首頁。當在應用或者游戲首頁時,按下菜單按鈕應該始終回到Apple TV首頁。在游戲過程中,按下菜單按鈕應該可以顯示或者隱藏游戲中的暫停菜單,里面也應該包括一個選項可以導航回到游戲的主菜單。

 

始終可以使用Siri遙控器上的播放/暫停按鈕。無用的按鈕感覺像壞了一樣,所以應該始終為播放/暫停按鈕提供合理的行為。舉一個例子,讓用戶使用播放/播放鍵來開始游戲,跳過一頁教程說明,或者直接開始播放媒體。在游戲過程中,如果不需要輔助操作,播放/暫停應執行主操作。在一個應用里,如果沒有明顯的可播放內容,播放/暫停的操作行為等同于點擊,用來激活一個焦點選項(focused item)。

3 導航和焦點

運用這些設計準則能幫助你創造運行自然的應用,如同Apple TV身臨其境體驗的一部分。

 

3.1 導航

用戶往往不會注意到一個應用的導航,除非它并不符合他們的預期。你的工作是建立既能支持應用的結構和目標,又不會吸引用戶注意力的導航。導航應該是自然而熟悉的,它不應該主宰用戶界面或讓用戶從內容中分心。

tvos_3001

 

在Apple TV上,用戶在堆疊的頁面間移動,瀏覽內容。每一屏可能放置前往其他屏的入口,并且通過遙控器返回到前一屏或主菜單。一般情況下,使用標準的用戶界面元素,如標簽欄、表單視圖(table views)、內容集視圖(collection views)和分屏視圖(split views),可以在不同的頁面間切換。

 

設計一個能快速簡單到達內容的信息結構。用戶想用最少的輕觸、滑動,迅速地訪問到內容。簡化你的信息結構,用最少屏數來組織它。

 

利用觸控來達成流暢性。提供簡單的,用最少手勢便能在焦點元素中阻力最低地移動的方法。
Apple TV 人機界面指南
考慮焦點。Apple TV的導航并不總能一步到位。由于電視采用基于焦點的選擇模型,用戶需要先通過遙控器,把焦點移動到目標界面元素后,才能與其交互。如果你的導航方案需要太多的手勢才能實現目標,用戶可能會感到沮喪。參閱 3.2 焦點和選擇。

 

通過菜單按鈕實現后退導航。讓用戶能通過遙控器上的菜單按鈕返回,以創建簡單和可預期的導航體驗。在玩游戲時,點擊菜單按鈕應該回到游戲主界面或調起有返回至菜單主界面選項的游戲菜單。在應用或游戲的一級界面,點擊菜單按鈕會退出至Apple TV的主屏幕。

 

避免顯示返回按鈕。用戶知道按菜單鍵能返回,所以不要在你的應用中浪費空間去顯示一個額外的重復此功能的控件了。但當界面中只存在購買或刪除的按鈕時,可以考慮提供取消按鈕,便于讓用戶能返回上一界面。

 

內容合集在一屏顯示比優于在多屏顯示。即使一屏的元素非常多,遙控器的手勢也能幫助用戶快速移動。如果你有個焦點元素的集合,可以考慮用一屏顯示,以保持導航的簡單。

使用標準的導航組件。如果你的應用用戶界面使用UIKit實現,采用標準的導航控件,如頁面控制器(page controls)、標簽欄(tab bars)、分段控件(segmented controls)、表單視圖(table views)、內容集視圖(collection views)和分屏視圖(split views),用戶已經熟悉這些控件,他們將直觀地知道如何使用你的應用。?你可以在 6 界面元素 了解這些導航組件。

支持內容垂直導航。左右滑動比上下滑動更自然,在選擇或設計內容布局時,請考慮這一點。

頁碼: 1 2 3 4 下一頁

本文鏈接:http://www.casaleticia.com/apple-tv-man-machine-interface-guidelines.html
本文標簽: , , , , , , , , , ,