Conversify ドキュメント??
導入
Conversify は、企業が AI を活用したチャットボットを自社の Web サイトに簡単に統合できるようにする、高度なカスタマー サポート チャットボット プラットフォームです。インタラクティブな 3D アバター テクノロジー、音声およびテキスト インターフェイス、カスタマイズ可能なチャットボット テンプレートを組み合わせて、シームレスで動的なユーザー エクスペリエンスを提供します。 Conversify は堅牢な MERN (MongoDB、Express.js、React.js、Node.js) スタック上に構築されており、クライアントに埋め込み可能なリンクまたはコード スニペットを提供し、迅速かつ簡単な統合を可能にします。
主な特徴?
- 埋め込み可能なチャットボットの統合: クライアントは、Conversify チャットボットを Web サイトに埋め込むための直接リンクまたはコードを受け取ります。
- カスタマイズ可能なテンプレート: さまざまなカスタマー サポートのニーズやブランディング スタイルに合わせて、さまざまなチャットボット テンプレートが提供されています。 ?
- インタラクティブな 3D アバター: ユーザーは、テキストと音声を介して応答する 3D アバターと対話でき、魅力的で人間のようなインターフェイスを提供します。 ??
- 音声とテキストのインタラクション: クエリはテキスト入力または音声入力を通じて行うことができ、両方の方式で応答が返されます。 ⌨️
- Mistral と Llama LLM を利用したバックエンド: Conversify は、自然言語クエリの処理に Mistral と LLama を活用します。 ?
- ベクター ストアとしての MongoDB Atlas : 会話データの効率的かつスケーラブルなストレージと取得は、MongoDB Atlas によって管理されます。 ⚡
- モデル選択の将来のサポート: クライアントは、ニーズに最も適した複数の言語モデルから選択できるようになります。 ??
アーキテクチャの概要
Conversify は、MERN スタックを使用したフルスタック JavaScript アーキテクチャ上に構築されており、スケーラビリティ、柔軟性、効率性を確保しています。
バックエンド:
- Node.js および Express.js : API リクエストを処理し、会話データを処理し、バックエンド サービスを管理します。 ?
- MongoDB Atlas : 会話履歴、ユーザー プロファイル、ベクトルを保存し、vectorStore を使用した効率的な類似性検索と取得を実現します。
- Mistral (LLM) : 自然言語処理を処理し、顧客のクエリに対して人間のような応答を生成します。
フロントエンド?️:
- React.js : ユーザーがチャットボットと対話できる、直感的で応答性の高いユーザー インターフェイスを提供します。テキスト入力と音声入力の両方をサポートします。 ??
- Three.js (3D アバター) : インタラクティブなアバターを強化する 3D エンジンで、チャットボットのインタラクションに視覚的な関与のレイヤーを追加します。 ?️?
統合プロセス
- 埋め込み可能なリンクまたはコードを取得する: Conversify の Web アプリを通じてチャットボットを構成すると、クライアントはカスタムの埋め込み可能なリンクまたはコード スニペットを受け取ります。 ?
- Web サイトに埋め込む: 提供されたコードを Web サイトの HTML に貼り付けて、チャットボット インターフェイスを任意のページにシームレスに統合します。 ?
- カスタマイズ: ブランドとニーズに合ったテンプレートを選択して、チャットボットをカスタマイズします。将来的には、チャットボットを強化するためにさまざまな言語モデルを選択できるようになります。 ??
主な機能?
1.インタラクティブなチャットインターフェイス?
- ユーザーはテキストまたは音声クエリを使用してチャットボットと対話できます。 ?
- チャットボットは 3D アバターを通じてテキストと音声出力の両方で応答し、エンゲージメントを強化します。
2.テンプレート?
- さまざまな顧客サポート シナリオに合わせたさまざまなテンプレートから選択できます。これらのテンプレートは、チャットボットの動作、トーン、外観をガイドします。 ?
3.音声とテキストの統合?⌨️
- チャットボットは、ユーザーからの音声入力とテキスト入力の両方を処理できます。 ⁉️
- 音声応答は高度なテキスト読み上げ技術を使用して合成され、3D アバターに自然な声を与えます。
4. 3D アバターのカスタマイズ???
- 3D アバターは完全にカスタマイズ可能で、ブランディングと個性の調整が可能です。さまざまなアバターのスタイルと動作から選択します。 ??
将来のロードマップ?
- モデル選択オプション: クライアントは、好みや要件に基づいて、さまざまな言語モデル (GPT、Mistral など) から選択できます。 ??
- 高度な分析: チャットボットのパフォーマンス、ユーザー インタラクション、フィードバックを追跡するためのダッシュボード。 ?
- パーソナライズされたアバター: さまざまなビジネス ニーズやブランド アイデンティティに合わせてアバターをカスタマイズできるオプションが増えました。 ⁉️
- AI を活用したフィードバック ループ: チャットボットが以前のやり取りから学習して、時間の経過とともに応答を改善できるようにします。 ?
はじめる
BotGenerator バックエンドのセットアップ
リポジトリのクローンを作成します。
- ターミナルを開いて次を実行します。
git clone https://github.com/MrDracs/BotGenerator.git
cd BotGenerator
依存関係をインストールします。
-
BotGenerator
ディレクトリに、必要な依存関係をインストールします。
.env
ファイルを作成します。
-
BotGenerator
フォルダーに.env
ファイルを作成し、次の環境変数を含めます。 MONGODB_URI= < Your_MongoDB_Connection_URI >
GROQ_API_KEY= < Your_GROQ_API_Key >
COHERE_API_KEY= < Your_Cohere_API_Key >
サーバーを実行します。
- 開発サーバーを起動します。
- これにより、ブラウザで Web ページが開きますが、ここでは閉じても問題ありません。
チャットボット フロントエンドにアクセスしてテストしますか?
フロントエンドにアクセスします。
-
CodeCubicleConversify
フォルダーに移動し、ブラウザーでindex.html
開きます。- オプション 1: 選択したブラウザを使用します。 ?
- オプション 2: ローカル ホスティングに VS Code Live Server 拡張機能を使用します。 ⚡
チャットボットを生成してテストします。
- 開いた Conversify Web アプリで、フォームに記入し、ナレッジ ベースを追加して、 [送信]をクリックします。チャットボットを含む埋め込み可能な
div
要素を取得します。 ??
チャットボットを埋め込む:
- チャットボットを簡単にテストするには:
- 生成された
div
要素全体をコピーします。 -
CodeCubicleConversify
フォルダー内のindex.html
を開きます。 - コード内で次のクラスを見つけます (357 行目あたり)。
< div class =" side-bar-fs " >
-
div
全体をコピーした新しいものに置き換え、保存してページを更新します。
テキスト読み上げ (TTS) を有効にする:
- チャットボットの TTS を有効にするには、
div
で指定された iframe タグのsrc
URL の末尾に/tts
を追加します。 ?- 例えば:
< iframe src =" your_chatbot_url/tts " ... > </ iframe >
Conversify Web アプリのセットアップ
- Web アプリでの登録: [Conversify Web アプリの URL] にアクセスし、アカウントを作成します。
- チャットボットを構成する: 提供されたテンプレートを使用してチャットボットを構成します。
- 埋め込み可能なコードの生成: 設定が完了すると、Web サイトに統合するための埋め込みコードが届きます。 ?
- 監視と改善: ダッシュボードにアクセスして対話を監視し、チャットボットのパフォーマンスを最適化します。
連絡先とサポート??
ご質問がある場合、または問題が発生した場合は、お気軽にサポート チームまでご連絡ください。
これで、Conversify のチャットボットをウェブサイトに導入する準備が整いました。 ??
貢献者?