タッチ対応レシーバー アプリ

レシーバは、タッチ操作機能がある場合とない場合があるデバイスでコンテンツを再生します。レシーバーは、センダーアプリでの操作とタッチ コントロールによる操作に直ちに応答する必要があります。

レシーバー UI のフィードバックの例:

  • 再生中
  • 一時停止
  • 再生位置 / シーク
  • バッファリング

  レシーバー UI

必須
  A   動画と音声のレシーバの場合、レシーバアプリをアダプティブにビルドして、あらゆる画面解像度とアスペクト比に対応できるようにします。

動画

Video Receiver UI

音声

オーディオ レシーバー UI


  B   動画および音声レシーバーでは、タッチ操作を示唆する要素を表示しないでください。たとえば、スワイプ ジェスチャーを示すために、ピーキング要素を表示しないでください。
  C   動画と音声の受信機では、タッチ操作を連想させる要素を表示しないでください。
  D   オーディオ レシーバーの場合、進行状況バーなどのコントロール タイプの要素を表示しないでください。


禁止事項: 覗き見要素、ボタンのように見えるアイコン、コントロール タイプの要素を表示しないでください。


  E   動画レシーバでは、再生中(一時停止中を含む)にレシーバにメタデータやコントロール要素を表示しないようにして、システムによって表示されるコントロールと競合しないようにします。


禁止: メタデータとコントロールを表示する


  F   オーディオ レシーバーの場合、すべてのメタデータ要素を保護領域の上に配置し、システムによって表示されるコントロールと重ならないようにします。

おすすめの方法

  • すべてのテキストは、ディスプレイ ユニットから 1.5 ~ 3 メートルの距離で読めるようにする必要があります。
 

  レシーバー アプリがアイドル状態

レシーバーがフォアグラウンドにあり、コンテンツが再生されていない場合、レシーバーにアイドル画面が表示されます。

必須
  アプリのロゴを使用して、どのレシーバー アプリが読み込まれているかを特定します。  
  B   アプリのロゴを含むすべての要素を保護領域の上に配置し、システムによって表示されるコントロールと重ならないようにします。

おすすめの方法

  • 「キャストの準備ができました」というテキストを表示して、アプリが読み込まれたことを確認します。
  • 5 分間アイドル状態の場合、レシーバの実行を停止し、接続されている送信側アプリを切断します。停止すると、デバイスのホーム画面が表示され、画面の焼き付きを防ぐことができます。

 

  レシーバー アプリの読み込み

ユーザーがレシーバに接続すると、レシーバアプリは、アプリのアイドル状態を表示したり、コンテンツの再生を開始したりする前に、まず読み込まれる必要があります。

必須
  アプリのロゴを表示して、どのレシーバー アプリが読み込まれているかを特定します。
  B   アニメーションの読み込みスピナーを表示して、レシーバ アプリが読み込まれていることを示します。

 

  レシーバーのコンテンツ読み込み

コンテンツの読み込み中、再生が開始される前に、レシーバーはコンテンツの読み込み中であることを示す情報を表示する必要があります。

必須
  A   コンテンツのタイトルやアートワークを表示して、読み込まれているコンテンツを特定します。
  B   アニメーションによる読み込み中のスピナーを表示して、コンテンツが読み込み中であることを示します。

ベスト プラクティス
コンテンツの再開時に、送信側から受信側への移行中に視聴者が何かを見逃すことがないよう、再生を 5 ~ 10 秒巻き戻します。

 

  レシーバーの再生

必須
  A   動画レシーバーの場合、再生中に要素を表示しないでください。画面をタップすると、プレーヤー コントロールが表示されます。
  B   音声レシーバーの場合、すべてのメタデータ要素を保護領域の上に配置し、コントロール要素は表示しません。画面をタップすると、プレーヤー コントロールが表示されます。

動画

画面をタップしてプレーヤー コントロールを表示します。

音声

画面をタップしてプレーヤー コントロールを表示します。

 

  受信側が一時停止

必須
  A   動画レシーバの場合、一時停止中は要素を表示しないでください。システムは、再生が一時停止していることを示す再生ボタンとともにプレーヤー コントロールを表示します。
  B   音声レシーバーの場合、一時停止状態では制御要素を表示しません。システムは、再生が一時停止していることを示す再生ボタン付きのプレーヤー コントロールを表示します。

おすすめの方法

  • レシーバー アプリは、ユーザーから再生開始の明示的なリクエスト(再生の再開、キュー内のアイテムのスキップなど)がない限り、コンテンツの再生を継続すべきではありません。
  • 20 分間アイドル状態の場合、レシーバの実行を停止し、接続されている送信側アプリをすべて切断します。停止すると、デバイスのホーム画面が表示され、画面の焼き付きを防ぐことができます。
  • バックグラウンド セッションの今後の実装との整合性を確保します。
  • 該当する場合、アイドル時間のためにレシーバが停止したときに、一時停止した場所を保存して、ユーザーが後でその場所から再生を再開できるようにします。

動画

動画が一時停止しました

音声

音声を一時停止しました

 

  レシーバーのバッファリング

ネットワーク レイテンシなどの要因によって再生が遅延すると、受信側でバッファリングが発生します。

必須
  A   バッファリングが数秒間続いても、要素を表示しません。画面をタップしてプレーヤーのコントロールを表示したり、スワイプして戻ったりできます。

動画

受信側のバッファリング

音声

受信側のバッファリング

 

  レシーバーがキャストを停止する

再生が停止またはタイムアウトすると、レシーバーはレシーバーのアイドル状態の UI を表示します。

必須
  アプリのロゴを表示して、どのレシーバー アプリが読み込まれているか、またはアイドル状態であるかを特定します。
  B   アプリのロゴを含むすべての要素を保護領域の上に配置し、システムによって表示されるコントロールと重ならないようにします。

おすすめの方法

  • 5 分間アイドル状態の場合、レシーバー アプリから切断し、実行を停止します。停止すると、レシーバーのホーム画面が表示され、画面の焼き付きを防ぐことができます。

 

 

このデザイン ガイドで使用されている画像は、Blender Foundation の提供によるもので、著作権またはクリエイティブ・コモンズ ライセンスに基づいて共有されています。

  • Elephant's Dream: (c) copyright 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) copyright 2008, Blender Foundation / www.bigbuckbunny.org