Google Cast プラットフォームのユーザー エクスペリエンス

Google Cast を使用すると、Android、iOS、Chrome ウェブアプリから、次のような Cast 対応デバイスにコンテンツ(動画、音声、画面共有(ミラーリング)など)を「ストリーミング」できます。

  • Google Chromecast
  • Google Cast 対応テレビ
  • Google Cast 対応スピーカー
  • スマートディスプレイ(シン クライアントとして使用するポータブル タッチスクリーン LCD モニター)
  • Android タブレット

Google Cast のインタラクション モデルでは、スマートフォン、タブレット、ノートパソコンが送信側となり、再生を操作するリモコンとして機能します。テレビ、ディスプレイ、ホルダーに装着したタブレットが受信側となり、送信側からの指示を受け取り、受信側のインターネット接続からコンテンツを表示します。すべてのユーザー アクション(タップとスワイプ)は、送信側デバイスとウェブ レシーバーの両方で実行できます。

キャストは、送信側 UI と受信側 UI の 2 つ以上の画面間の調整に依存します。これらの画面は連携して動作する必要があります。たとえば、モバイル デバイスのボタンを押してコンテンツを一時停止すると、テレビに一時停止したことが示され、モバイル デバイスには再生を再開するための再生ボタンが表示されます。

考慮事項

ハードウェアとリソースの制限により、Google Cast 対応アプリには一定の制限が適用されます。

  • キャスト デバイスは低消費電力デバイスですが、メモリ、CPU、GPU に制限があります。そのため、Web Receiver アプリはできる限り軽量化する必要があります。
  • Cast と Google Cast のインタラクション モデルでは、ウェブ レシーバー アプリと送信元アプリの両方でタブ、ウィンドウ、ポップアップを作成できます。また、タップやスワイプなどのユーザー入力を直接受け入れることもできます。たとえば、ホルダーに装着されたタブレットやディスプレイ上のウェブレシーバー アプリは、一時停止ボタンを表示してユーザーのタップを受け付けることができます。このように、アプリケーションのすべてのアクションは、ウェブ受信側または送信側のアプリケーションからトリガーする必要があります。
  • スマートディスプレイは、送信元アプリまたは UI のタップによるユーザー入力をサポートしています。
  • ウェブ レシーバーは、動画の再生に最適化された Chrome ブラウザです。そのため、現在のところ、WebGL と Chrome ネイティブ クライアント(NaCL)はサポートされていません。また、Chrome 拡張機能もサポートされていません。
  • Cast は、<audio> タグと <video> タグで単一のメディア ストリームの同時再生、または WebAudio API を使用した複数のオーディオ トラックをサポートしています。DOM で一度に有効にできる動画要素は 1 つだけです。また、動画の合成、操作、変換、回転、ズームもサポートされていません。

全体的な設計原則

ユーザー インターフェースを開発する際は、次の点に注意してください。

ウェブレシーバーのインターフェース:

  • ウェブレシーバには、アプリの状態(一時停止中、再生中、エラー メッセージなど)を記述するインタラクティブな要素と情報要素の両方を配置できます。ユーザー操作は、Cast センダー(スマートフォン、タブレット、Chrome ブラウザ)またはウェブ レシーバ(テレビ、ディスプレイ、タブレット)で行われます。
  • 動画のアクションはテレビ画面の中央で行われるため、UI 要素がプレゼンテーションの邪魔にならないようにしてください。オーバースキャンを考慮して、Web Receiver の画面の下 3 分の 1 の内側に UI 要素を配置し、画面の端から 10% の余白を確保します。
  • 可能であれば、画面の状態から別の状態への遷移はスムーズで、映画のような感覚になるようにします。状態から状態への急な移動ではなく、フェードインやフェードアウトなどの遷移を使用します。たとえば、コンテンツの読み込み状態が画面に残り、メディアの再生状態にフェードインします。

送信者のインターフェース:

  • 送信側はユーザー アクションをサポートし、ウェブ受信側はステータス情報を表示します。たとえば、コンテンツが一時停止された場合、テレビは一時停止したことを示し、モバイル デバイスは再生を開始する準備ができたことを示します(ユーザーに再生ボタンを表示するなど)。
  • 速度は非常に大事です。ユーザーがキャスト コントロールをすばやく見つけ、大画面でコンテンツの再生がすぐに開始できるようにする必要があります。コンテンツの読み込み中は、アニメーションするローディング インジケーターや画面遷移を使用して、処理が進んでいることがユーザーにわかるようにします。

Cast アプリケーションがこれらの原則に準拠していることを確認する最も簡単な方法は、Cast のデザイン チェックリストでユーザー インターフェースを確認し、Cast アプリケーションをテストすることです。

ブランド ガイドライン

以下の Google Cast ブランド ガイドラインはアプリ デベロッパー向けであり、アプリをテキストで記述するために従わなければならない追加要件に焦点を当てています。Cast デバイスのブランド ガイドラインについては、Partner Marketing Hub をご覧ください。アプリが Google Cast に対応していることを他者に知らせるには、「Google Cast 対応」という用語を使用します。ただし、アプリが Cast の SDK デベロッパー向け追加利用規約設計チェックリストに準拠していること、および「Google Cast 対応」の使用が Google のブランディング ガイドラインに準拠していることを確認してください。

同様に、アプリやデバイスが Google のバッジガイドラインに準拠していれば、Google Cast バッジを使用できます。Google は、ブランド ガイドラインに準拠していない場合に、バッジの変更または使用の中止をリクエストする権利を有します。

テキストの「Google Cast」

  • (ハードウェア製品ではなく)アプリを Cast 対応と説明する場合は、「Google Cast 対応」という表現を使用してください。(例: 「このアプリは Google Cast 対応です」)。
  • Cast 対応のサードパーティ製ハードウェア製品について説明する場合は、「この {TV} は Google Cast に対応しています」、「これらの {スピーカー} は Google Cast に対応しています」という表現を使用します。
  • テキストで記述する場合は、「Google」と「Cast」を大文字で表記してください。
  • マーケティング資料で「Google Cast」をテキストまたはバッジやロゴで使用する場合は、次の法的帰属を表示する必要があります。Google Cast は Google LLC の商標です。
  • アプリのタイトルに「Google Cast」を含めないでください(XYZ Google Cast アプリなど)。

Google Cast 対応アプリのメッセージ アプリ

次のような方法でアプリを宣伝できます。

  • 「XYZ は Google Cast 対応アプリで、お気に入りのエンターテイメントをモバイル デバイスからテレビにストリーミングできます。」
  • 「XYZ アプリが Google Cast 対応テレビで利用可能になりました。」
  • 「XYZ アプリは、Google Chromecast、Google Cast Audio、Google Cast 対応のテレビやスピーカーなど、すべての Google Cast 製品で利用できるようになりました。」
  • 「XYZ アプリは Google Cast に対応しており、Google Cast 対応のテレビでお気に入りの番組、映画、音楽、ゲームをすべてお楽しみいただけます。」
  • 「XYZ アプリが Google Cast に対応し、ユーザーはスマートフォンから Google Cast 対応のテレビにコンテンツをストリーミングできるようになりました。」

Google Cast バッジ

ウェブサイト、アプリストアの掲載情報、マーケティング資料、プロモーション資料で「Google Cast」バッジを使用して、Cast プロトコルを使用するデバイスとの互換性を示せます。

  • バッジ画像の色、比率、間隔、その他の要素を変更しないでください。
  • 他のコンポーネント技術(Bluetooth、Spotify Connect、AirPlay など)のロゴと一緒に使用する場合は、Google Cast バッジのサイズがそれらのロゴと同じかそれ以上である必要があります。
  • バッジをページの主要な要素にしないでください。
  • バッジとページ上の他のロゴやアイコンの間には十分な間隔を空けます。
  • 白、明るい色、または中間色の背景で使用する場合は、黒のバッジを使用してください。
  • 黒または暗い色の背景に使用する場合は、白いバッジを使用します。
  • アダルト コンテンツを含むページ、ギャンブルを促進するページ、暴力を助長するページ、ヘイトスピーチを含むページ、21 歳未満の人にタバコまたはアルコールを販売するページ、他の適用法または規制に違反するページ、またはその他の不快なページでバッジを使用しないでください。

バッジのリンク

Google Cast バッジをオンラインで使用する場合は、次のいずれかにリンクする必要があります。

  • Google Cast 対応アプリとプロダクトの一覧については、g.co/castapps をご覧ください。
  • 公開した商品のリスト。
  • 貴社が公開した特定の商品の詳細ページ。
  • 公開しているアプリのリスト。
  • Google Play または Apple App Store で公開されている、デベロッパーが公開した特定のアプリの詳細ページ。

Google Cast バッジのアセットをダウンロードする

ダウンロード バンドルには、Portable Network Graphics(.png)、Adobe Illustrator(.ai)、Encapsulated Postscript(.eps)の形式が含まれています。

Google Cast バッジのプレビュー

利用可能なバッジと使用方法については、Partner Hub バッジ ガイドラインのページをご覧ください。