シェアしたくなる最新のWebサービス・ITニュース情報をチェック!
  • follow us in feedly

アプギガトップ > Webサービス > ブロックを繋げるだけでチャットボットが作成できる「Motion AI」は、WebもSNSも無料で運用可能!
注目記事ピックアップ
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
share0
今すぐブラウザ上に「ライブ配信」のスタジオ環境をタダで構築できる「Lightstream」を使ってみた!
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
share0
「docs・Wiki・task」が融合した超軽量Webエディタ「Notion」の潜在能力が高過ぎる件!
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
share0
登録不要!匿名で記事も公開できる究極にシンプルなWebエディタ「IO」が最高の使い心地だった!
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
share0
Web上でプログラミングに特化したスクリーンキャストを無料で作れる「Scrimba」の革命的な機能がスゴイと話題に!
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
share0
匿名もOK!SkypeでWebコードエディタを共有できる「Interviews on Skype」が無償公開中!
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
share0
編集ソフト不要!アップロードした画像のURLをいじるだけで多彩な加工編集を実現する「Scaley.io」が登録不要で無料公開中!
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
share0
英語で「VR空間作って」と書くだけで、本当にWeb上でVR体験が実現する「GuriVR」を使ってみた!
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
share0
ブラウザ上でサイト構成図(マップ)を作成して複数人とコラボ連携可能な「FlowMapp」を使ってみた!
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
share0
ブログ感覚でWebアプリやサイトの更新履歴を作成&公開できる「Barelog」を使ってみた!
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
share0
ブラウザから即起動!ゼロからSVG画像を作成できるWebエディタ「Vectr」が完全無料で公開中!
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
share0
筆跡がリアルに変化する「自作Webフォント」を生成可能な「Calligraphr」で自分用フォントを手書きしてみた!
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
share0
ブログ感覚でオンラインのプログラミング講座を作成・公開できる「educative」は課金機能も無料で利用可能!
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
share0
データ可視化の最強ツール!Web上でスライド資料やインフォグラフィックを制作できる万能Webエディタ「Visme」を使ってみた!
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
share0
思わずWeb開発したくなる最強のJavaScriptライブラリ7選が楽し過ぎてヤバイ!
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
share0
JavaScriptでマインクラフト風の建造物が作れる無料Webアプリ「Web Blocks」で遊んでみた!
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
share0
1枚の写真だけで超リアルな3D顔面をWeb上で高速生成できる「3D Face Reconstruction」を使ってみた!
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
share0
有名WebサービスのAPIをすべて同じ書き方でプログラミング可能な「RapidAPI」は、検索・テストもブラウザ上で実行可能!
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
share0
こんなAR技術が欲しかった!スマホをかざすだけでプロ並みのスケッチを描ける「SketchAR」アプリを使ってみた!
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
share0
「アプギガ!!」2016年の総まとめ!もう一度読みたくなる人気のバズ記事をまとめてみた!
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
share0
スマホのタッチ操作に最適化されたWebアンケートが作れるサービス「Wyzerr」を使ってみた!
Webサービス
ad 今の年収で満足ですか?
typeで転職した71%が年収アップ!
2016/06/14 19:20

ブロックを繋げるだけでチャットボットが作成できる「Motion AI」は、WebもSNSも無料で運用可能!

motion-ai-01 どうも、まさとらん(@0310lan)です!

人気の「チャットボット」を手っ取り早く自分で作りたい人に朗報です!

プログラミング不要で、サーバー周りの開発環境もすべて用意されており、すべての操作をブラウザ上で完結できる無料のWebサービスをご紹介しようと思います!

【 Motion AI 】
motion-ai-02 「Motion AI」を活用すれば、「Slack」「Messenger」などのSNSはもちろんのこと、Webサイトやブログなどにも設置可能な「チャットボット」を今すぐ作成して公開することが出来ますよ!


「アンケートフォーム」をボット化してみよう!
それでは、実際に「チャットボット」を作りながら、どんなサービスなのかを見ていきましょう!

今回は、簡単なサンプルとして「アンケートフォーム」を、チャット風に自動返答してくれるボットを作ってみたいと思います。


そこで、まずはサイトにアクセスし、無償のユーザー登録を済ませておきましょう。
motion-ai-03

登録を済ませると、どのプラットフォームで「ボット」を作るかを選択できるので、「Web-Based」をクリックします。
motion-ai-04

これから作る「ボット」に、適当な名前を付けてあげましょう。
motion-ai-05 (「Start with Template」のチェックは外しておきます…)


すると、ボット開発用の「オンラインエディタ」が表示されます!
motion-ai-06 あとは、この画面上でさまざまな機能を持った「ブロック」を繋げていき、オリジナルの「チャットボット」を作っていくことになるわけです。

そこで、アンケートに必要な「ブロック」をどんどん追加していきましょう!


画面上部の「Add Module」ボタンをクリックします。
motion-ai-07

すると、さまざまな機能を持ったブロックが選択できるので、まずはユーザーにメルアドを問いかける「Email Collection」を選択します。
motion-ai-08

そして、分かりやすい名称を入力します。(今回は「email」としました…)
motion-ai-09

すると、メルアド用のブロックが配置されるので、ボタンをクリックして詳細設定を行いましょう。
motion-ai-10

最初に「チャットボット」が問いかけるメッセージを入力します。
motion-ai-11

このブロックでは、「***@***.***」のようなメルアド形式以外が入力されると、エラーとして弾いてくれるようになっています。
その際に、ユーザーへ表示するメッセージも設定しておきましょう。
motion-ai-12 上記のように、{}で囲むことで違うパターンのメッセージを登録してランダムに表示させることも可能です。
ちなみに、このブロックを最初の「問いかけ」にしたいので、下段にあるチェックボックスに「チェック」を入れてから保存しておきましょう。


他にも、「マルチ選択」ブロックというのがあります。
motion-ai-13 これは、ユーザーからの回答によって処理を条件分岐することが出来るようになります。


例えば、ユーザーに「性別」を問いかけるとしたら、あらかじめ「男性」「女性」などのキーワードを設定しておきます。
motion-ai-14 このキーワードをベースにして、違うパターンの会話を分岐させることが出来るわけです。


さらに、ユーザーからの回答が想定できない場合は、「Cards」機能を使って選択ボタンを作ることもできます。
motion-ai-15 これにより、ユーザーはチャット上に表示されたボタンを選択するだけで、さまざまなパターンの会話を続けることが出来ます。


条件分岐の設定もシンプルになっており、ユーザーの「➀回答」を設定し、処理させたい「➁ブロック」を選択するだけで完了です!
motion-ai-16 これだけで、自動的にブロック同士が線で繋がれて連携できるようになるのです。
※「Cards」機能も同様に設定できます。


このように、さまざまな機能を持ったブロックを繋げていくことで、簡単な「アンケートボット」なら数十分もあれば完成するでしょう。
motion-ai-17

また、画面上部の「Test Bot」ボタンをクリックすることで、すぐに「チャットボット」の動作確認を行うことも可能なので便利です!
motion-ai-18

公開してみよう!
ある程度、「チャットボット」が完成したら自分のブログやサイトへ組み込んでみましょう!

方法は簡単で、画面上部にある「Get Embed Code」リンクをクリックします。
motion-ai-19

「埋め込みコード」が生成されているので、これをHTMLにコピペするだけで完了です!
motion-ai-20

サイトを確認してみると、「ボット」アイコンが表示されており、これをクリックすることでチャットボットが起動する仕掛けになっています。
motion-ai-21

「ユーザー」と「ボット」の会話は保存されているので、自分の管理画面から後で読み返すことが出来ます。
motion-ai-22

また、「アナリティクス画面」も用意されているので、進捗確認や集計なども簡単に行えます。
motion-ai-23
今回は、Webサイト上で利用できる「チャットボット」の作り方を解説しましたが、同じ方法で「SMS」「Eメール」「Facebook Messenger」「Slack」などのボットが作れることも大きな魅力です。

また、条件分岐させる時に、「IFTTT」「Zapier」などと連携することも可能なので、あらゆるWebサービスと繋がるボットを簡単に作れるポテンシャルも秘めています。


おまけ
最後に、「チャットボット」の利用が盛んなコミュニケーションサービス「Slack」で人気のボットを合わせてご紹介しておきます!

【最近、Slackの「bot」が何でも出来過ぎて「カオス」状態になってる件!】
motion-ai-24 旅行などで便利なホテル予約を代行してくれるボットや、スマホアプリのレビュー内容を教えてくれるボット、プログラミングで詰まった時に解決できるボットなど、ユニークなモノをたくさんご紹介しています。

今回サンプルで作った「アンケートボット」も、さらに作り込めばココで紹介しているようなボットに変身することが出来るはず!


まとめ
「Motion AI」は、まだ新しいサービスということもあり、日々バージョンアップが活発に行われています。

近日中には「Bot Store」が公開される予定で、ユーザーが作ったオリジナルのボットを共有したりコラボ制作なども行えるようなので、今から非常に楽しみです。

素早く自分だけの「チャットボット」を作りたい人はもちろんですが、自社サービスやアプリなどに「ボット機能」を組み込みたい方にもオススメなので、ぜひ一度トライしてみてください!


<参考>
「Motion AI」公式サイト



written by まさとらん(@0310lan)

まさとらん

国内外問わず「良いモノ」だけひたすら集めて情報共有してます。
厳選ネタはアプギガ内で分かりやすく情報発信中!
その他の旬なネタは、twitterにて発信してますので、お気軽にどうぞ!

twitter:0310lan

この記事を読んでいる人は、他にこんな記事も読んでいます。
Related Posts Plugin for WordPress, Blogger...

ページトップへ戻る