全国服务热线:4006-028-024 成都热线:028-86633922
新闻中心网站专题联系我们
行业新闻 建站经验 网站建设资讯 手机网站资讯 微信开发资讯 APP开发资讯 商城网站资讯

成都手机网站建设:设计TV这种大屏幕的应用程序需要注意的

发布人:桔子科技    发布时间:2017-09-10 08:56:49    分享到:
虽然同样是安卓系统,设计TV这种大屏幕的应用程序和设计手机平板等其它设备不太一样,需要注意一些点。

1. 在Material Design的基础上进行设计

可以使不同平台的应用保持一致性:相同的外观和相同的使用体验,令用户有熟悉感,而且Material Design也给用户提供了愉悦和实用的体验。

\

2. 易操作的界面

内容应该是电视应用的核心,用户不用在屏幕上阅读文字信息也能轻松操作;并且,视频或媒体需要能够被用户轻松播放,这意味着需要减少点击操作的次数。

3.最小化的界面

为了使用户在使用TV应用有看电影的体验,应该将用户界面保持在最小化最简洁的状态,尽可能避免使用文字。

4. 保持简洁

采用最少的步骤完成操作:

5. 遥控器导航

用户是使用D-pad遥控器控制浏览电视上的内容,D-pad遥控器包括四个方向按钮和一个中央选择按钮,另外还有后退按钮和主页按钮。这些控制按钮限制了用户,只能通过内容上下左右导航,并返回其导航流程。可以通过列表和网格布局来解释这些限制条件,以X轴和Y轴的路径,供用户轻松浏览。为了帮助用户更好的导航,当前选中的聚焦元素和未选中元素的样式状态对比应该尽可能的拉大。屏幕上的每个元素都应该有聚焦状态,这意味着屏幕上始终会有一个最容易被发现的聚焦元素。

元素的聚焦状态可以通过以下方式实现:

注意:为了提高效率,合理利用安卓TV提供的组件,不要在应用中使用工具栏或溢出菜单。

由于用户可以用不同类型的遥控器进行导航操作,因此应该确保支持任何非标准输入的遥控器以确保交互顺利进行。

6. 用户输入

应该为应用提供灵活的输入方式,其中一种重要的方法是语音输入。虽然安卓TV具有允许通过屏幕进行文字输入的虚拟键盘,使用遥控器输入会很麻烦(使用游戏手柄操作稍微简单一些)。因此,语音输入对于减少阻力是很重要的。

另一个选择是将用户输入委托给移动设备——允许用户使用其移动设备向电视系统输入文本信息。为此,应用应该能够检测到附近的设备(可能使用电视机连接到的WiFi网络),并通过启动应用程序显示输入文本的选项,允许用户通过移动设备进行输入。

 

7. 动态内容

为了提高用户的活跃度和关注度,应该为应用添加动态特性。最重要的是,TV应用中显示的内容应该和任何其它应用一样,如果应用中没有频繁给用户新的令人兴奋的内容,用户会感到无聊。例如,用户在打开媒体内容应用时,应该加载最新的内容,而不是显示以前看过的内容。

和移动应用程序一样,我们应该在应用中支持分页。当达到最后一个显示的内容时,应该允许用户继续消费内容。

8. 背景

设计师应该尽可能合理利用大屏幕,可以通过在应用中展示美丽的、具有视觉冲击的背景来实现。虽然可以使用Leanback Library中的BackgroundManager类轻松实现,但还可以展示内容数据来更改安卓TV系统的背景。

当用户浏览主页内容卡切换到焦点状态时,背景图也将作为系统背景来显示。通过将图像源附加到内容卡上显示的数据对象可以轻松实现。如果可能,卡片上显示的不同的缩略图像应该应用于背景——在浏览内容时,会带来令人满意的视觉差异。

虽然背景图片的尺寸应为1920×1080 px,但实际上必须要使用大5%的尺寸来照顾到动画事件,所以,背景图片的尺寸应该是2016×1134 px。如果背景图片不符合这个要求,系统将自动缩放背景图片。

注意:背景图片应该是没有透明度的。

9. 推荐

应用中最新和相关的内容应该放在主屏幕的推荐栏中。这有助于减少用户完成打开电视到使用内容所需的步骤数量。

推荐应该基于应用中获得的用户数据。例如,用户之前观看过的内容。推荐项目将在安卓TV主屏幕的第一行显示。

推荐的内容可以是回到用户之前观看的内容,或推荐他们新的或相关的内容。这里有几种可以推荐给用户内容的类型,详细内容如下:

推荐不同类型的内容,在应用中展示的方法:

虽然可以将推荐分配权重来决定其显示顺序,但是每个分组都会相互排序,来确保主要的推荐不会被错误排序。

10. 图标

图标不仅可以使应用更美观、有趣,它还可以向用户描绘文本信息。正如之前说提出的,应该通过视觉的手段来展现TV的文本内容。

 

11. 音频

我们可以在TV应用中使用声音来增强电影体验。声音如果被正确使用,可以是一种补充视觉效果的伟大方式,甚至可以不需要使用文本通知。使用声音很容易把效果弄得过于夸张,所以设计恰到好处的声音是非常重要的。

声音是在屏幕上显示视觉通知的绝佳代替选择。这样可以不打断屏幕中目前的内容,在电视屏幕上显示是系统组件(如toast和弹出框)看起来并不是好。用户试图与禁用组件进行交互,或到达列表的尾部时,播放声音可以很好的表达错误情况的发生。

当用户只是部分使用电视应用时,可以以声音的形式得到通知反馈。如果用户正在和朋友聊天,或者用户阅读时以电视播放背景音乐,也可以让他们知道发生了什么。

12. 排版

首先,为应用设计界面时,应该确保所有界面都有横屏模式。同时,也应该确保基于焦点的导航创建易于浏览的布局。可以使用行,列表,网格,使用X轴和Y轴来布局内容。

电视与手机和平板有完全不同的体验,所以以往移动设备的布局可能不使用于电视应用。应该避免的是:

13. OVERSCAN

所谓Overscan区域,就是电视机屏幕四周某些不可见的区域,这是电视机的特性。显示内容并不能总是在“安全区域”中显示,而不被遮蔽。我们需要确保考虑在Overscan区域,没有任何文字或组件被电视屏幕边缘遮蔽。

我们可以通过添加大小为屏幕尺寸5%的边距来避免内容被Overscan区域遮挡。1920×1080的屏幕将具有27px的垂直边距和48px的水平边距。

14. 颜色

与移动设备的渲染相比,电视屏幕渲染可能是非常不精准的。可能是由于电视的设置,滤色和任何滤波可能发生,这些都可能导致色相或亮度差异在屏幕上无法区分或夸张。为了避免严重的颜色问题,我们可以采取以下方法:

 

15. 字体

尽管上面提到,在设计电视应用时,文字内容应该保持在最低限度,但这并不意味着我们完全不使用任何文本。在使用文字的情况下,我们可以依照一些准则来确保电视屏幕中的文字在一定距离可以被读取和导航。下面是电视应用中用于排版的一些字体及大小的推荐:

 

注意:由于安卓TV应用会在各种各样的制造商设备上运行,电视屏幕都具有不同的对比度、锐度和色彩。我们应该避免使用过细的字体和字重,这会使用户难以阅读。

16. 文字

如前所述,电视应用中的文字应该保持在最低限度。大多数用户是远距离阅读文本,这会导致阅读变得非常困难,所以不要期待用户会在看电视的时候阅读大段的文字。但是,当我们确实需要使用文本的时候,我们需要注意以下几点:

下一篇:成都手机网站建设:关于租房手机网站的那些事上一篇:成都手机网站建设:移动端直达联盟的构建

最新案例
手机/微网站
  1. [成都]成都微信公众平台开发和微信公众平台建设
  2. [成都]成都微信网站建设:企业如何借助微信生态链加快自身变革
  3. [成都]成都微信网站建设:得小程序者得天下
  4. [成都]手机网站建设:移动端的返回顶部悬浮按钮还需要存在吗?
  5. [成都]成都手机网站建设:androidbeta项目是什么
  6. [成都]成都手机网站建设:2016 Android 开发:7日立秋 凉气始肃
网络营销
  1. 餐饮app发展的新趋势:餐饮美食APP制作方案
  2. 成都APP开发:智能音响app开发能为用户带来什么
  3. 成都APP开发:为什么近年来电竞软件开发开始升温
  4. 成都APP开发:为什么马拉松app开发在中国出现井喷式发展
  5. 成都APP开发:​开发成都停车APP
  6. 成都APP开发:企业取名app开发为企业提供专业的取名技巧

  • 电话:4006-028-024 028-86633922

    邮箱:Service@orangeapp.cn

    成都市成华区崔家店路789号上城国际1-24-9号

qqsina