Bajo apalancamiento de código: AI Studio con Airtable

Introducción

Hace unos meses estuve en Dubai para un hackathon. El taxista del hotel era muy amable y quería asegurarse de que aprovechaba al máximo mi viaje de dos días. Empezó a ofrecerme todo tipo de servicios, como recogerme al principio y al final de cada día del evento, hacer diferentes tipos de recorridos especializados por la ciudad o incluso hacer una excursión a Abu Dabi.

Me dio su tarjeta de visita con un código QR para enviarle un mensaje por WhatsApp. Escaneé el código y me llevó a una ventana de chat con su Account de empresa. Pero eso fue todo. Ninguno de los interesantes servicios de los que acababa de hablarme se presentaba a los usuarios. Así que mi cerebro empresarial se puso a trabajar y le sugerí, ¡sabes que realmente puedes ayudar a potenciar a tus clientes con AI Studio de Vonage!

An example of a QR code Taxi Driver card. Credit to zazzle.com

El año pasado Vonage lanzó AI Studiouna plataforma NoCode/LowCode que permite a cualquiera crear agentes de IA conversacional, ¡rápidamente! Los casos de uso típicos de la IA conversacional son los chatbots para atención al cliente o marketing. Pero los chatbots pueden mejorar la experiencia del usuario para muchas más aplicaciones.

En este tutorial, te mostraré cómo construir un agente de WhatsApp de AI Studio para este servicio de taxi que utiliza Airtable como base de datos backend para almacenar y acceder a la información.

¡Yalla, vamos!

Requisitos previos

• Cuenta de desarrollador de Vonage. Para usar AI Studio necesitarás una Vonage Developer Account. Más abajo encontrarás los detalles para comenzar.

• Airtable Account - regístrese aquí. Usaremos Airtable como base de datos backend.

• Account de cartero - inscríbase aquí. Usaremos Postman para enviar peticiones en la sección avanzada de este tutorial.

• Opcional: Miro Account - regístrese aquí. Yo uso Miro para maquetar mis agentes de AI Studio. Más información al respecto a continuación.

Vonage API Account

To complete this tutorial, you will need a Vonage API account. If you don’t have one already, you can sign up today and start building with free credit. Once you have an account, you can find your API Key and API Secret at the top of the Vonage API Dashboard.

Ready to start building?

Experience seamless connectivity, real-time messaging, and crystal-clear voice and video calls—all at your fingertips.

Configurar

Empiece con una maqueta

Antes de crear cualquier agente en AI Studio, recomiendo encarecidamente trazar el flujo de tu agente utilizando una herramienta visual. Puedes leer más sobre cómo crear una maqueta de IA conversacional de alta fidelidad aquí.

En nuestra aplicación, permitiremos a los usuarios buscar precios de taxis en lugares populares y también añadir su información de contacto para suscribirse a futuras ofertas de taxis. La maqueta de estos flujos tiene este aspecto:

Example of mockup for inbound flows of AI Taxi Demo

Ahora que tenemos una idea clara de lo que queremos construir, ¡manos a la obra!

Crear una base de datos Airtable

Antes de empezar con AI Studio, tendremos que configurar nuestra base de datos Airtable. Airtable es una herramienta genial que es como Excel con superpoderes. La documentación de documentación es fantástica y un gran lugar para empezar.

Una vez que te sientas cómodo, querrás construir una nueva base. La llamaremos "AI Taxi Demo". En esta base tendremos dos tablas: Destinos y Clientes.

Para los destinos, lo haremos sencillo. Sólo habrá dos campos: Nombre y Precio.

Destinations table with fields Name and Price

Del mismo modo, para las tablas Clientes, sólo utilizaremos dos campos: Nombre y Teléfono:

Customers table with fields Name and Phone_Number

Podemos añadir algunos datos ficticios para estas tablas, de modo que nuestras llamadas a la API devuelvan valores. Los números de teléfono deben introducirse sólo con dígitos, sin el signo más (+).

Crear un nuevo agente

Ahora que tenemos nuestra base de datos configurada, podemos empezar a construir nuestro agente AI Studio que interactuará con el usuario y luego pasará los datos hacia y desde Airtable. Siga las instrucciones que se encuentran en la documentación AI Studio aquí. Hay tres opciones importantes para nuestro agente, seleccione:

• Tipo: WhatsApp

• Plantilla: Empezar de cero

• Evento: Entrada

Recuperar datos de Airtable

Empecemos a crear nuestros flujos. Lo bueno es que, básicamente, ¡ya hemos hecho todo el trabajo! Sólo tenemos que convertir nuestro diagrama de flujo vertical en un agente horizontal.

Nuestros pasos:

1. Nodo Enviar Mensaje: envía un mensaje de bienvenida, "Bienvenido a AI Taxi"

2. Nodo de Entrada de Recogida: Preguntar al usuario "¿En qué puedo ayudarle?". La respuesta del usuario se almacenará en un parámetro llamado TEMA.

Los parámetros son como variables, a las que se puede acceder a través del agente. Puede leer más sobre los parámetros aquí. Al igual que las variables en el código tienen tipos de datos, los parámetros tienen entidades. Para simplificar, todos los parámetros serán de tipo @sys.any.

1. Nodo de clasificación: clasificar el TOPIC parámetro. Tendremos dos intents Retrieve Prices y Sign Up For Promotions. Aquí podríamos haber utilizado una condición simple ya que en este ejemplo sólo tenemos dos intents. Sin embargo, la belleza y el poder de AI Studio es la característica de Clasificación. Queremos permitir a nuestros usuarios la libertad de introducir cualquier petición que deseen y escribirla de forma natural. Puedes ver lo potente y fácil de usar que es el nodo de Clasificación con Expresiones de Usuario sugeridas; aquí.

2. Recoger nodo de entrada: Preguntar al usuario "¿A dónde te gustaría ir?". La respuesta del usuario se almacenará en un parámetro llamado DESTINO.

Ahora tenemos el término de búsqueda que queremos enviar a Airtable y recibir de vuelta nuestra información de precios almacenada. Pero, ¿cómo podemos pasarlo a Airtable? Lo bueno de Airtable es su API incorporada para cada base y la documentación útil. Desde nuestra base AI Taxi Demo, haga clic en ayuda en la esquina superior derecha. A continuación, en la barra lateral, en la parte inferior, encontrará Documentación API. ¡Lo mejor es que Airtable genera la solicitud requerida para usted! Aquí encontrará la solicitud curl pre-construida, se verá algo como esto:

Ahora tendremos que añadir esto a nuestro agente AI Studio. Así que añadiremos un nodo nodo Webhook que nos permitirá realizar peticiones REST API. Aprende más sobre nodos Webhook aquí.

En el nodo, añadiremos nuestro endpoint en la Request URL:

https://api.airtable.com/v0/app4AtCxYJu9tagah/Destinations

También tendrá que añadir su Airtable Personal Access Token en los parámetros de cabecera en la pestaña Cabeceras. Usted puede aprender cómo generar y utilizar su Token de Acceso Personal aquí. Asegúrese de darle alcances data.records:read y data.records:write. Este token sólo puede verse una vez, por lo que deberías guardarlo en algún lugar seguro donde puedas copiarlo/pegarlo más tarde.

Ahora su nodo webhook debe tener este aspecto:

Example of Lookup Destination Webhook Node

Podemos comprobar que nuestro webhook funciona haciendo clic en el botón test request en la parte superior derecha. Verás que nos devuelve todos nuestros Destinos en la tabla. Puedes ver en la pestaña de respuesta qué datos serán devueltos:

Example of Destinations Lookup Response

Pero no queremos que todos los de los destinos, queremos ser capaces de buscar por nuestra entrada de usuario. Por suerte para nosotros, Airtable tiene algunas características interesantes de búsqueda. Por ejemplo, he utilizado el filterByFormula para crear una búsqueda global en la tabla. Vamos a utilizar filterByFormula para buscar en la columna Destino. Y ahora nuestro nodo webhook se ve así:

Example of Webhook Node with Query Parameters

Debe hacer clic en la pestaña Parámetros de consulta y rellenar el parámetro y el valor, escribir directamente en la ruta URL no se guardará.

Si tiene problemas con su petición, intente codificar su $DESTINATION con la herramienta de codificación herramienta de codificación Airtable. La codificación de nuestra solicitud debe ser similar:

filterByFormula==SEARCH(%22$DESTINATION%22%2C+%7BName%7D)

Ahora podemos ejecutar la prueba de nuevo y ver que la petición devuelve un objeto que en su interior tiene algo llamado "records", que a su vez contiene un array de objetos record.

Example of Filtered Response

AI Studio nos permite manejar las respuestas de la API con la función Mapeo de respuestas de respuesta. Tenemos que asignar el objeto devuelto a un parámetro que luego podremos utilizar dentro de AI Studio. Podemos hacerlo así:

Example of Response Mapping

Y ahora que hemos mapeado nuestros datos de respuesta, ¡podemos ejecutar la prueba y ver algunos valores devueltos a nuestros parámetros!

Example of Response Mapping Test Results

¡Lo hemos conseguido! Hemos conectado nuestro agente AI Studio a nuestros datos de Airtable y ahora podemos utilizar esta información en nuestro agente. Un último paso es utilizar nuestros datos ahora en nuestro agente y hacer un bonito mensaje a nuestro usuario:

Example of Send Price Node

Si abrimos nuestro probadorpodemos ver el recorrido completo del usuario para pedir el precio de un taxi.

Testing Our Completed Flow

Envío de datos a Airtable

Ahora que nos hemos conectado con nuestra base de datos Airtable y hemos empezado a recibir información, ¡enviar información será pan comido!

Empezaremos de nuevo desde nuestro nodo de Clasificación de Temas. Añadiremos un nuevo Intent llamado "Sign Up For Promotions" y añadiremos algunas expresiones de usuario. Algo como esto:

Example of Adding User Expressions To Training Set

Ahora estamos listos para conectarnos a nuestro webhook. Así que vamos a echar un vistazo a la documentación Airtable nuevo. Nos muestra exactamente cómo dar formato a nuestra solicitud. Encontramos en la solicitud generada algo como esto:

Example of Airtable POST Request

Ahora sólo tenemos que abrir nuestro nuevo nodo webhook. Primero, cambiamos nuestro tipo de petición de GET a POST. Podemos ver que (de nuevo) necesitamos pasar nuestro token de acceso personal en la clave Authorization de la cabecera. Pero ahora también tenemos que pasar un segundo campo. Vamos a añadir Content-Type para decir que estamos enviando json con la solicitud. Y finalmente, pasaremos nuestros datos en el cuerpo con un objeto que tiene registros de clientes.

Example of POST request webhook node

En primer lugar, vamos a pasar a través de un cliente de prueba. Digamos, Miss Piggy.

Example of sending Miss Piggy customer to Airtable

Y ahora si pulsamos Test Request, deberíamos ver una nueva entrada en Airtable.

New entry in Airtable; Miss Piggy

¡Pero no queremos añadir a Miss Piggy en nuestra base de datos! Queremos añadir a nuestro usuario real. Ahora podrías preguntar por el nombre y el número del usuario aquí y si requieres más información, probablemente necesitarás usar algunos nodos de recolección aquí. Pero para esta aplicación, sólo nos importa el nombre de usuario y el número. Para ello podemos utilizar los parámetros del sistema de AI Studio. Así que actualizamos el nombre y el número de teléfono de Miss Piggy con los parámetros del sistema $PROFILE_NAMEy $SENDER_PHONE_NUMBER. Así que nuestro cuerpo de la solicitud ahora se parece a esto:

Example of POST request with dynamic variables

Por último, añadamos un mensaje de agradecimiento con un nodo de envío de mensaje. Y ahora podemos probar este flujo:

Testing Our Completed Flow 2

Conclusión

Ya has visto cómo implementar AI Studio con una base de datos Airtable fácil de usar. ¿Qué vas a construir con tus nuevas habilidades? Por favor, hágamelo saber en Twitter o en Slack de la comunidad de Vonage (incluso tenemos un canal para AI Studio). ¡Estoy muy interesado en ver lo que estás construyendo con Low Code!