第63話:接客経験が最大の武器!DifyでECサイトの「自動対応チャットボット」を作る方法

(スタイリッシュな仮想店舗で、歓迎する店員として働くフレンドリーなAIロボットの高品質でモダンなイラスト。ロボットは、透明な画面上の光るシンプルなフローチャートを優しく指差している。温かく魅力的な照明、フラットなベクターアートスタイル、プロのブログ用ヒーロー画像、文字なし、クリーンな背景 AI活用

これまで当ブログでは、「ナレッジ機能」でAIを自社専用にカスタマイズする方法や、「質問分類器」を使った自動仕分け窓口の作り方、そして前回の「システム変数(ツンデレAI)」など、Difyの便利な機能を一つひとつのパーツとして解説してきました。

今回は、これらの機能を使い!今まで学んできたパーツをガチャンと組み合わせて、**【ECサイトやWebサイトのお問い合わせに自動対応するチャットボット】**を丸ごと作ってしまいます。

「なんだか一気に難易度が上がりそう…」と身構える必要はありません。使うのは、すでに皆さんが過去の記事でマスターしてきた機能ばかりです。

実は優秀なAIチャットボットを作るのに一番必要なのは、パソコンのスキルではありません。**お客様が何を求めているのかを察知し、臨機応変に対応してきた「接客や営業の経験」**なのです。

例えば、現場の清掃作業を思い浮かべてみてください。「この頑固な汚れには、この洗剤とこのブラシを組み合わせる」という手順と現場のセオリーさえ知っていれば、誰でもプロの仕上がりにできますよね。今のAIツール(Dify)は、まさにその「すでに完璧に揃ったプロ仕様の道具箱」です。難しいシステムの裏側はAIが全部やってくれます。

設定手順は今回もスクショ付きで、クリックする場所から順番に完全図解しています。あなたのサイトで24時間文句も言わずに働いてくれる「優秀なWebスタッフ」を、さっそく一緒に誕生させましょう!


準備:練習用の「マニュアル(PDF)」をダウンロードしよう

さっそく作っていきたいところですが、「AIに読み込ませるマニュアル(PDF)なんて手元にないよ!」という方も多いですよね。

ご安心ください。この記事を読みながら全く同じように練習できる「架空のECサイトFAQ」のPDFファイルをご用意しました。

以下のリンクからダウンロード(保存)して、パソコンのデスクトップなど分かりやすい場所に置いてからStep 1に進んでくださいね!

⬇️ 練習用ファイルのダウンロードはこちら [【架空ECサイト_FAQナレッジ.pdf】をダウンロードする]

※「ダウンロードができない」という方は、以下のテキストをコピーしてメモ帳などに貼り付け、保存して使っていただいても大丈夫です!

架空ECサイト「SmartMart」FAQ Q1. 送料はいくらですか? / A1. 全国一律550円です。 ただし、5,000円以上のお買い上げで送料無料となります。 Q2. 支払い方法には何がありますか? / A2. クレジットカード決済、代金引換、PayPayがご利用いただけます。 Q3. 注文した商品はいつ届きますか? / A3. ご注文受付後2〜3営業日以内に発送いたします。 Q4. 返品・交換はできますか? / A4. 商品到着後7日以内であれば、未開封・未使用のものに限りお受けいたします。 Q5. 営業時間を教えてください。 / A5. 平日の9:00〜18:00となっております。

準備はできましたか?それでは、AI店長の育成を始めましょう!


Step 1:AIの「業務マニュアル」を作成する

【このステップの目的】 ダウンロードしたFAQのファイルをAIに読み込ませ、新人アルバイトに「お店のルールブック」を渡して覚えてもらう作業です。

【操作手順】

  1. Difyの画面上部にある「ナレッジ」という文字をクリックします。
  2. 画面右上、または中央にある「+ 知識を作成」ボタンをクリックします。
  3. 「ファイルから」という文字が選ばれていることを確認し、画面中央の枠内に先ほどダウンロードした「架空ECサイト_FAQナレッジ.pdf」をマウスでドラッグ&ドロップ(引っ張ってきて離す)します。
  4. 画面右下にある青い「次へ」ボタンをクリックします。
  5. 細かい設定画面が出ますが、ここは何も変更せず、画面右下にある青い「保存して処理」ボタンをクリックします。
  6. 画面に「100%」と表示されるまで、数分そのまま待ちます。

【確認ポイント】 画面上に「埋め込みが完了しました」という緑色のチェックマークが出れば成功です。

【よくあるつまずき】 焦って処理が終わる前に別の画面に移動してしまうこと。100%になるまで、画面を変えずにじっくり待ちましょう。


Step 2:チャットボットの「接客台本」を新規作成する

【このステップの目的】 チャットボットがどう動くか、「お客様が来たらこう対応してね」というフローチャート(手順書)の白紙を用意する作業です。

【操作手順】

  1. 画面上部の「スタジオ」という文字をクリックします。
  2. 画面中央の「最初から作成」という四角いボタンをクリックします。
  3. 左側の種類から「チャットフロー」をクリックして選択します。
  4. 右側の「アプリのアイコンと名前」の入力欄に「ECお客様サポート」と入力します。
  5. 画面右下の青い「作成する」ボタンをクリックします。

【確認ポイント】 画面が切り替わり、広いマス目の画面の中央に「開始」と書かれた四角い箱(ノード)が一つだけ置かれていれば成功です。

【よくあるつまずき】 「チャットボット」ではなく「チャットフロー」を選ぶのを忘れること。「チャットフロー」は枝分かれした複雑な対応ができる賢い台本です。


Difyの「質問分類器」ノードの設定画面。ユーザーの質問をAIが「FAQ」か「その他」に自動分類し、ナレッジ検索を行うか、通常のAI回答を行うかを動的に切り替えるワークフローの構築手順を解説しています。

Step 3:お客様の用件を分ける「受付係」を配置する

【このステップの目的】 お客様の質問が「FAQにある質問」か「それ以外の質問」かを自動で判断し、受付係が案内先を振り分ける作業です。

【操作手順】

  1. 画面中央にある「開始」という箱の右端にある「+」マークにマウスを合わせ、クリックします。
  2. 出てきたメニューのリストから「質問分類器」という文字をクリックします。
  3. 新しくできた「質問分類器」の箱の中にある「+ クラスを追加」という文字を2回クリックします。
  4. 「クラス 1」の入力欄をクリックして「FAQ」と入力します。
  5. 「クラス 2」の入力欄をクリックして「その他」と入力します。
  6. 画面の何もないマス目の部分をクリックして、入力を確定させます。

【確認ポイント】 「質問分類器」の箱の右側に、「FAQ」と「その他」という2つの出口(丸い点)ができていれば成功です。

【よくあるつまずき】 入力した後に別の場所をクリックし忘れて、文字が確定されないこと。入力後は必ず「何もない場所」をクリックする癖をつけましょう。


Difyの「知識検索」ノード設定画面。質問分類器で「FAQ」と判断された質問に対し、事前に取り込んだPDFナレッジ(FAQ資料)から情報を検索し、精度の高い回答を導き出すためのワークフロー構築手順を解説しています。

Step 4:ルールブックを開く「検索係」を配置する

【このステップの目的】 FAQに関する質問だった場合、受付係から連絡を受けたスタッフが、マニュアルの該当ページをパッと探し出して開く作業です。

【操作手順】

  1. 「質問分類器」の箱の右側にある「FAQ」の文字の横の丸い点にマウスを合わせ、「+」マークをクリックします。
  2. 出てきたメニューから「知識検索」をクリックします。
  3. 新しくできた「知識検索」の箱の中にある「+ 追加」という青い文字をクリックします。
  4. Step 1で作った「架空ECサイト_FAQナレッジ」の左横にある四角いチェックボックスをクリックして「✓」を入れます。
  5. 画面右下の青い「追加」ボタンをクリックします。

【確認ポイント】 「知識検索」の箱の中に、「架空ECサイト_FAQナレッジ」という名前が表示されていれば成功です。

【よくあるつまずき】 「その他」の横の「+」を押してしまうこと。必ず「FAQ」の横の「+」から繋げてください。


DifyのLLMノード設定画面。知識検索ノードから取得した専門データをコンテキストとして読み込み、優秀なカスタマーサポートとして正確な回答を作成するプロンプト設定とワークフローの流れを解説しています。

Step 5:丁寧な言葉に直す「ベテラン店長(AI)」を配置する

【このステップの目的】 箇条書きのマニュアルで見つけた答えを、ベテラン店長が頭の中で綺麗な敬語の文章に変換する作業です。

【操作手順】

  1. 「知識検索」の箱の右側にある丸い点にマウスを合わせ、「+」マークをクリックします。
  2. 出てきたメニューから「LLM」をクリックします。
  3. 新しくできた「LLM」の箱の中にある「コンテキスト」という文字の右側の「+」をクリックします。
  4. 出てきたリストから「知識検索」の中の「result」をクリックします。
  5. その下にある「SYSTEM」という広い入力欄をクリックし、以下の文章をそのままコピーして貼り付けます。 あなたは優秀なカスタマーサポートです。コンテキストの情報を元に、お客様の質問に丁寧な日本語で回答してください。
  6. 画面の何もない場所をクリックして確定させます。

【確認ポイント】 「LLM」の箱の中の「コンテキスト」欄に青い文字が入り、「SYSTEM」欄に貼り付けた文章が入っていれば成功です。

【よくあるつまずき】 SYSTEM欄への指示(プロンプト)を書き忘れること。これを忘れるとAIがどう振る舞えばいいか分からず混乱してしまいます。


Step 6:最終的にお客様へ伝える「案内板」を配置する

【このステップの目的】 ベテラン店長が考えた文章を、実際のチャット画面に文字にして案内板に書き出す(お客様に表示する)作業です。

【操作手順】

  1. 「LLM」の箱の右側にある丸い点にマウスを合わせ、「+」マークをクリックします。
  2. 出てきたメニューから「回答」をクリックします。
  3. 新しくできた「回答」の箱の中の、文字が入力できる広い枠をクリックします。
  4. 枠の左上に表示される「{x}」というマーク(変数を挿入)をクリックします。
  5. 出てきたリストから「LLM」の中の「text」をクリックします。
  6. 画面の何もない場所をクリックして確定させます。

【確認ポイント】 「回答」の箱の中に、青い背景で「text」という文字のブロックが入っていれば成功です。

【よくあるつまずき】 自分で「text」と文字を直接打ち込んでしまうこと。必ず「{x}」マークから選んで、青いブロックの状態で入れる必要があります。


Difyの「回答」ノードにおけるエスカレーション設定。質問分類器でカテゴリ外と判断された入力に対し、有人対応への引き継ぎを案内するメッセージを自動返信し、ユーザー体験を損なわないためのワークフロー構築例です。

Step 7:想定外の質問を人間に回す「有人案内板」を配置する

【このステップの目的】 マニュアルにないクレームなどはAIが無理に答えず、「人間の担当者にお繋ぎします」とバトンタッチする案内を出す作業です。

【操作手順】

  1. Step 3で作った「質問分類器」の箱に戻り、今度は「その他」の文字の横の丸い点にマウスを合わせ、「+」マークをクリックします。
  2. 出てきたメニューから「回答」をクリックします。
  3. 新しくできた「回答」の箱の中の広い枠をクリックし、以下の文章を直接入力(またはコピーして貼り付け)します。 ご質問ありがとうございます。申し訳ございませんが、そちらの件は担当のオペレーターがお答えいたします。少々お待ちくださいませ。
  4. 画面の何もない場所をクリックして確定させます。

【確認ポイント】 「質問分類器」の「その他」から直接「回答」の箱が繋がり、その中に謝罪とご案内の文章が入っていれば成功です。

【よくあるつまずき】 線がどこにも繋がっていない「回答」の箱を作ってしまうこと。必ず「その他」の横の「+」から線を伸ばして作ってください。


Step 8:作成したチャットボットを「公開」する

【このステップの目的】 完成したチャットボットを保存し、実際のWebサイトやECサイトに貼り付けられる状態(お店をオープンする状態)にする作業です。

【操作手順】

  1. 画面の右上にある青い「公開する」ボタンをクリックします。
  2. 出てきたメニューの「実行を更新」という青いボタンをクリックします。
  3. 保存が完了したら、もう一度右上の「公開する」ボタンをクリックします。
  4. メニューの中にある「サイトに埋め込む」という文字をクリックします。
  5. 「スクリプトタグ」という難しそうな英語の文字列が表示されます。この右下にある「コピー」ボタンをクリックします。

【確認ポイント】 「実行を更新」を押した際に「更新成功」と表示され、埋め込み用のコードがコピーできればすべての作業が完了です。

【よくあるつまずき】 「公開する」を押さずに画面を閉じてしまい、これまでの作業が保存されないこと。作業の最後には必ず「公開する」→「実行を更新」を押す習慣をつけましょう。


Difyのナレッジ検索(RAG)機能を活用したFAQ自動応答のテスト画面。ユーザーの送料に関する質問に対し、AIがPDF資料から正確な数値を引用して回答し、出典も明記している高度なワークフローの動作例です。

実際に動かしてみよう!(テストプレイ)

お疲れ様でした!これでお店に優秀なAIスタッフが配置されました。 本当に私たちが教えた通りに動いてくれるか、Difyの画面右側にある「プレビュー(テスト)」画面で実際に会話して確かめてみましょう!

以下の**【テスト用の例文】**をコピーして、チャット欄に打ち込んでみてください。

テスト①:FAQ(マニュアル)の質問に答えられるか?

まずは基本の接客テストです。以下の質問を投げてみてください。

  • 「商品の送料はいくらですか?」
  • 「支払い方法には何がありますか?」
  • 「注文した商品はいつ届きますか?」

👉 【成功のサイン】 AIがマニュアル(PDF)を読み取り、丁寧な言葉遣いで「550円です」「PayPayが使えます」などと即答してくれれば大成功です!

テスト②:想定外の質問を人間に回せるか?

次は、マニュアルに載っていないイレギュラーな質問のテストです。

  • 「商品が壊れていたので直接クレームを入れたいです。」
  • 「責任者の方と直接お話ししたいのですが。」
  • 「FAQに載っていない特別な大量注文について相談したいです。」

👉 【成功のサイン】 AIが勝手にデタラメな返事をせず、「担当のオペレーターがお答えいたします。少々お待ちくださいませ。」と人間(あなた)にパスを回してくれれば大成功です!


✅ 最終完成チェックリスト

すべてのテストが終わり、以下の項目がすべて「はい」であれば、あなたのチャットボットは完璧に完成しています!

  • [ ] 「ナレッジ」にPDFファイルが100%読み込まれている。
  • [ ] 「開始」→「質問分類器」の線が繋がっている。
  • [ ] 「質問分類器」が「FAQ」と「その他」の2本道に分かれている。
  • [ ] 「FAQ」の道は「知識検索」→「LLM」→「回答(青いtextブロック)」に繋がっている。
  • [ ] 「その他」の道は「回答(オペレーターに繋ぐ文章)」に繋がっている。
  • [ ] プレビュー画面でテスト例文を入力し、狙い通りの返事が返ってきた。
  • [ ] 右上の「公開する」から「実行を更新」を押して保存を完了した。

まとめ:あなたの経験がAIを賢くする

いかがでしたか?コードを1行も書かずに、これだけの本格的なシステムが作れてしまったことに驚いたのではないでしょうか。

AIに指示を出し、思い通りに動かすために必要なのは、プログラミングの知識ではありません。 これまで最前線で汗をかき、お客様と向き合ってきた私たちだからこそ、「どんな言葉をかければ安心してもらえるか」「どこから先は人間が対応すべきか」という、血の通ったルールを作ることができます。

今日、このボットを作れたあなたは、もう「IT音痴」ではありません。これを武器に、AIを使った副業やビジネスの効率化へ、一緒に新しい一歩を踏み出していきましょう!

コメント

タイトルとURLをコピーしました