Webサイトに「AIに相談」機能を実装する新しい手法
Webサイト上に独自のチャットボットを構築するのではなく、ユーザーが普段使いしているChatGPTやClaudeなどの外部AIへ直接質問を飛ばすユニークなAI活用術を紹介します。運営側のコストを抑えつつ、ユーザーにはパーソナライズされた使い慣れた環境での対話を提供する、非常に合理的で「イケてる」実装アイデアについて、デモサイトを交えて分かりやすく解説されています。
背景
多くのWebサイトでは、顧客対応の自動化のために独自のチャットボットを導入していますが、これにはサーバーの維持費やAPIのトークン使用料といった継続的なコストが大きな負担となります。また、ユーザー側にとっても、サイトごとに用意された簡易的なチャットインターフェースでは、過去の対話履歴の活用や高度な機能が制限されるという課題がありました。動画では、架空の旅館「湯宿 つきのわ」のデモサイトを例に、これらの課題を解決する「外部AI連携」という新しいアプローチが示されています。これは、サイト側でAIを動かすのではなく、既存の強力なAIプラットフォームへユーザーを誘導し、そこでサイトの情報を処理させるという画期的な発想に基づいています。
この動画の要点
1. 外部AIへの直接リクエスト。Webサイトの右下に配置された「AIに相談」ボタンから、ChatGPT、Claude、Gemini、Perplexityといった主要なAIサービスを選択できます。サイト内のチャット機能で完結させるのではなく、指示内容を外部のAI本体に引き渡して処理させる点が最大の特徴です。これにより、ユーザーは自分が契約しているプランや設定をそのまま活用できます。
2. URLパラメーターの活用。ChatGPTやClaudeでは、URLに特定の文字列(パラメーター)を追加することで、ページ遷移後の入力欄に任意のテキストを反映させることができます。この仕組みを利用し、サイト側で「サイトの概要」と「ユーザーの質問」を組み合わせたURLを動的に生成し、新しいタブで開くことで、ユーザーが手入力することなく自動的な質問送信を実現しています。
3. 運営・ユーザー双方のメリット。運営側は自社サーバーでAIを動かす必要がないため、インフラコストやトークン費用が一切かかりません。一方でユーザーは、自分が普段からカスタマイズし、パーソナライズされた環境のAIを使って、そのサイトに関する情報を深掘りすることができます。また、AI側が持つ最新の知識や検索機能をそのまま利用できる点も魅力です。
なぜ重要か
この手法の秀逸な点は、AIを「自社サイトの機能」として囲い込むのではなく、ユーザーが持つ「汎用的な知能」にサイトの情報を橋渡しするという発想の転換にあります。特に、URLパラメーターという既存のWeb技術を組み合わせるだけで、高度な連携を実現している点が非常に実用的です。小規模なサイトや、API連携のコストを抑えたい企業にとって、この「外部AIへの丸投げ」とも言える連携スタイルは、今後のWebサイトにおけるAI活用のスタンダードの一つになる可能性を秘めています。
こんな人におすすめ
Webサイトの運営者、UI/UXデザイナー、AIを活用したサービス開発に興味があるエンジニア。低コストで高度なAI相談機能を導入したいと考えている方に最適です。
見どころ
この記事は KEITO【AI&WEB ch】 が公開した動画をAI(Google Gemini)が視聴して 日本語にまとめ、公開前に運営者が内容を確認したうえで掲載しています。 要約の性質上、細部が元の発言と異なる場合があります。 正確な内容は元の動画をご確認ください。
YouTubeで元の動画を見る