Voiceflow新機能発表イベント 『#VFV2』まとめ③ Prototyping and User Testing

Voiceflowの新機能発表イベント「VFV2」のまとめ、その３です。 今回はPrototyping and User Testingについて。新機能（現時点でリリースされているものもあれば今後リリースされるものも含みます）についてはNew!をつけています。

Prototyping and User Testing

• プロトタイピングは、デザインの延長線上で、デザイナーやチームが会話に命を吹き込むフェーズ

• 開発に移る前にオリジナルのアイデアをテスト、学習、反復することができるフェーズ

• Voiceflowは、Alexa、Google アシスタント、IVR、チャット、カスタム アシスタンスなど、可能な限り実際に近い設計を支援する。

• キャンバスの各ステップは、実際のコードを表している。
• これにより、デザイナー自身、チームメイト、ユーザーの誰でもが、実際の製品であるかのようなプロトタイプを体験することが可能。

• プロトタイピングは、デザインと開発の間の単なる１フェーズではなく、すべてのデザイナーの基本的なツールキット。

• プロトタイプのメリット
  • 行動におけるアイデアを実際に聞いて、
  • 必要なエッジケースと修復パスをすべて発見し、
  • 可能性のあるすべてのパスを試して、
  • ワンクリックで素早く変更、数秒で繰り返し試すことができるので、ワークフローを迅速化する。

• プロトタイプのメリット
  • リリース前にユーザーテストを行って、そのフィードバックをデザインに反映できる
  • ユーザと一緒のライブプロトタイピングなら、より貴重なフィードバックや問題点を発見可能
  • Voiceflowなら、フェイス・ツー・フェイスでも、リモートでも、可能
  • よりステークホルダーの要望に近い体験が得られ、アイデア、コンセプト、デザインをチームに伝えることができる。

• プロトタイプは開発者への受け渡しが容易になる。

• 開発者が必要とする情報がプロトタイプには含まれており、すでにテスト済みの状態で開発者に渡せる
  • 会話デザインの対話モデル
  • ユーザーの状態
  • コンテキスト
  • ロジック

• プロトタイピングは優れた会話デザインのための触媒
• 音声と会話デザインの可能性に挑戦していくために、エンドユーザー体験を具現化するためのツールと、それを構築するためのプラットフォームが必要

• 変更を加えるたびに、デザインと開発ワークフローの間のギャップを埋めることで、チームが一元化されたソースを構築できる
• これらを可能にする哲学と機能を紹介する

• デザインがコーディングになる
  • 技術的な背景を問わないノーコード環境により、誰でも簡単に実際に動作するコードをデザインから構築可能
  • つまり、実際に動く形でアプリのデザインを伝える事ができるため、開発へかんたんに受け渡すことが可能

• コードをデザインに反映する
  • より高度なユーザーや開発者には柔軟性やカスタマイズが必要になることがあり、そのためにVoiceflowはカスタマイズ可能な機能やブロックを備えている
    • API にアクセスする必要がある場所にコードを追加
    • それぞれのワークフローに適したファイルフォーマット（JSON形式の.vfファイル）にエクスポート

• デザイン環境と開発環境のパイプライン
  • デザインをコードに変換するということ＝2つの環境間のパイプラインをサポートする必要がある
  • 各プロジェクトごとに、ホスト先（開発及び実行環境）とデザイン環境（Voiceflow）間のパイプラインが簡単に作成可能
  • ホスト先が、Alexa開発者コンソールであれ、独自環境であれ、コードが動作することを保証する

• インタラクティブな対話モデル

• プロトタイプ自身がインタラクティブ、それをそのまま渡せば良い
• 限定的な静的アセットや要件を開発チームに共有する必要はない
• より開発者にデザインを理解してもらえる

• インタラクションモデル、ダイアログマネージャ、レスポンスコンテンツを共有することで、デザイナーと開発者間の受け渡しを高速化、簡素化

• デザインとテストのシームレスな切り替え
  • 会話デザインの品質は、実際の体験がないと評価しにくい
  • Voiceflow のテストは、デザインチームが作成した体験について、可能な限り多くのコンテキストを提供する

• ユーザーが利用可能な入力と出力をあらゆるモーダルでテストできるようにしたい
  • 会話体験はますますマルチモーダル化している
• うまく行かない場合に、診断を行い、間違っている点を理解し、どのように修正すればよいかを見つけるためのツールが必要
• それがVoiceflowのテストツール

• テストツール
  • デザインからテストへはすぐに切り替えれる
    • 右上のテストボタンをクリック or キーボードショートカット（t）で、最初からテスト
    • ブロックの再生ボタンで、そこからテスト

• テスト開始後は、対話の途中で、発話を繰り返し聞いたり、巻き戻しして別の発話を試したりが可能

• サジェスチョンチップをクリック、テキスト入力、音声入力、など色んな方法でユーザの入力をシミュレート可能

• 新たにビジュアルをサポート
  • 音声とテキストだけでなく、マルチモーダルなユーザ体験のテストが可能に！New!
  • カスタムアシスタント向けモックアップ、Alexa向けAPLのどちらも可能

• テスト時に変数を設定して、いろんなユーザ状態を想定したテストが可能

• デバッグモードを有効にすると、バックエンドのロジックや処理状況が表示される。エラー発生時のデバッグに有効。

• スマートプロトタイピング
  • テストツールにNLP/NLUが追加された
  • 対話モデルで設計したすべてのデータ（インテント、発話、スロット、スロット値など）を学習することによりインテリジェントで柔軟な対話テストが可能に。
  • 対話モデルを更新したら、再トレーニングが通知される。ワンクリックで再トレーニングが可能。

• ワンクリックアップロード
  • Alexa開発者コンソール、Googleアクションコンソールへのアップロードもワンクリックで。
  • プラットフォーム独自のNLP/NLUや開発ツールを使うことで、より忠実度が高いテストが可能

• プロトタイプの共有
  • 音声 or テキスト入力、マルチモーダル有無の組み合わせを切り替えて、共有が可能に！New!
  • Alexa向け、IVR、アプリ内チャット、ウェブサイトチャットなど、いろんなチャネルにあわせたプロトタイプ体験を提供可能

• 例えばAlexa向けなら、音声入力＋テキスト表示

• 例えば、アプリ内チャットなら、音声入力＋ビジュアル表示
  • 会話の各ターンにおける画面遷移を実現するために、Visual Stepが追加されたNew!
  • モバイルデバイスで開くと全画面で表示され、実際に近いアプリ体験を提供できる

• 例えば、Webサイト内チャットなら、テキスト入力＋テキスト表示
  • ユーザーの入力や、サジェスチョンチップを使った、チャットボット体験

• 例えば、IVRなら、音声入力＋ビジュアル表示
  • 電話体験に近づけるために、ダイアルパッドの画像やサウンドを使用、ここでもVisual Stepが役に立つ
  • 電話を通じた1対1に近い体験

• これらにより、
  • 現実の体験に非常に近いかたちでモックを簡単に作成することが可能
  • ユーザがビジョンを理解しやすくなる
  • ユーザの実際の反応やデータを収集しやすくなる

まとめ

Prototyping and User Testingのまとめでした。実はVoiceflowで昨年もっとも活発に機能が追加されたり改修されたのはこのプロトタイピングではないかなという印象があります。

元々、Voiceflowのテストツールは、AlexaやGoogle向け音声アプリを作るという目的からすると、それぞれのプラットフォームが提供するテストツールとは動きが微妙に違うということもあり、あくまでも簡易なロジック検証を行う程度のもの、という印象でした。

それがAlexaやGoogle以外のカスタムアシスタントへの対応を発表したことにより、大きく位置づけが変わってきています。また、ここまでの説明にもある通り、Voiceflowはプロトタイプで提供できる「ユーザ体験」というものをとても重要視しています。マルチモーダルへの対応も含めて、これまでの単なるAlexa・Google向けノンコーディングアプリ開発ツールではなく、あらゆる音声アプリに対応した柔軟かつスピーディーなプロトタイピングツールとして生まれ変わってきているのではないかという気がしますね。

もちろん開発ツールとしても進化しています。それについては次回ご紹介します。