支持触控的接收器应用

接收器在可能具有触控功能或不具备触控功能的设备上播放内容。接收方必须立即响应发送方应用中的操作以及触控操作。

接收器界面反馈示例:

  • 正在游戏中
  • 已暂停
  • 播放位置 / 跳转
  • 正在缓冲

  接收器界面

必需
  A  对于视频和音频接收器,请将接收器应用构建为自适应应用,以便它可以适应任何屏幕分辨率和宽高比。

视频

视频接收器界面

音频

音频接收器界面


  B   对于视频和音频接收器,请勿显示建议触摸手势的元素。例如,不要显示快速滑动元素来指示滑动手势。
  C   对于视频和音频接收器,请勿显示任何会建议触摸交互的元素。
  D   对于音频接收器,请勿显示任何控件类型的元素,如进度条。


错误做法:显示短暂显示元素、看起来像按钮的图标或控件类型元素。


  E  对于视频接收器,请勿在播放过程中(包括暂停状态下)在接收器上显示任何元数据或控件元素,以免与系统显示的控件发生冲突。


错误做法:显示元数据和控件


  F   对于音频接收器,请将所有元数据元素放置在受保护区域上方,以免与系统显示的控件重叠。

最佳做法

  • 在与显示屏相距 5 到 10 英尺的范围内,所有文字都应清晰可辨。
 

  接收器应用处于空闲状态

当接收器位于前台但并未播放任何内容时,接收器上会显示空闲屏幕。

必需
  A  使用应用徽标确定加载的是哪个接收设备应用。
  B   将所有元素(包括应用徽标)放在受保护区域上方,使其不与系统显示的任何控件重叠。

最佳做法

  • 显示“可以投放”文字,确定应用已加载。
  • 在接收器空闲 5 分钟时停止运行,并断开所有已连接的发送器应用。停止后,系统会显示设备主屏幕,这有助于防止烧屏。

 

  接收器应用加载

当用户连接到接收器后,接收器应用必须先加载,然后才能显示应用闲置状态或开始播放内容。

必需
  A   通过显示应用徽标来确定正在加载的接收方应用。
  B   通过显示动画加载旋转图标来确定接收器应用正在加载。

 

  接收器内容加载

在内容加载期间以及播放开始之前,接收器应显示信息以指示内容正在加载。

必需
  A  通过显示内容标题或海报图片来标识正在加载的内容。
  B   通过显示动画加载旋转图标来识别内容正在加载。

最佳实践
恢复内容时,快退播放 5 到 10 秒,确保观看者在从发送方转换为接收方的过程中不会错过任何内容。

 

  接收器播放

必需
  A  对于视频接收器,播放期间切勿显示任何元素。点按屏幕时,系统会显示播放器控件。
  B   对于音频接收器,请将所有元数据元素放置在受保护区域上方,并且不要显示任何控件元素。点按屏幕时,系统会显示播放器控件。

视频

用户点按屏幕以显示播放器控件。

音频

用户点按屏幕以显示播放器控件。

 

  接收器已暂停

必需
  A  对于视频接收器,请勿在暂停状态下显示任何元素。系统将显示带有播放按钮的播放器控件,以表明已暂停播放。
  B   对于音频接收器,在暂停状态下不显示任何控制元素。系统将显示带有播放按钮的播放器控件,以表明已暂停播放。

最佳做法

  • 除非用户明确要求开始播放内容(例如恢复播放或跳过队列中的内容),否则接收端应用不应继续播放内容。
  • 在接收器闲置 20 分钟后停止运行,并断开所有已连接的发送器应用。停止后,系统会显示设备主屏幕,这有助于防止烧屏。
  • 确保与未来后台会话的实现保持一致。
  • 如果适用,当接收器因空闲时间而停止时,请存储暂停的位置,以便用户稍后可以从该点恢复播放。

视频

视频已暂停

音频

音频已暂停

 

  接收器缓冲

当网络延迟或其他因素导致播放延迟时,就会发生接收器上的缓冲。

必需
  A  不显示任何元素,即使缓冲持续数秒也是如此。用户可以点按屏幕以显示播放器控件,或者滑动屏幕返回。

视频

接收器缓冲

音频

接收器缓冲

 

  接收器停止投射

当播放停止或超时时,接收器会显示接收器空闲界面。

必需
  A  通过显示应用徽标来标识哪个接收设备应用处于已加载或空闲状态。
  B   将所有元素(包括应用徽标)放在受保护区域上方,使其不与系统显示的任何控件重叠。

最佳做法

  • 断开与接收设备应用的连接,并在其空闲 5 分钟后停止运行。 停止后,系统会显示接收器主屏幕,这有助于防止屏幕烧屏。

 

 

本设计指南中使用的图片由 Blender Foundation 提供,并根据版权或知识共享许可共享。

  • 大象之梦:(c) 版权所有 2006,Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org
  • Sintel:(c) 版权 Blender Foundation | www.sintel.org
  • Tears of Steel:(CC) Blender Foundation | mango.blender.org
  • Big Buck Bunny:(c) 版权所有 2008,Blender Foundation / www.bigbuckbunny.org