開発するAlexaスキルに合ったマルチモーダル技術の選び方

Joe Muoio Dec 21, 2020
Share:
Design Build Smart Screens Multimodal
Blog_Header_Post_Img

スピーカー以外にも、Alexa搭載デバイスには多くの種類があります。Alexaは、FireTVやEcho ShowなどのAmazonの画面付きデバイスのほか、LGやSamsungの一部のテレビ、FacebookのPortalといった他社製のデバイスなど、複数の操作手段をユーザーに提供するデバイスにも対応しています。ユーザーはAlexaを使用する際、画面の有無にかかわらず、デバイスのすべての機能が使えるものと期待します。たとえば、Echo Dot with Clockは7セグメントのキャラクターディスプレイをサポートしており、ユーザーは時刻や簡単なテキストをひとめで確認できます。Alexaスキル開発者は、この機能をさまざまな方法で操作することで、スキルの魅力をさらに高めることができます。このブログ記事では、Alexa Skills Kitで利用可能なマルチモーダル機能を使用してスキルを強化するためのさまざまな方法について説明します。

Alexa Presentation Languageですべてのマルチモーダルデバイスに対応する

Alexa Presentation Language(APL)は、Alexa搭載デバイスの種類を問わず、すべてのユーザーにリーチできるカスタムの視覚エクスペリエンスを構築するうえで最適なツールです。ユーザーがAlexaエクスペリエンスに望んでいるのは、すばやく起動すること、ひとめでわかること、使用するすべてのAlexaデバイスで同じ忠実度の視覚要素/音声を利用できることです。APLはこのことを念頭に置いて、ゼロから開発されました。オープンソースのC++ベースのライブラリで、デバイス上でネイティブに近い速度でレンダリングするだけでなく、APLの視覚要素をすべてのAlexa搭載デバイスで同じようにレンダリングすることもできます。さらに、デバイスメーカーが多額の追加コストをかけることなく、一貫性を保ってAPLを統合することも可能になります。たとえば、FacebookのPortalでは、Echo Show 8と同じように視覚要素がレンダリングされます。開発者にとっては、特にマルチモーダルなAlexaスキルを開発する場合、Alexa搭載デバイスごとにビルドしなくて済むようになるので、この統合は重要です。Viewportプロファイルを使用して独自の視覚要素のスタイルを定義したり、Amazonのレスポンシブ対応コンポーネントやテンプレートを使用したりすることで、レスポンシブ対応の視覚要素を作成して、さまざまな画面解像度に対応できます。こうした動作に関するルールは、すべてのデバイスで共通です。

An image showing a text list of grocery items with a gray or green background across a large variety of Alexa enabled devices.

APL Listテンプレートをさまざまなデバイスで使用した例(上図)

APLでは非常に多くのことが行えます。テキスト画像ビデオの基本的な表示機能を提供するほか、コマンドを使用してこれらのコンポーネントにアニメーションを適用することもできます。Alexa Vector Graphics(SVGのサブセット)を使用すると、ベクター画像やアニメーションを表示できます。さらに、ScrollViewPagerなど、その他のコンポーネントのレイアウトに役立つコンポーネントを使えば、視覚要素のデザイン面で大きな柔軟性が得られます。APLでは、コンテンツとデータソースから表示を切り離すためのツールが提供されるほか、データバインディングコンテキストにTimeプリミティブやMathプリミティブといった追加情報も含まれています。APLのデザインでは、音声と発話テクノロジーとの緊密な統合も考慮されています。APLには音声ナビゲーションや、音声とテキストの同期などの機能が組み込まれています。APLでは、画面上のテキストの音声変換などのタスクを行うトランスフォーマーが定義されており、さらに緊密なAlexa搭載デバイスとの統合を実現します。 APL 1.4以降には、レスポンシブ対応コンポーネントやテンプレート、改良されたAVG形式、新しいコンポーネントやコマンド、ユーザージェスチャーのサポートなどの新機能が追加されました。APLが一般公開されてから約1年が経ち、この製品の機能はますます豊富になっています。今後も、APLの改良を鋭意進めてまいります。

A showcase of different skills using APL visuals.

APLの視覚要素の例(上図)

APLはリーチが最も広く、レンダリング速度も最速であり、常に機能が拡充されています。APLをまだ使用したことがない方や復習したい方は、詳細なチュートリアルでAPLの視覚要素作成の基本概念を説明していますので、ぜひご覧ください。また、Pet Talesスキルレスポンシブ対応レイアウトのサンプルスキルなど、優れたコードサンプルもご用意しています。音声エクスペリエンスを視覚要素で補完するAlexaスキルを作成する場合は、APLが最適なツールです。

注: Alexaの視覚要素を作成する手段として、最初に開発されたのはDisplayテンプレートでした。この7つのテンプレートは柔軟性に乏しく、レイアウトや表示のカスタマイズはほとんどできません。このテンプレートが一部のデバイス(Echo Show、Echo Spot、Fire TV、一部のFireタブレット)でしかサポートされていないのに対して、APLはすべてのAlexa搭載デバイスに対応しています。また、はるかに多くのコントロールを使用して柔軟にデザインをカスタマイズできます。Displayテンプレートの外観を気に入っていてスキルで使いたいとお考えの場合や、DisplayテンプレートからAPLに移行する場合は、レスポンシブ対応テンプレートを使用するか、APLオーサリングツールに含まれる定義済みのスターターテンプレートから始めることをお勧めします。

An image of the APL authoring tool starting page with the title: Choose how you'd like to create visuals for your skill. The template options listed from left to right are: Image Display Sample, Long Text Sample, Short Text Sample, Image Right Detail Sample, Image Left Detail Sample, Image Forward List Sample, Text Forward List Sample, Start from Scratch, Upload Code

APLオーサリングツールのスタートページ(上図)には、カスタマイズ可能なサンプルが用意されています。

APL for Textでキャラクターディスプレイに対応する

APLは、画面ベースの視覚要素を定義すること以外にも利用できます。Echo Dot with clock(7セグメントの英数字ディスプレイ)は、キャラクターディスプレイを搭載したマルチモーダルデバイスでもあります。このデバイスには、画面付きデバイスと同じAPLの枠組みを使用して対応できますが、サポートされているコンポーネントに違いがあることに注意してください。数字や時間に大きく依存したスキルの場合は、このデバイス向けの開発を行うことも検討してみてください。テキストの表示は可能ですが、デバイスでサポートされているセグメントによって、文字セットは制限されます。APLと同じく、これも便利な機能です。まずは、Alexa Cookbookのサンプルをご覧になることをお勧めします。

An image of an Echo Dot with Clock device.

注: APL for Audio(ベータ版)も同じAPLの枠組みに従っていますが、こちらはリッチでダイナミックなオーディオの作成に適しています。詳しくは、リリース内容をまとめたブログ記事をご覧ください。

Alexa Web API for Gamesを使って没入型ゲームを開発する

開発者プレビューが先日公開されたばかりのAlexa Web API for Gamesを使用すると、既存のウェブテクノロジーを使ってマルチモーダルなAlexaゲームを制作できます。これは、デバイスにロードされるローカルJavaScript API、Alexaスキルのバックエンドからウェブアプリケーションを起動する機能、ローカルで実行されるウェブアプリケーションとバックエンドのAlexaスキルハンドラーコード間の通信ブリッジで構成されています。これにより、APLだけでは不可能な新しい形のゲームエクスペリエンスを実現できます。グラフィックスのオプションとしては、WebGLを3D画像やアニメーションとともに使用したり、カスタムシェーダーを適用したり、HTML要素(CSSを含む)を使用して好みのレイアウトを作成したりすることができます。ゲームプレイに関しては、ローカルのタッチハンドラーやウェブソケットにアクセスし、会話以外のエクスペリエンスを構築できます。Three.jsやVue.jsなど、お気に入りのウェブフレームワークを利用してエクスペリエンスを構築することもできます。

Alexa Web APIのゲームの視覚コンテンツはウェブエンドポイントから提供されるため、Alexaエンドポイントでは音声と視覚要素を別々に取得する必要があります。APLを使用して視覚要素をレンダリングする場合は約0.5秒かかるの対し、コンテンツ配信ネットワークからコンテンツを配信する場合は、視覚要素が表示されるまでに平均で約2秒かかります。このようなトレードオフはありますが、ユーザーが長時間継続してプレイする没入型ゲームでは、それに見合うだけの価値があります。ゲームならユーザーはロード時間を比較的我慢してくれますが、トリビアスキルや天気スキルなど、視覚要素によって会話を補完するその他の種類のスキルでは我慢はしてくれません。速度のほかに、Alexa Web API for Gamesは以下のデバイスにしか対応していない点にも注意してください。

  • Fire TV Stick(第3世代)
  • Fire TV Stick 4K
  • Fire TV Cube(全世代)
  • Echo Showシリーズのデバイス

上記以外のデバイスのユーザーでは、Alexa Web API for Gamesで開発された視覚エクスペリエンスを体験できません。とはいえ、Alexa Web API for Gamesは、斬新なエクスペリエンスを生み出すための機能の豊富さという面ではAPLよりもはるかに優れています。そのため、次にAlexaゲームスキルを開発する際には、Alexa Web API for Gamesを使用したいと思われるかもしれません。しかし、開発するものがゲームであっても、レイテンシーやリーチの問題があるため、APLだけで作りたいものを作れるのであればこちらを使用することをお勧めします。また、Alexaを搭載したあらゆる視覚デバイスで利用可能なAPLの視覚要素を作成すれば、両方の長所を活かすことができます。

まとめ

テクノロジー

サポートするデバイス

機能 用途
APL

すべての画面付きAlexa搭載デバイス

テキスト、画像、ビデオ、ベクターグラフィックス、アニメーション、音声と視覚要素の統合

すべてのスキル向けの補完的な視覚要素

キャラクターディスプレイ向けAPL(APLT)

 

Echo Dot with Clock

数字と一部の文字

数字や時間ベースのスキル向けの補助的なエクスペリエンス

Alexa Web API for Games

Echo Showシリーズ、一部のFire TVデバイス

HTML, CSS, JS, WebGL

没入型ゲームスキル

Displayテンプレート

Echo Showシリーズ、Echo Spot、Fire TVデバイス

既成だが柔軟性に欠け、リーチ可能なデバイスが限られる

APLへの移行を推奨


ほとんどのAlexaスキルのエクスペリエンスでは、APLは補完的な視覚要素に使用するのが最適です。数字を主に表示する場合は、キャラクターディスプレイ用にAPLのサポートを追加することもお勧めします。また、補完的な視覚要素だけでなくウェブテクノロジーを使って没入型ゲームを制作する場合は、Alexa Web API for Gamesを使用し、APLはさらに多くのユーザーにリーチするための代替手段として検討するとよいでしょう。皆さんが開発しているスキルを、ぜひTwitter(@JoeMoCode)で教えてください。

関連コンテンツ

Subscribe