Adobe XDをもっと使いこなすヒント！ 第16回 音声UIを体験する
Adobe XDをもっと使いこなすヒント！
この連載では、Adobe XDを便利に使うための様々なテクニックを、Adobe XDチームのツイートからピックアップしてご紹介します。今回は、音声トリガーの使い方に関連する2つのツイートと関連動画を取り上げます。
Tip 1. 音声をトリガーに遷移を開始する
#adobexd #protip New in this release of XD – voice prototyping! Change your trigger to “voice,” type in a key phrase, and then hold the space bar in the preview window as you speak. @adobexd pic.twitter.com/URWy7Vxt3s
— Elaine Chao (@elainecchao) October 16, 2018
Adobe XDに音声UIのプロトタイプを作成する機能が搭載されました。
音声で遷移を開始するために必要な設定は、遷移のトリガーに「Voice」を指定し、コマンドに “開けゴマ” のようなキーフレーズを設定するだけです（注：2019年1月のアップデートで日本語にも対応しました）。
あとはプレビュー画面を起動して、指定したテキストをはっきりと口にすれば、遷移先のアートボードに画面が遷移します。可能であれば、上のビデオはサウンド付きで見てください。
音声トリガーを使用する際は、スペースキーを押した状態で話しかけます。
Tip 2. 音声入力に応答するメッセージを再生する
#adobexd #protip Set a timed transition on your destination artboard and text for the computer to read back to you when it moves there. @adobexd pic.twitter.com/DKzPh45BJG
— Elaine Chao (@elainecchao) October 17, 2018
音声UIであれば、音声で指示した後の応答も、音声を使って語られるのが普通です。これを再現するため、アクションに「Speech Playback」が追加されました。このアクションは「音声」欄に記述されたテキストを読み上げます。
「Speech Playback」アクションを起動するために、遷移先のアートボードのトリガーに「時間」を設定し、ディレイを「0秒」にすれば、遷移の0秒後、すなわち遷移直後に、応答テキストが自動的に再生されます。上のビデオでその様子を確認できます。
おまけ. これから使えるようになる機能
現時点では、音声UIプロトタイプに関連する機能はこれだけです。とても簡単に使えるのでぜひ試してみてください。今後の追加機能に関しては、「Adobe XDの音声プロトタイピングのご紹介」によると、以下の2つが具体的に言及されています。
- 追加の言語サポート（2019年1月のアップデートで日本語もサポートされました）
- 新しい音声ペルソナ（2019年1月のアップデートで日本語の応答音声が男性と女声から選べるようになりました）
さらに、MAX 2018の基調講演では、アマゾンとの協業によりAlexaとの連携を実現する予定であることが発表されました。
下のビデオでは、XDで作成したプロトタイプがEcho Showの画面上（！）で動作して、Alexaとやりとりできる（！！）様子を見ることができます。エンジニアに頼らずここまでできるのだとすれば、音声UIのデザインは、デザイナーにとってずっと身近なものになりそうです。
Alexaとの連携は、来年のどこかのタイミングで利用可能になる予定だそうです。それまでにVoice UI Kitを使って腕を磨いておきましょう！
いかがでしたか？
これは便利そうだ！という使い方はあったでしょうか？
次回をお楽しみに！