Alexa Web API for Gamesの概要



Alexa Web API for Gamesの概要

Alexa Web API for Gamesを使うと、Alexaデバイスでプレイ可能なゲームを作成できます。このAPIでは音声コマンドを組み込めるため、ユーザーは画面のタッチと音声でアプリを操作できます。

Alexa Web API for Gamesを使った開発

Alexa Web API for Gamesを使ってゲームを開発する際は、次の2つのパートを作成します。

  • ウェブアプリを起動し、音声リクエストを処理するAlexaカスタムスキルのパート。スキルコードはAlexa.Presentation.HTMLインターフェースを使ってウェブアプリを起動し、実行中にアプリと通信します。
  • ブラウザ表示とユーザーとの対話を行うウェブアプリのパート。ウェブアプリのコードはAlexa JavaScript APIを使って、アプリの実行中にスキルと通信します。

スキルを開発する際は、これらのパートを別々に作成し、後から統合することもできます。たとえば、ゲームのウェブアプリですべての機能が動くようになってから、Alexa音声と音声操作の呼び出しを追加することができます。

ユーザーがスキルやウェブアプリと対話する方法

ユーザーは通常どおりスキルを呼び出して対話します。スキルは、IntentRequestへの応答など対話の適切なポイントで、スキルエクスペリエンスの一環としてウェブアプリを起動します。たとえば、ユーザーに開始の準備はよいかをたずねるスキルをデザインするとします。

ユーザー: アレクサ、マイウェブゲームを開いて
Alexa: マイウェブゲームへようこそ。プレイの準備はいいですか?
ユーザー: はい
Alexa: わかりました。エンジンを起動します…(サウンドエフェクト)
スキルはウェブアプリを起動し、開始ページを表示します。

ウェブアプリが起動したら、ユーザーはタッチ(またはリモコン)と音声の両方を使ってアプリを操作します。たとえば、次のようなことができます。

  • 画面上のボタンを押すと、ウェブアプリ内のAlexa音声やその他のアクションをトリガーできます。
  • ゲームにコマンドを話しかけます( 「アレクサ、ビームを発射して!」など)。
  • アプリがトリガーした音声プロンプトに答えます( 「外れました! もう一度発射しますか?」)。

これは、ユーザーが「アレクサ、終了して」と言うなどして、ウェブアプリを終了するまで続きます。

スキルとウェブアプリとの通信

ユーザーがウェブアプリを操作している間、スキルとウェブアプリの間の通信にはAlexa.Presentation.HTMLインターフェースとAlexa JavaScript APIを使用します。

  • Alexa.Presentation.HTMLインターフェースは、スキルにウェブアプリとの通信を行うディレクティブとリクエストを提供します。スキルは、ディレクティブを返してウェブアプリに情報を送信し、ウェブアプリから受け取るイベントを待機するリクエストハンドラーを使用します。
  • Alexa JavaScript APIはウェブアプリに、スキルとの通信に使うメソッドとプロパティを含むAlexaクラスを提供します。ウェブアプリはこのクラスでメソッドを呼び出してスキルにメッセージを送信し、スキルから受け取るイベントを待機するコールバックを登録します。

次のようなフローで通信します。

  1. ユーザーがスキルを呼び出し、ウェブアプリを起動するリクエストをトリガーします。スキルは標準のLaunchRequestまたはIntentRequestを受け取ります。
  2. スキルコードのリクエストハンドラーは、応答でAlexa.Presentation.HTML.Startディレクティブを返します。これにより、Alexaにウェブアプリを起動するよう指示します。
  3. デバイスがウェブアプリを起動します。
  4. ウェブアプリはAlexa JavaScript APIを参照し、Clientクラスのインスタンスを作成するための'Alexa.create()'を呼び出します。
  5. ユーザーは通常どおりウェブアプリの操作を始めます。

ゲームが開始されたら、スキルとアプリの間の通信フローは次のようになります。

  • ウェブアプリはalexa.skill.sendMessage()を呼び出してスキルにメッセージを送信します。このメッセージにはたとえば、Alexaがユーザーに何か言うようプロンプトを出すなどのイベントが考えられます。各メッセージには、ウェブアプリで何が起きるかを定義したデータを含めることができます。また、オプションでsendMessage()の呼び出しが成功したかどうかを示すステータスコードを取得するコールバックを指定することもできます。
  • アプリからのこれらのメッセージは、Alexa.Presentation.HTML.Messageリクエストでスキルに送信されます。スキルは、受け取ったこれらのリクエストを処理し、ディレクティブと出力音声で応答します。
  • スキルは、アプリにメッセージを送信するAlexa.Presentation.HTML.HandleMessageディレクティブを返します。
  • ウェブアプリは、スキルから送信されたメッセージに応答するコールバックを登録します(alexa.skill.onMessage())。アプリが登録できるコールバックは1つだけです。このためコールバック関数には、メッセージ内で提供されるデータに基づいて複数のメッセージを処理するロジックを含める必要があります。

この対話中、スキルセッションは開いたままになります。また、Alexa JavaScript APIを使うと、ウェブアプリで追加のハンドラーを登録して、Alexa音声の開始や終了といったその他のイベントを待機できます。これらを使って、ボタンの押下といった画面上のイベントと音声コマンドとの間のフローを構築できます。

スキルとウェブアプリの通信を使って音声操作と対話を組み込む方法の例については、ウェブアプリに音声操作と対話を追加するを参照してください。

ウェブアプリとスキルセッション

ウェブアプリは、標準のスキルセッションライフサイクルを変更します。詳細については、以下のセクションを参照してください。

ウェブアプリを起動してセッションを開いたままにする

スキルがウェブアプリを起動するディレクティブを送信する際、応答にはfalseまたは未定義のshouldEndSessionを含める必要があります。これにより、スキルセッションは開いたままになり、ユーザーは画面上のウェブアプリと対話できます。

  • shouldEndSessionfalseのとき、Alexaは指定されたoutputSpeechを読み上げてから、数秒間マイクを有効にしてユーザーの応答を待機します。
  • shouldEndSessionが未定義の場合、Alexaは指定されたoutputSpeechを読み上げますが、マイクは有効にしません。セッションは開いたままになります。

画面上でウェブアプリがアクティブな間は、セッションは開いたままです。これは、Alexa Presentation LanguageやDisplayテンプレートを使って作成したスキルのような標準の画面コンテンツ付きスキルとは異なります。それらのスキルの場合、セッションは約30秒間開いたままになります。

ウェブアプリを終了するアクション

デバイスにウェブアプリが表示されると、アプリは画面上でアクティブになります。アプリは、次のアクションで終了します。

  • スキルセッションが終了した場合。
  • スキルがAlexa.Presentation.HTML以外のインターフェースからディレクティブを返した場合。これでウェブアプリは終了しますが、スキルセッションが終了するとは限りません。

たとえば、スキルがAlexa.Presentation.APL.RenderDocumentを返したとします。この場合、デバイスはウェブアプリを終了し、指定されたドキュメントをインフレートします。すると、スキルが別のAlexa.Presentation.HTML.Startディレクティブを送信してウェブアプリを再起動するまで、スキルセッションのライフサイクルが継続します。ライフサイクルについては、画面付きデバイスがスキルセッションに与える影響を参照してください。

スキルセッションを終了するアクション

以下のアクションのいずれかでセッションを終了できます。

  • スキルの応答でshouldEndSessiontrueに設定されていた場合。
  • ユーザーが「アレクサ、終了して」と言ってスキルを終了した場合。
  • ユーザーが「アレクサ、ホームに戻って」と言ってスキルを終了した場合。
  • ユーザーがウェブアプリとの対話を終了し、アイドル状態になった場合。設定したタイムアウト時間(最大30分)が経過すると、スキルセッションは終了します。一部のデバイスでは設定したタイムアウト値を無視するか、小さい値を設定できます。

スキルセッションが終了すると、ウェブアプリも終了します。

同じスキル内でのAlexa Web API for GamesとAlexa Presentation Languageの併用

1つのゲームで、Alexa Web API for GamesとAlexa Presentation Languageの両方を使うことができます。ただし、同じ画面に2つを混在させることはできません。応答ごとに、ウェブアプリかAPLドキュメントのどちらかを表示できます。

ウェブアプリが既に画面に表示されている場合に、Alexa.Presentation.APL.RenderDocumentまたはExecuteCommandsディレクティブを送信するとアプリが終了します。ゲームで必要な状態情報は必ず保存するようにしてください。

スキルでAPLを使用する場合は、APLインターフェースに対応するようにスキルを設定(スキルマニフェストのALEXA_PRESENTATION_APL)してください。

スキルとウェブアプリの要件

Alexa Web API for Gamesを使用するには、スキルとウェブアプリが次の要件を満たす必要があります。

  • DisplayテンプレートまたはAlexa Presentation Languageインターフェースに対応するようスキルを設定します。
  • ウェブアプリはインターネットに接続可能なHTTPSエンドポイントでホストされ、ウェブサーバーは有効で信頼できるSSL証明書を実装している必要があります。
  • ウェブアプリはゲームである必要があります。その他の種類のアプリをAlexa Web API for Gamesで使用することはできません。
  • ウェブアプリは、スキルとの通信で必要なAlexa JavaScript APIを使用する必要があります。

スキルとウェブアプリのテスト

開発マシンでは、Chrome DevToolsを使ってAmazon Fire TVデバイスで実行されるスキルのウェブアプリをデバッグできます。詳細については、Web App TesterとDevToolsの使用を参照してください。

HTMLゲームエンジンと関連ライブラリの使用

Web API for Gamesでは、グラフィックスや高度なオーディオの管理にさまざまなテクニックやツールを使用できます。HTMLとCSS、Canvas、SVG、WebGLを使って、アニメーションを作成できます。開発者は、さまざまなHTMLゲームフレームワークやライブラリの中から選択できます。よく使用されるオプションをいくつか紹介します。

  • Phaser – CanvasとWebGL用のゲームフレームワーク
  • Pixi.js – WebGLを使ったゲームフレームワークと2Dグラフィックス
  • three.js – WebGLを使った3Dライブラリとアプリフレームワーク
  • Howler.js – オーディオライブラリ