Page d'accueil>Lié à la programmation>Code Source AI
Télécharger

Conversifier la documentation ??

Introduction

Conversify est une plate-forme avancée de chatbot de support client qui permet aux entreprises d'intégrer facilement des chatbots basés sur l'IA dans leurs sites Web. Il combine une technologie d'avatar 3D interactif, des interfaces vocales et textuelles et des modèles de chatbot personnalisables pour offrir une expérience utilisateur fluide et dynamique. Construit sur une pile MERN robuste (MongoDB, Express.js, React.js, Node.js), Conversify fournit aux clients des liens ou des extraits de code intégrables, permettant une intégration rapide et facile.

Principales fonctionnalités ?

  • Intégration de chatbot intégrable : les clients reçoivent des liens directs ou du code pour intégrer les chatbots Conversify dans leurs sites Web.
  • Modèles personnalisables : divers modèles de chatbot sont fournis pour répondre aux différents besoins de support client et styles de marque. ?
  • Avatar 3D interactif : les utilisateurs peuvent interagir avec un avatar 3D qui répond par texte et par voix, offrant ainsi une interface attrayante et humaine. ??
  • Interaction vocale et textuelle : les requêtes peuvent être effectuées soit par saisie textuelle, soit par saisie vocale, avec des réponses fournies dans les deux modalités. ⌨️
  • Backend alimenté par Mistral et Llama LLM : Conversify exploite Mistral et LLama pour gérer les requêtes en langage naturel. ?
  • MongoDB Atlas en tant que Vector Store : Le stockage et la récupération efficaces et évolutifs des données de conversation sont gérés par MongoDB Atlas. ?️⚡
  • Prise en charge future de la sélection de modèles : les clients auront la possibilité de choisir parmi plusieurs modèles linguistiques pour répondre au mieux à leurs besoins. ??

Présentation de l'architecture

Conversify est construit sur une architecture JavaScript full-stack utilisant la pile MERN, garantissant évolutivité, flexibilité et efficacité.

Back-end :

  • Node.js & Express.js : gérez les requêtes API, traitez les données de conversation et gérez les services backend. ?
  • MongoDB Atlas : stocke l'historique des conversations, les profils d'utilisateurs et les vecteurs pour des recherches et une récupération efficaces de similarités à l'aide d'un vectorStore.
  • Mistral (LLM) : gère le traitement du langage naturel et génère des réponses humaines aux requêtes des clients.

Front-end ?️ :

  • React.js : Fournit une interface utilisateur intuitive et réactive où les utilisateurs peuvent interagir avec le chatbot. Il prend en charge les saisies textuelles et vocales. ??‍
  • Three.js (3D Avatar) : Un moteur 3D qui alimente l'avatar interactif, ajoutant une couche d'engagement visuel à l'interaction du chatbot. ?️?

Processus d'intégration

  1. Obtenez un lien ou un code intégrable : après avoir configuré votre chatbot via l'application Web de Conversify, les clients recevront un lien ou un extrait de code intégrable personnalisé. ?
  2. Intégrer au site Web : collez le code fourni dans le code HTML de votre site Web pour intégrer de manière transparente l'interface du chatbot dans n'importe quelle page. ?
  3. Personnalisation : personnalisez le chatbot en sélectionnant des modèles qui correspondent à votre marque et à vos besoins. À l’avenir, vous pourrez également choisir différents modèles linguistiques pour alimenter votre chatbot. ??

Principales fonctionnalités ?

1. Interface de discussion interactive ?

  • Les utilisateurs peuvent interagir avec le chatbot à l'aide de requêtes textuelles ou vocales. ?
  • Le chatbot répond via l'avatar 3D avec une sortie texte et vocale, améliorant ainsi l'engagement.

2. Modèles ?

  • Choisissez parmi une variété de modèles adaptés à différents scénarios de support client. Ces modèles guideront le comportement, le ton et l’apparence du chatbot. ?

3. Intégration voix et texte ?⌨️

  • Le chatbot peut traiter à la fois les entrées vocales et textuelles des utilisateurs. ?️
  • Les réponses vocales sont synthétisées à l'aide d'une technologie avancée de synthèse vocale, donnant à l'avatar 3D une voix naturelle.

4. Personnalisation d'avatar 3D ?‍???

  • L'avatar 3D est entièrement personnalisable, permettant l'alignement de la marque et de la personnalité. Choisissez parmi différents styles et comportements d'avatar. ??

Future feuille de route ?

  1. Options de sélection de modèle : les clients pourront choisir entre différents modèles linguistiques (tels que GPT, Mistral, etc.) en fonction de leurs préférences et exigences. ??
  2. Advanced Analytics : tableau de bord pour suivre les performances du chatbot, les interactions des utilisateurs et les commentaires. ?
  3. Avatars personnalisés : plus d'options de personnalisation pour l'avatar afin de mieux s'aligner sur les différents besoins de l'entreprise et les identités de marque. ?️
  4. Boucles de rétroaction basées sur l'IA : permettez au chatbot d'apprendre des interactions précédentes pour améliorer les réponses au fil du temps. ?

Commencer

Configuration du backend BotGenerator

  1. Cloner le référentiel :

    • Ouvrez votre terminal et exécutez : 
      git clone https://github.com/MrDracs/BotGenerator.git
cd BotGenerator

  2. Dépendances d'installation :

    • Dans le répertoire BotGenerator , installez les dépendances nécessaires : 
      npm install

  3. Créer un fichier .env :

    • Dans le dossier BotGenerator , créez un fichier .env et incluez les variables d'environnement suivantes : 
      MONGODB_URI= < Your_MongoDB_Connection_URI >
GROQ_API_KEY= < Your_GROQ_API_Key >
COHERE_API_KEY= < Your_Cohere_API_Key >

  4. Exécutez le serveur :

    • Démarrez le serveur de développement : 
      npm run dev
    • Cela ouvrira une page Web dans votre navigateur, que vous pourrez fermer pour le moment.

Accéder et tester le Frontend Chatbot ?

  1. Accédez au Frontend :

    • Accédez au dossier CodeCubicleConversify et ouvrez index.html dans votre navigateur :
      • Option 1 : Utilisez le navigateur de votre choix. ?
      • Option 2 : utilisez l'extension VS Code Live Server pour l'hébergement local. ⚡

  2. Générez et testez votre Chatbot :

    • Sur l'application Web Conversify que vous avez ouverte, remplissez le formulaire, ajoutez une base de connaissances et cliquez sur Soumettre . Vous obtiendrez un élément div intégrable contenant votre chatbot. ??

  3. Intégrer le Chatbot :

    • Pour tester rapidement le chatbot :
      • Copiez l'intégralité de l'élément div généré.
      • Ouvrez index.html dans le dossier CodeCubicleConversify .
      • Recherchez la classe suivante dans le code (autour de la ligne 357) : 
         < div class =" side-bar-fs " >
      • Remplacez l'intégralité div par le nouveau que vous avez copié, enregistrez et actualisez la page.

  4. Activer la synthèse vocale (TTS) :

    • Pour activer TTS pour le chatbot, ajoutez /tts à la fin de l'URL src dans la balise iframe fournie dans le div . ?
      • Par exemple: 
         < iframe src =" your_chatbot_url/tts " ... > </ iframe >

Configuration de l'application Web Conversify

  1. Inscrivez-vous sur l'application Web : visitez [URL de l'application Web Conversify] et créez un compte.
  2. Configurez votre chatbot : utilisez les modèles fournis pour configurer votre chatbot.
  3. Générer du code intégrable : Une fois la configuration terminée, vous recevrez le code d'intégration à intégrer dans votre site Web. ?
  4. Surveiller et améliorer : Accédez au tableau de bord pour surveiller les interactions et optimiser les performances du chatbot.

Contact et assistance ??

Si vous avez des questions ou rencontrez des problèmes, n'hésitez pas à contacter notre équipe d'assistance à l'adresse suivante :

Vous êtes maintenant prêt à donner vie aux chatbots de Conversify sur votre site Web ! ??

Des contributeurs ?

  • Ayush Sharma
  • Chirag Singh
  • Rohit Kushwaha
Développer
Informations supplémentaires
Applications connexes
Recommandé pour vous
Actualités connexes Tout