導(dǎo)航方式與輸入設(shè)備息息相關(guān),智能電視最主要的輸入設(shè)備還是遙控器,有時還輔以鼠標和鍵盤。鑒于電視用戶較為被動,因此需要設(shè)計清晰高效的導(dǎo)航系統(tǒng),幫助用戶快速定位到想要玩的內(nèi)容。
目前長虹智能電視用遙控器作為主要輸入設(shè)備,以十字方向鍵和確定鍵為核心,以數(shù)字字符鍵作為主要輸入按鍵(語音輸入API暫未開放)。因此,電視應(yīng)用導(dǎo)航最好基于這些按鍵(鍵值表)進行設(shè)計。
2.jpg (60.23 KB, 下載次數(shù): 15)
下載附件
保存到相冊
2014-5-23 19:41 上傳
應(yīng)用布局受長期使用習(xí)慣限制,電視用戶普遍接受遙控器上,以四個方向(上, 下, 左, 右)的作為導(dǎo)航鍵,進行內(nèi)容查找;以“確認鍵” 和“ 返回鍵”來確認或退出內(nèi)容。
因此,應(yīng)用導(dǎo)航設(shè)計最好以“十”字方向與“確認”鍵作為核心。電視應(yīng)用程序的布局必須簡單:
? 菜單元素的最好位置是在頂部或左列。
? 保持布局盡可能簡單:菜單和元素容器(列表、網(wǎng)格、單元素等)。
? 保持所有相關(guān)功能和信息在一起,而不是分散在屏幕上或者與非相關(guān)元素組合一起。
? 記住基本的應(yīng)用圖形設(shè)計理念:對齊、接近、平衡、一致性、對比和空白。
? 盡量自動處理某些任務(wù),以避免頻繁的用戶交互。
? 與手機應(yīng)用UI類似,顯示精簡、關(guān)鍵的信息。
布局舉例:
A、全屏布局。菜單欄與內(nèi)容欄,分布在不同界面上,但相互提供簡要入口。
2.jpg (13.2 KB, 下載次數(shù): 16)
下載附件
保存到相冊
2014-5-23 19:42 上傳
B、橫向布局。菜單欄與內(nèi)容欄,橫向分布在同一界面上。
4.jpg (13.62 KB, 下載次數(shù): 13)
下載附件
保存到相冊
2014-5-23 19:42 上傳
C、縱向布局。菜單欄與內(nèi)容欄,縱向分布在同一界面上。
5.jpg (16.89 KB, 下載次數(shù): 12)
下載附件
保存到相冊
2014-5-23 19:42 上傳
導(dǎo)航設(shè)計在基于十字方向鍵上設(shè)計導(dǎo)航時,菜單項一般存在三種狀態(tài),即“被選中(selected)”,“成為焦點(focused)”和“成為焦點并被選中 (focused and selected)“。針對于三種狀態(tài),內(nèi)容何時顯示很關(guān)鍵:
? 隨被選中對象改變而改變。某菜單項成為焦點并被選中(focused and selected)時,顯示該菜單項對應(yīng)的內(nèi)容,焦點仍然可以移動,顯示的內(nèi)容隨被選中的菜單項改變而改變。
? 隨成為焦點的對象改變而改變。某菜單項成為焦點,無需被選中,就顯示該菜單對應(yīng)的內(nèi)容,顯示的內(nèi)容隨焦點改變而改變。
總之,應(yīng)用導(dǎo)航設(shè)計時,應(yīng)遵循以下原則:
“導(dǎo)航設(shè)計的目標,是讓用戶快速定位,并且能夠預(yù)測出操作結(jié)果?!?
6.jpg (18.32 KB, 下載次數(shù): 8)
下載附件
保存到相冊
2014-5-23 19:42 上傳
|