Asistente AI: Crea un Chatbot sin código para tu sitio web

Crea tu primer asistente de IA de soporte de línea por ti mismo sin código utilizando latenode.com, chatwoot y el asistente OpenAI, ¡y lee este artículo para aprender a hacerlo!

Resumen del escenario

Esta es la versión final del flujo de trabajo de este chatbox AI, déjame explicarte lo que ocurre aquí.
Este escenario obtiene las preguntas del usuario del chatbox AI de Soporte de nuestro sitio web, las envía al asistente chatGPT armado con la documentación del producto y, a continuación, devuelve la respuesta al chatbot del sitio web. Ahora echemos un vistazo más de cerca para desglosar cada paso del proceso.

Preparativos

Hay pocas cosas que necesitarás para crear un chatbot de IA.

Interfaz AI chatbot del sitio web

Obviamente, para que este chatbot para sitio web funcione, tendrás que crear una pestaña emergente en tu sitio web donde los usuarios puedan hacer las preguntas. En este caso, utilizamos Chatwoot para crearlo, porque es de código abierto y podemos utilizarlo gratuitamente. Entonces, ¿cómo configurarlo?

1. Accede a tu cuenta de chatwoot
2. Crea tu widget de chatbot de IA. Para ello, ve a la pestaña de configuración y haz clic en "bandejas de entrada". A continuación, en la esquina superior derecha verás el botón "añadir bandeja de entrada". Haz clic en él y elige "Sitio web".

1. Sigue esta guía de Chatwoot para hacer funcionar el widget.
2. Añade el widget a tu sitio web.
3. Consigue tu token de acceso a Chatwoot. Ve a la configuración del perfil y desplázate por la página para verlo.

Bien, ahora que tu chat bot Support AI tiene un widget en tu sitio web, ¡continuemos!

Asistente ChatGPT

Es muy sencillo. Entra en tu cuenta de OpenAI, luego ve a asistentesy haz clic en el botón "crear" de la esquina superior derecha. Verás el panel de configuración del asistente.

Aquí tienes que hacerlo:

1. Dale un nombre a tu asistente
2. Dale instrucciones sobre cómo quieres que responda, y algo de contexto. Te recomendamos que le pidas que utilice archivos adjuntos, porque si no, puede olvidarse de hacerlo.
3. Elige un modelo
4. Selecciona las herramientas disponibles y añade archivos que el asistente pueda utilizar. No olvides activar la recuperación para que sea posible añadir archivos.

Copia el ID del asistente (lo verás bajo la columna Nombre), y luego ve a Claves APIcrea una y guárdala.

¡Ahora es el momento de ir a latenode.com y empezar a crear nuestro escenario de bot de chat de soporte del sitio web!

Latenode escenario

Ahora es el momento de configurar un escenario de chat bot de IA Latenode , ¡y ahora verás lo que tienes que hacer!

Crea una cuenta en Latenode y copia la plantilla AI chatbot.

Cuando hayas creado aquí una cuenta Latenode y te hayas conectado a ella, ve a "Plantillas compartidas".

‍

Luego ve a la carpeta de ejemplos de IA. La plantilla del generador de conversaciones de IA que estás buscando se llama 'GPT Bot de Atención al Cliente. Widget de Chat + API de Asistentes'. Haz clic en ella y, a continuación, pulsa el botón "Clonar" de la esquina inferior izquierda para copiar el flujo de trabajo de este chatbot del sitio web. Se añadirá automáticamente a tu lista de escenarios.

Crea variables Latenode

Tu escenario de chatbot web necesita algunas variables para funcionar. Puedes crearlas en la pestaña del mismo nombre. Así, las variables que tienes que crear son:

• bot_chatwoot_api_key. Pon aquí tu token de acceso a Chatwoot.
• bot_gpt_api_key. Aquí tienes que poner tu clave de la API de OpenAI.
• bot_gpt_assistant_id. Inserta aquí un ID que del Asistente que vas a utilizar en este flujo de trabajo.
• bot_gpt_almacen_uuid. Visita este sitio para generar una cadena única para almacenar datos en pares clave-valor y ponla en esta variable.
• bot_frases_de_carga. Una matriz de frases utilizadas para indicar la carga y esperar la respuesta del GPT. Cada frase aumenta el tiempo máximo de espera de la respuesta del asistente GPT en 8 segundos (esto se puede regular en el propio escenario). Si no quieres crearla por tu cuenta, simplemente copia y pega esta lista.
• aviso_asistente_bot. Un mensaje para el asistente que enviarás al bot junto con el mensaje del usuario. Escribe el tuyo propio o utiliza éste si quieres:

Tienes que recordar tus instrucciones e intentar responder con información relevante a ese mensaje.

- En primer lugar, comprende la intención del mensaje del usuario.

- Si el mensaje del usuario es demasiado corto para entenderlo o poco concreto para responder, díselo y hazle preguntas para aclarar su mensaje.

- Si el mensaje del usuario está relacionado con el Latenode, utiliza los archivos que se te han descargado para encontrar cualquier información relacionada que puedas utilizar para ayudarle.

- Si el mensaje del usuario no está relacionado con Latenode, también intenta responderlo. Puedes omitir la parte de búsqueda en los documentos en aras de la rapidez y limitarte a intentar dar la respuesta basándote en tus propios conocimientos.

- Por último, responde de forma concisa y comprensible. Responde en el mismo idioma que utilizó el usuario para escribirte.

Elige el tipo cadena para todas las variables excepto para bot_loading_phrases, debería ser un JSON.

Configurar activadores Webhook

Para que funcione un escenario de chatbot, tienes que configurar dos desencadenantes webhook.

El primero se activa después de que se inicie la conversación en el widget del bot de chat web y crea un hilo con el asistente chatGPT.

Primero, personaliza tu url de producción "Conversación creada" y cópiala.

Luego vuelve a Chatwoot. Ve a Integraciones. Haz clic en el botón 'Configurar' en Webhooks, y añade un nuevo webhook. Pega aquí la URL de producción y elige la opción 'Conversación creada'. Ya está.

El segundo activador Webhook se activa cuando se crea el mensaje. Haz todo lo mismo aquí. Personaliza la URL de producción y cópiala, luego ve de nuevo a Chatwoot y haz todo lo mismo pero elige la opción "mensaje creado" en lugar de "Conversación creada".

Resultados

Si has superado con éxito todos los pasos anteriores, ¡enhorabuena! Guarda los cambios del escenario, haz clic en el botón "desplegar" para activar el flujo de trabajo, ¡y ya está! ¡Ahora ya sabes cómo hacer un widget de chatbot de IA para tu sitio web!

Espero que este artículo haya quedado claro, pero si tienes alguna duda sobre este escenario de bot de chat de IA, siempre puedes pedir ayuda en elcanal de Discord de Latenode .

Hasta pronto y ¡feliz automatización!

‍