AIチャットの「答えられない」を問い合わせに変える仕組みの作り方

AIチャットボットが回答できなかった質問を、そのままスムーズに問い合わせフォームへつなげる仕組みを実装解説。フォールバック設計からLaravel実装例まで実践的に紹介します。

こんな悩みを抱えていませんか？

サイトにAIチャットを導入したものの、「うまく答えられなかったときに、訪問者がどこかへ消えてしまう」という状況に心当たりはないでしょうか。

せっかく問い合わせ意欲の高いユーザーが来てくれているにもかかわらず、チャットが「申し訳ありません、わかりかねます」と返した瞬間にブラウザを閉じられてしまう。これは機会損失どころか、信頼そのものを損なう体験です。

もう少し具体的に言えば、こういったケースが現場では頻発しています。

• AIが「対応範囲外です」と返答 → ユーザーが離脱
• チャット終了後に問い合わせフォームへの動線がない
• 「後でメールします」と言ったまま誰もフォローしない

この記事では、AIチャットが「答えられなかった瞬間」を問い合わせにつなげるフォールバック設計の考え方と、Laravel・JavaScript を使った実装方法を具体的に解説します。

なぜ「答えられない」が離脱を生むのか

AIチャットの失敗の多くは、技術的な問題ではなくUX設計の問題です。チャットボットは「答えられる質問」のために設計されますが、ユーザーが本当に求めているのは「解決すること」であり、AIが答えられなくても、その先に人間が待っていれば話は変わります。

問題の構造を整理すると次のようになります。

flowchart TD
    A[ユーザーが質問] --> B{AIが回答できる？}
    B -->|Yes| C[回答を返す]
    B -->|No| D[「わかりません」と返答]
    D --> E{次の導線がある？}
    E -->|ない| F[ユーザー離脱 ❌]
    E -->|ある| G[問い合わせフォームへ誘導]
    G --> H[リード獲得 ✅]

フォールバック（失敗時の代替処理）を設計していないシステムは、ちょうど「話し中」のまま電話を切られるような体験をユーザーに与えます。一方、適切な導線を設けると、答えられなかった質問がむしろ商談のきっかけになります。

あるクライアント事例をご紹介します。神奈川県内の建設資材商社さんで、製品仕様に関するAIチャットを導入されていました。導入当初は「対応範囲外」の回答が全体の約38%を占めており、そのほぼ全員が離脱していました。フォールバック設計を実装したところ、離脱率が大幅に改善し、問い合わせ数が月平均で1.8倍になりました。

実装：フォールバックから問い合わせへつなぐ仕組み

全体の設計イメージ

実装は大きく3つのフェーズに分かれます。

1. フォールバックの検知 — AIが「答えられない」と判断した瞬間を捕捉する
2. コンテキストの保存 — ユーザーが何を聞いていたかをセッションに保持する
3. フォームへの引き継ぎ — 保存した内容を問い合わせフォームに自動挿入する

Step 1：フロントエンド側のフォールバック検知

OpenAI API など外部AIを使っている場合、返答に「わかりません」「対応できません」などのキーワードが含まれる場合をフォールバックとして判定する方法が実装しやすいです。

// chat.js
async function sendMessage(userMessage) {
  const response = await fetch('/api/chat', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ message: userMessage })
  });

  const data = await response.json();

  if (data.is_fallback) {
    // セッションストレージに質問内容を保存
    sessionStorage.setItem('chat_fallback_message', userMessage);
    showFallbackUI();
  } else {
    renderBotMessage(data.reply);
  }
}

function showFallbackUI() {
  const fallbackHtml = `
    <div class="chat-fallback">
      <p>この質問については、担当者が直接ご回答します。<br>
      よろしければ、このまま問い合わせフォームへどうぞ。</p>
      <a href="/contact?from=chat" class="btn-contact">お問い合わせへ進む</a>
    </div>
  `;
  document.getElementById('chat-messages').insertAdjacentHTML('beforeend', fallbackHtml);
}

Step 2：Laravel側でフォールバック判定

// app/Http/Controllers/ChatController.php

public function reply(Request $request): JsonResponse
{
    $userMessage = $request->input('message');

    $aiReply = $this->openAiService->ask($userMessage);

    $fallbackKeywords = [
        'わかりかねます', '対応できません',
        '専門外', 'I cannot', 'I don\'t know'
    ];

    $isFallback = collect($fallbackKeywords)
        ->contains(fn($kw) => str_contains($aiReply, $kw));

    // フォールバック時はセッションにも保存
    if ($isFallback) {
        session()->put('chat_fallback', [
            'original_question' => $userMessage,
            'occurred_at' => now()->toIso8601String(),
        ]);
    }

    return response()->json([
        'reply'       => $aiReply,
        'is_fallback' => $isFallback,
    ]);
}

Step 3：問い合わせフォームへのコンテキスト引き継ぎ

ユーザーがフォームページに遷移したとき、チャットの質問内容をフォームに自動挿入することで、入力の手間を省きつつ担当者への情報共有も同時に行います。

// contact.js（問い合わせページで読み込む）
document.addEventListener('DOMContentLoaded', () => {
  const fallbackMsg = sessionStorage.getItem('chat_fallback_message');

  if (fallbackMsg) {
    const textarea = document.getElementById('inquiry-body');
    if (textarea) {
      textarea.value =
        `【チャットでご質問いただいた内容】\n${fallbackMsg}\n\n` +
        `（上記に追記・修正してからお送りください）`;
    }
    // 使用済みなのでクリア
    sessionStorage.removeItem('chat_fallback_message');
  }
});

// app/Http/Controllers/ContactController.php（フォーム受信側）

public function store(Request $request): RedirectResponse
{
    $chatContext = session()->pull('chat_fallback');

    $inquiry = Inquiry::create([
        'name'             => $request->name,
        'email'            => $request->email,
        'body'             => $request->body,
        'from_chat'        => !is_null($chatContext),
        'chat_question'    => $chatContext['original_question'] ?? null,
        'chat_occurred_at' => $chatContext['occurred_at'] ?? null,
    ]);

    // 営業担当へのメール通知
    Mail::to(config('mail.sales_address'))
        ->send(new InquiryReceived($inquiry));

    return redirect()->route('contact.thanks');
}

この実装により、管理画面でも「チャット経由の問い合わせ」を一覧で確認でき、どの質問がフォールバックしたかを継続的に分析・改善できます。

よくある失敗パターンと対処法

実案件を通じて遭遇した典型的なミスを4つ挙げます。これを知っているだけで実装の質が大きく変わります。

まとめと次のステップ

AIチャットの「答えられない」は、正しく設計すればむしろ最もコンバージョン確率の高い接点になり得ます。ユーザーは疑問を持って能動的に動いている状態だからこそ、そこに適切な受け皿を用意することが重要です。

今回の実装を整理すると、以下の3ステップに集約されます。

1. フロントエンドでフォールバックを検知し、ユーザーに人間対応の選択肢を提示する
2. チャットの質問内容をセッションに保存し、フォームへ引き継ぐ
3. フォールバックデータをDBに記録し、継続的な改善ループを作る

これらは「AIの失敗をカバーする」というネガティブな発想ではなく、チャットをリード獲得の入口として機能させるというポジティブな設計思想です。

「自社のチャットに組み込みたいけど、どこから手をつければいいかわからない」という方は、ぜひ一度ご相談ください。Fivenine Design では、OpenAI API との連携からLaravelバックエンドの構築、フォーム設計まで一気通貫でサポートしています。まず現状のチャット構成をヒアリングするだけでも、改善の糸口は必ず見つかります。