この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。
どうも皆さん、CX事業本部Aチームのたいがーです?
"LINEでチャットボットを作ろう!"となったとき、皆さんはどのように会話イメージを膨らませるでしょうか。テキストに起こしてみたり、サクッとイラストを書いたり…様々な方法がありますよね。
今回は、それらの方法の中の一つとなり得るLINE Bot Designerをご紹介したいと思います。配布されているクーポン用テンプレートを使用して、LINE Bot Designerの使い方を見ていきましょう。
このブログの最後に提供されている全てのテンプレートを日本語に翻訳したテスト動画をアップしたので、利用する時は参考にしてみてください！
LINE Bot Designerとは
LINE Bot Designerを使えば、プログラミングの知識がなくても簡単かつ短時間でLINE Botのプロトタイプを作成できます。ご希望のシナリオに沿って、自由にチャットボットを設計できます。
LINE Bot Designerには、事前にテンプレートして3つのシナリオが作成されています。
- クーポン
- イベント
- 予約
これら３つのテンプレートを設計者の好みに合わせて修正して、プロトタイプとしてテストすることができます。また、テンプレートを使用せずにご自身で全て1から作っていくことも可能です。
推奨動作環境 / 事前準備
推奨動作環境
Windows 10 および macOS(Sierra以降)となっています。
事前準備
LINE Bot Designerは、公式ホームページからダウンロードすることが可能です。
ダウンロード終了後、このような画面が表示されるのでLINEアカウントでログインを行います。
ログイン後、LINE Bot DesignerでのLINEアカウントの使用を許可します。
プロジェクトの作成を選択すると1から自分でプロトタイプの作成ができ、下のテンプレートを選択することでBotテンプレートを利用できます。
先ほども記載した通り、テンプレートには3種類あります。今回はその中のクーポンのテンプレートを覗いていきましょう。
LINE Bot Designerの使い方
ここからはクーポン用のテンプレートを使って、実際の使い方を見ていきたいと思います。先ほどの画面で"クーポン"を選択するとこのような画面に遷移されます。
左のバーから順番に見ていきましょう。それぞれの画面でできることは、以下のことです。
- メッセージの作成
- Flex Messageの作成
- 作成したプロトタイプのテスト
Bot テンプレートを使用した場合は、すでにメッセージが入力されている状態になっています。また、テンプレートでは英語が使用されています。
それぞれの画面について詳しく見ていきましょう
メッセージの作成
メッセージの種類としては以下の13個あります。
- 文字メッセージ
- 画像メッセージ
- 動画メッセージ
- 音声メッセージ
- ファイルメッセージ
- イメージマップメッセージ
- スタンプメッセージ
- 位置情報メッセージ
- ボタン型テンプレートメッセージ
- カルーセル型テンプレートメッセージ
- 確認型テンプレートメッセージ
- 画像カルーセルテンプレートメッセージ
- ProtoPieメッセージ
それぞれのメッセージは、+ボタンから追加し、編集することができます。作成時タイトルを編集することができるので、テストの時のために送信する想定の順番で番号を書いておくことをお勧めします！
それぞれのメッセージの詳細は、こちらをご覧ください！
メッセージを作成すると、そのメッセージの形式のJSONが自動的に作成されます。
Flex Messageの作成
Flex Messageは下のテンプレートから選択し、展開することができます。
作成したプロトタイプのテスト
上二つの画面で作成したメッセージをテストすることができます。
テストは、上の三角を押してテストを始められます。
">"を押していくことで実際の流れを見ることができます。
また、端末の種類も変更することもできます。
メッセージ変更後のテストのやり方
メッセージの作成画面でテキストを日本語に変更して、テストしてみました。変更前はこのような形です。
これのラベルやテキストを日本語に変更してみます。
事前に設定したテキスト通りにいくのであれば、"あけましておめでとう！"と書かれたカードの"新しいプロモーション"をクリックすると"あけましておめでとう"と入力されるはずです。
(書き方で察する方もたくさんいらっしゃるとは思うのですが)実際にテストしてみた動画がこちらです。
"New Year Promotion"と入力されました。"あけましておめでとう！"や"新しいプロモーション"などのタイトル部分はそのままテストしてみても修正されるのですが、テキストについては新しくトークを作成し、テストする必要があります。ここから新しいトークを作成していきましょう。
上記で作ったメッセージを一つ一つ選択肢、実際の流れをやっていきます。
メッセージ作成時、どの順番で送信したいのか番号を記載しておくとトークを作成するときにわかりやすいのでおすすめです！
新しいトークを作成後、右のBotメッセージから実際に送信したメッセージを選択していきます。
電話番号など、実際にユーザーに入力してもらうと想定している場合は、キーボードから入力してください。(LINE Bot Designerの画面上のキーボードからは入力されないので、ご注意ください！)
全ての流れを試したら、その後もう一度緑の三角をクリックして確認していきましょう。
公開されているテンプレートを日本語訳してみた
今回は公開されている3つのテンプレートを、全文英語から日本語に書き換えてテストしてみました。
クーポン
クーポンのシナリオでは、プロモーションで行ったイベントで割引クーポンのメッセージを送信します。シナリオの流れとしては、このようになっています。
- 挨拶文
- プロモーションの選択
- 割引の説明
- 画像の送信
- 選択へのお礼メッセージ
イベント
イベントのシナリオでは、カード会社のイベントでカードの契約をするためのメッセージを送信します。シナリオの流れとしては、このようになっています。
- 挨拶文
- イベントへの参加の確認
- カード選定への質問 4問
- カード選択
- 携帯電話番号の確認
- お礼メッセージ
予約
イベントのシナリオでは、レストランのアカウントで日時とメニューの予約をするためのメッセージを送信します。シナリオの流れとしては、このようになっています。
- 予約日の入力
- 名前の入力
- 予約時間の選択
- メニューの選択
- 注文の確認
- コメントの確認
- 最終確認
テンプレートから始めてみては？
このように、LINE Bot Designerでは実際のLINEの画面上の会話のイメージを容易に掴むことができます。もし、Bot Designerを初めて触ってみるという方はテンプレートから触ってみてもいいのではないでしょうか。
ぜひ、素敵なユーザー体験を作成してみてください！
以上、たいがーでした?
10
