編輯導語：如今的智能電視不同於以往的傳統電視，現在的智能電視加入了更多開放式系統，頁面內容也更加豐富，功能更加強大，比如選擇電影、回放、玩遊戲等等，讓觀眾有更多的選擇；本文作者分析了電視端的設計原則。
前段時間完成了公司從0-1的TV端產品設計，在設計過程中，整理了一些TV端的設計原則和設計經驗，與大家共同學習交流。
相對於移動端和PC端，TV端設計對於很多人來説比較陌生。
接下來從以下幾個方面和大家聊聊TV端的設計方法和經驗總結：
- TV端使用場景；
- TV端操控方式；
- 焦點；
- 頁面佈局；
- 交互特點；
一般談到看電視，人們首先想到的畫面是家人聚在客廳裏，坐在沙發上邊聊天邊追劇或者邊玩遊戲。
基於這種最常見的觀影環境和氛圍，TV端的使用場景有以下幾個特點：
1. 遠距離操控由於現在的電視屏幕尺寸越來越大屏，用户的觀影距離一般在距離電視2-5米左右。
這麼遠的距離，為了讓用户能夠始終輕易的關注到主要內容，電視界面往往通過將其居中和靠前突出，讓主要內容不被淹沒在大屏之中。
2. 娛樂式消費人們一般會通過看綜藝、看電影來達到放鬆休閒的目的，所以娛樂消費是TV端的特點。
大篇幅的設置在TV端並不適用，多層級的探索也會讓用户迷失方向。
內容的易被發現、簡單的層級、極簡的操作步驟；讓用户快速抵達目的，享受觀影本身，是需要着重考慮的。
3. 沉浸式體驗越來越多的家庭擁有家庭影院。
試想下，在昏暗的環境中，帶上3D眼鏡，沉浸在劇情之中，是一種美好的享受。
這種環境下，適合讓視頻、圖片、聲音作為主旋律，摒棄大段的文字，構建豐富和動態的視聽享受。
4. 共享式環境電視處於家庭公共場合，離不開社交體驗，如看電影、看照片、玩遊戲等，是一種共享設備。
故電視端的內容需要廣泛適應家庭所有受眾成員。
二、TV端操控方式不同於移動端的手指操控和PC端的鼠標操控，TV端主要通過遙控器操控；從傳統的老式遙控器到現在的極簡遙控器，在操作的簡易程度上有很大改善。
- 傳統的遙控器操作除了方向鍵，還有數字鍵和其他眾多按鍵，用户除了不好記憶，還容易誤操作；
- 新式遙控器將不常用的按鍵去除或轉移至電視端，僅保留上/下/左/右方向鍵，首頁、返回、菜單和音量鍵；最新式的遙控器還加入了語音控制鍵，極大提升了用户的操作方式。
國內遙控器的最常見操作方式為點按操作，包括長按和短按；國外遙控器典型是蘋果公司的apple TV遙控器，除了點按，還支持滑動操作，體驗更流暢、操作效率更高。
改進仍在繼續，目前有些廠商將遙控器操作轉移至手機，用户可以將電視端界面投屏至手機，在手機上直接點擊操作，減少了中間的移動步驟。
不過由於需要手機與電視相互配合，而且手機屏幕畢竟沒有電視端直觀，所以該種操作方式還處於萌芽階段。
三、焦點1. 定義智能電視端有一個特有的設計概念——焦點。
焦點為用户指明瞭當前內容所處位置，並且讓內容最突出、最顯眼，是電視屏幕上始終存在的一種狀態。
電視端內容常見狀態有：默認狀態、焦點狀態、按下狀態、標記狀態。
十字移動：
焦點根據遙控器的上/下/左/右按鍵，呈現“十字”形移動；在屏幕內容區域劃分規整、且無空缺情況下，不支持斜向移動。
就近原則：
在焦點移動過程中，焦點不能跳躍性的移動，需要按照上/下/左/右鍵的操作，依次移動至離上一個焦點最近的位置處。
居中顯示原則：
當一行中有延伸在屏幕之外的內容時，焦點移動方式有多種形式：焦點居中固定或在頁面邊緣固定。
以往智能電視的常見做法是，當焦點向右移動至一行最後一個完整可見內容時，繼續向右移動，則內容移動，焦點固定。
根據心理學研究，用户往往更關注屏幕中心的信息，而非邊緣，所以在屏幕內容完整顯示前提下，將焦點位置固定在中間，更合適一些。
四、頁面佈局1. 導航常見的TV端導航有橫向導航和縱向導航。
這兩種導航分別在哪種場景下適用呢？
其實兩種形式的導航各有特點：
- 橫向導航佔據屏幕上方（或下方）邊緣位置，既可以定位內容的位置、但是又不會過多幹擾用户，帶來的沉浸式體驗更好；適用於首頁、電視劇等有feed流形式的地方。
- 縱向導航佔據屏幕左側（或右側，右側極少見）位置，雖然犧牲了左側部分區域，帶來的沉浸感也不如橫向導航，但是勝在導航內容更加聚焦，用户使用的效率更高；適用於篩選等旨在快速查找內容的地方。
除了導航之外，影片內容的排版佈局也有一定的規則。
分區明顯：
在TV端，每一處可操作性內容都需要有固定區域的劃分，無論是卡片、面性或者線性的區分。
沒有明顯分區的內容不僅容易淹沒在屏幕眾多內容中，而且容易影響頁面的規整性，用户對焦點的移動路徑也無法正確預期。
- 在形式1中，屏幕底部文案1—文案4處，無明顯分區，在未操作前，並不知道這個區域能不能獲得焦點，或者是以怎樣的形式獲得焦點；
- 形式2中，有了整塊分區，第一感覺是可以整體獲得焦點，但是也可能是其中的每個部分獲得焦點，這個也需要操作後確認；
- 形式3就比較明朗了，底部分為四個區域，在未操作前，用户能夠預期到每個區域都能夠獨立獲取到焦點。
有限數量：
根據調研，內容在橫向可擴展時，隱藏在屏幕之外的內容，越靠後用户查看的幾率越小。
所以在設計時，儘量不宜頻繁的的讓內容橫向擴展，或者橫向擴展的數量不宜過多，在縱向上，內容可以無限擴展。
- 左圖中，內容橫向移動時，內容控制在有限數量以內；在本人設計過程中，橫向擴展數量極限值一般為20個，大家可以根據實際情況排布；
- 右圖中，內容縱向移動時，內容可以無線擴展；比如首頁、電視劇一級頁面等，內容呈現瀑布流式移動，提供給用户儘量多的選擇。
規則佈局：
內容佈局如果是規整的十字型佈局是最佳佈局形式，不建議設計過於交錯的卡片佈局。
過於交錯的佈局會使用户對焦點的移動路徑無法正確預期，同時為技術同學增加了開發難度。
根據TV端用户的使用場景和操作方式，TV端的基本交互有以下幾個特點。
1. 簡單操作、層級少TV端層級不宜過深，否則用户容易迷失，而且過深的層級意味着過多的步驟，對於使用遙控器操作的用户很不友好。
一般來説，層級控制在3~5個以內是比較合適的。
2. 減少用户輸入由於目前用户的主流輸入方式還是遙控器，遙控器的輸入特點使它的輸入過程繁瑣、步驟多。
所以如非必要，儘量減少用户輸入。可以用選擇代替輸入、語音代替輸入、或者將輸入方式轉移都是比較好的方式。
目前大多數智能電視都融合了幾種輸入方式，用户可以根據所在場景選擇最便捷的輸入方式。
由於電視的娛樂性、觀看的沉浸式和遠距離的特點，使用户往往沒有耐心看大段的文字，高清大圖和音視頻更吸引用户眼球。
由於用户觀看電視時往往是輕鬆的狀態，導致注意力不會高度集中。
所以在一些特殊節點上，如果需要出現提示，這些提示需要明顯、簡潔。
在重要提示上，可以展示常駐提示，一般提示上，給出互動性小的toast提示即可。
由於TV端屏幕尺寸較大，往往可以展示很多內容，但是過多的內容也可能會讓用户抓不住當前重點。
所以在內容層級上可以首先展示最重要內容，當用户有需要時，再通過進一步操作展示出其餘內容。
由於TV端內容多，遙控器操作又有其不便捷性，所以為了方便用户，TV端往往會有一些隱藏的便捷性功能，這些功能在用户使用熟練之後會輕易掌握。
但是對完全沒使用過的新手用户來説，就像隱藏的彩蛋，無意間嘗試才會發現，所以為了避免用户探索，在初次使用時加上必要的引導可以提高操作便捷性。
以上是在實際項目過程中得出的一些經驗和心得，主要是圍繞一些通用性原則展開説明的，實際設計過程中，考慮的東西遠遠不止這些。
每個模塊都可以深入去挖掘，在實際做項目過程中也會有更深的體會。
這篇文章，希望給剛上路的同學帶來些指引，也希望大家共同交流學習。
本文由 @江邊菇涼 原創發佈於人人都是產品經理。未經許可，禁止轉載
題圖來自Unsplash，基於CC0協議