在过去一年多的时间里,我有幸参与了电视端大屏幕的项目。在不断的尝试、探索和设计中,也收获了一些关于电视端的设计经验,因此将这些「电视交互设计的一些事」分享出来,共同探讨电视端的设计。 一. 硬件+远距离操控——基本交互 基于桌面资料研究以及设计经验,总结了基本交互主要包含以下几个关键内容:遥控器输入、导航和菜单、信息展现、控件摆放和焦点状态。 二. 遥控器输入 当我们用手指快速便捷地在手机屏幕上点击或滑动时,主流电视大屏及应用的操作还是使用遥控器进行操作。而市面上不同电视生产商生产的遥控器也有着不同的造型和按键数量,如下图,分别展示了苹果、谷歌、小米、乐视和中兴机顶盒的遥控器。
△ 不同厂商的遥控器 尽管有着千奇百怪的造型和按键数量,但几乎全部的遥控器都有几个相同的按键:上、下、左、右、返回键和OK键。它们也构成了遥控器输入的基本交互方式,通过「上下左右键」移动焦点位置,选中界面元素,按「OK键」进行相关操作,按「返回键」返回。
△ 遥控器的基本按键 而上图中还有一些按键,如数字键、菜单键,有些遥控器是没有它们的。这里强调下「菜单键」,比如之前的一个设计,将不常用的操作隐藏到菜单键中,当用户按菜单键时再唤出操作(如安卓端的“长按”,iOS端的“左滑”等)。后来,才发现并不是所有遥控器都有该按键,只能在后续版本中迭代优化。因此,在设计之前,不妨研究一下你的输入硬件设备,避免因「刻板印象」造成不必要的坑。 遥控器输入的特性决定了用户在输入时的效率和便捷程度都大打折扣,因此,在这样的局限下,设计师只能通过各种不同的方式来尽量减弱这种不便捷。 1. 减少用户输入 能不让用户输入就不输入,尽量只让用户去做「选择型」输入,避免大量「文字型」输入。比如电视上的搜索功能中,及时联想、热搜词就变得极为重要,如下图右图所示。
△ 键盘输入的优化 2. 优化输入模式 结合项目情况,去尝试优化输入模式。比如充分利用遥控器数字键输入,重新设计键盘以减少用户操作,如上图左图所示。 3. 将输入转移 越来越多的产品开始将一些输入转移并引导到手机端进行操作,甚至将手机端直接做为遥控器。比如最常见的扫码登录和TV助手类APP。输入转移能大大提升用户操作效率,但设计时还是要结合具体场景,避免用户过多的在手机和遥控器间切换。 4. 创新的输入方式 随着各种技术的发展,在未来,电视端也会有越来越多的输入方式,而不仅限于遥控器输入。如智能语音输入,而我们也需要了解这些新技术,才能帮助我们不断的创新并给用户带来优秀的体验。 三. 导航和菜单 电视端的导航和菜单大多数和手机端、PC端是类似的,但因遥控器输入的特性或多或少的有些差异,主要分为以下几类。 1. 十字 十字导航在国内的产品中比较少见,但因它的主导航和二级导航同时展开,能与十字方向键完美契合,用户可通过方向键在主导航和二级导航之间以最高效的方式切换,如下图所示。但它最多展现2级菜单,即纵向菜单和横向菜单,又浪费了大量界面空白,因此针对国内大而全的产品而言,往往不是特别适用。
△ 十字导航 2. 磁贴 磁贴广泛应用于各种电视应用产品,一般包含主导航和二级磁贴。往往二级磁贴的展现能使信息更加扁平、直观及可视化,且相比于十字导航,操作的方向不会受到限制。但往往焦点从磁贴移回到左侧/上侧导航需要更多的操作成本,如下图所示。磁贴的信息展现能够充分利用界面空间,并把信息前置,因此,对很多内容型产品而言,磁贴可以很好的适用内容露出,吸引用户进入。
△ 磁贴信息展示 3. Tab (责任编辑:admin) |