ノンコーディングでもここまでできるVoiceflow / non coding Alexa skill development with Voiceflow

by Kuniaki Shimizu

Slide 1

Slide 1 text

ノンコーディングでもここまでできる

Slide 2

Slide 2 text

アジェンダ ● 自己紹介 ● について ● 作ってみた ● これから始めるなら知っておいたほうが良いこと ● まとめ

Slide 3

Slide 3 text

自己紹介

Slide 4

Slide 4 text

@kun432 通信事業者系ISPのインフラエンジニア最近はWiFIのシステム開発・構築・運用 - Twitter/Facebook/Github/はてなブログ/Alexa - ポートフォリオ： https://kun432.github.io/ ❤

Slide 5

Slide 5 text

Alexa (JP): 9 Google: 1 Clova: 1 個までの道のりは長い、、、 Alexa (US): 1

Slide 6

Slide 6 text

について

Slide 7

Slide 7 text

[Alexa]ノンコーディングでAlexaスキルを作れるサービス Voiceflowが今後にすごく期待できる内容だった #Alexa #Voiceflow ｜ DevelopersIO https://dev.classmethod.jp/etc/mrmo-voiceflow-20190212/

Slide 8

Slide 8 text

https://speakerdeck.com/mochan_tk/jawsdays-2019-alexa-mrmo

Slide 9

Slide 9 text

他のノンコーディングツールとの比較【最新版】ノンプログラミングでスキルが作れるサービスを比較！　　

Slide 10

Slide 10 text

他のノンコーディングツールとの比較動画機能 ※ 年月時点 ←ここだけ追加

Slide 11

Slide 11 text

● ノンコーディングで一気通貫なスキル開発 ○ ブロック並べて、発話/応答書いて、線でつなげるだけ ○ スキルの作成・テスト・申請まで全部Voiceflowで完結 ● ロジックが書ける ○ インテント、サンプル発話、スロット ○ 変数・分岐、永続アトリビュートも可 ○ API連携やJavaScriptのコードを直接書くこともできる ● 豊富な機能・活発な開発 ○ カード、ディスプレイ対応（APL）、Google Home ○ ISP、マルチプラットフォーム、アカウントリンク、メール送信、等（有料プラン） ● 活発なコミュニティとサポート ○ Facebookグループ/チュートリアル/フォーラム/Intercom の特徴

Slide 12

Slide 12 text

とはいいつつも・・・

Slide 13

Slide 13 text

所詮ノンコーディングなんでしょ？

Slide 14

Slide 14 text

作ってみた

Slide 15

Slide 15 text

作ってみたゴリゴリに

Slide 16

Slide 16 text

お題：会社の受付スキル

Slide 17

Slide 17 text

デモおよび以降の資料の中になんとなく聞いたことのある人の名前がチラホラ出てきますが、登場する組織名・人物名はすべて架空のものです。

Slide 18

Slide 18 text

※ で発表した際のものから少し変更しています。

Slide 19

Slide 19 text

ノンコーディング！

Slide 20

Slide 20 text

構成 Alexa Skills Kit GHKit Voiceflow Google Home カード (Alexa アプリ) APL 連携連携

Slide 21

Slide 21 text

構成 Alexa Skills Kit GHKit Voiceflow Google Home カード (Alexa アプリ) APL 連携連携ノンコーディングノンコーディング

Slide 22

Slide 22 text

完全ノンコーディング！

Slide 23

Slide 23 text

No content

Slide 24

Slide 24 text

今回のスキルで使ったもの ● インテントとスロット（） ○ 来社されたお客様の名前を取得するインテント ○ 担当者の部署と名前を取得するインテント ○ 取得したスロットの値を、に渡したり、発話に使ったり。 ● 連携 ○ 上の社員名簿を経由で検索 ○ を使ってプッシュ通知でにしゃべらせる ● ロジックとコード（） ○ レスポンスの結果を変数に入れて分岐 ○ のレスポンスを一部コード書いてゴニョゴニョ ● とカード ○ ドキュメントで基本テンプレを作って、フローに応じてデータソース内の一部（画像）を動的に変更（） ○ カードにもお客様の来社を表示 ● その他 ○ 最後に音楽を流す。ではなくで。

Slide 25

Slide 25 text

インテント

Slide 26

Slide 26 text

● インテントを作る ○ スロットを作成 ■ シノニム設定可能 ○ サンプル発話を作成 ■ スロット値をサンプル発話に含める ○ スロットと変数をマッピング ■ 予め変数を作成しておく ● 複数インテントを用意してフローを分岐させたり ● フローごとに任意のインテントだけを起動させたり

Slide 27

Slide 27 text

No content

Slide 28

Slide 28 text

No content

Slide 29

Slide 29 text

No content

Slide 30

Slide 30 text

連携

Slide 31

Slide 31 text

● 外部を実行して結果を取ることができる。 ○ ○ リクエストヘッダ、リクエストパラメータ、リクエストボディを指定できる ○ 変数を渡すことができる ● ブロックの中で動的にテストができる ● 今回は２つ ○ にある社員名簿に、部署・名前で検索 ○ に喋らせたいメッセージをプッシュ

Slide 32

Slide 32 text

No content

Slide 33

Slide 33 text

No content

Slide 34

Slide 34 text

No content

Slide 35

Slide 35 text

No content

Slide 36

Slide 36 text

条件分岐とかコードとか

Slide 37

Slide 37 text

● その名の通り、でコードを直接書ける ● 変数にアクセスできる ● 実行環境はよくわからないが、プリミティブな印象 ● 条件により、フローを分岐できる。変数と値を比較して分岐するのが一般的な使い方 ● 少し使い勝手に癖があるので注意 ○ 複数の文を並列で並べるのがベター ○ ネストした複雑な指定は心が折れる

Slide 38

Slide 38 text

No content

Slide 39

Slide 39 text

No content

Slide 40

Slide 40 text

No content

Slide 41

Slide 41 text

ここからは時間があれば

Slide 42

Slide 42 text

ビジュアル対応

Slide 43

Slide 43 text

● 用 ○ 予めテンプレートを作成 ○ フローからは呼び出すだけ ● 動的な変更 ○ データソースを予め変数で指定しておく ○ で変数をセット

Slide 44

Slide 44 text

No content

Slide 45

Slide 45 text

No content

Slide 46

Slide 46 text

No content

Slide 47

Slide 47 text

No content

Slide 48

Slide 48 text

No content

Slide 49

Slide 49 text

No content

Slide 50

Slide 50 text

その他

Slide 51

Slide 51 text

地味にすごいところ ● ビルトインの変数で初セッションなのかを取得可能（永続セッション） ○ 逆に言うと変数はすべて永続。初期化考慮。 ● インテントはステート管理されている ○ いつでも起動できるインテント ○ 特定のフローの中でのみ起動するインテント ● ヘルプを呼び出したあと、呼び出した時点に戻ってくる ○ で任意のフローを分割できる ○ 内ではローカル変数も可能 ● 公開済みのスキルでも、で変更可能 ○ ただし、作りによる。対話モデルの変更は不可と思われる。 ○ 通常は「開発中」への変更になる。

Slide 52

Slide 52 text

有償プラン（） ● ○ アカウントリンキング、ユーザープロファイルで許可を取る、これが基本 ● ○ 取得したユーザー情報の変数とのマッピング ● ○ 取得したメールアドレスへメール送信 ● ○ リマインドするタイマー、日時を設定 ● ○ スキル内課金 ○ 事前に商品を登録しておいて申請？が必要 ● バックアップ・リストア可能（５世代？）

Slide 53

Slide 53 text

サポートドキュメントコミュニティ ● サポート ○ によるチャットサポート ● グループ ○ かなり活発、質問すると中の人も外の人も答えてくれる ● ドキュメント ○ 各ブロックの設定画面からヘルプで動画が流れる ○ ■ https://university.getvoiceflow.com/ ■ 各ブロックの説明やチュートリアルが豊富 ○ Youtubeチャンネル ■ 動画で説明 ● フォーラム ○ https://forum.getvoiceflow.com ○ ここにもユーザによるチュートリアル多数あり

Slide 54

Slide 54 text

これから始めるなら知っておくと良いこと

Slide 55

Slide 55 text

事前に知っておくとよいこと① ● 発話を受けて処理するスキルを作るならの仕組みは理解しておくほうがよい ○ インテント、スロット、サンプル発話、スロットタイプ、シノニム ○ もっとシンプルに発話を受けれるがあるが、不具合があったり使いにくい点がある。 ○ 現時点で発話を受け取るには一択 ○ 申請したいなら特に。 ● 開発者コンソールは使い慣れておくほうがよい ○ 上のテストと上のテストは違う ○ 上のテストは的に使う

Slide 56

Slide 56 text

事前に知っておくとよいこと② ● 日本語の場合のみの問題 ○ まとめて連文節変換すると入力がおかしくなる ○ ブロック名とかに日本語含めるとアップロードに失敗する場合があった（修正済） ○ 現状、申請はからのみ ○ 現状、日本語を含めた場合の多言語は不可 ○ 対応しているスロットタイプが少ない（パブリックベータのものは使えない） ● 変化が激しい ○ 前はできたことができなくなる場合がある ○ 今のフェーズだと致し方ないかも ○ 側の変化も早いし

Slide 57

Slide 57 text

まとめ

Slide 58

Slide 58 text

まとめ ● ノンコーディングにありがちな「ここまでしかできない」は感じないどころか、かなりのことができる上、無料で十分使える ● GUIで会話の流れを意識しやすい、プロトタイプにも良い ● 変化は激しいが、反面、サポート・ドキュメントが充実、コミュニティも活発。どんどん聞いてどんどん提案すれば取り込んでもらえるかも　※ただし英語 ● 発話を取らないなら、ホント簡単にできる（サウンド系とかランダムな結果だけを返すもの） ● 発話を取るなら、Alexaの仕組み（インテントとか、開発者コンソールとか）を理解しているといろいろ立ち回れる