Chatbot de voz existe? Como utilizar o DialogFlow para integrar serviços de voz e mensagem na mesma plataforma

Chatbot de voz existe? Como utilizar o DialogFlow para integrar serviços de voz e mensagem na mesma plataforma

Se você vai construir algum chatbot utilizando mensagens de texto, o DialogFlow já é a sua primeira opção, mas o que torna essa plataforma mais interessante é que ela pode ser conectada com múltiplos canais de comunicação, incluindo telefonia.

Neste artigo vou abordar sobre como utilizar a integração de 1 clique do DialogFlow com a Twilio para que você possa receber chamadas telefônicas e respondê-las direto do seu assistente, como se fosse uma conversa de texto. Além disso, você vai aprender como funciona a integração e como você poderá customizá-la.

Crie as contas nas plataformas

Antes de começarmos, você vai precisar ter uma conta da Twilio e um projeto no DialogFlow.

Criar a conta na Twilio é bem simples e você pode fazer isso clicando aqui. Uma vez com a conta criada, vá para o console do DialogFlow. Para a integração com 1 clique é necessário que você já tenha adquirido um número de telefone da Twilio.

Para o DialogFlow, vamos utilizar a versão "Essentials". Se você ainda não criou o projeto. Na tela inicial, vá em qualquer uma das opções "Create Agent" que aparecem na tela.

Ao entrar na opção, teremos a tela seguinte onde você deve informar o nome do seu agente (Agent name), o idioma padrão (Default language), o fuso-horário (Default time zone) e o projeto da Google cloud.

Se você não quiser vincular com um projeto existente, deixe na opção Create a new Google project. Não vamos alterar a opção Agent type e clicaremos em Create para continuar.

Uma vez que o agente tenha sido criado, o console vai exibir a tela a seguir:

Essa é a tela padrão da home de um agente e nela você vai poder configurar as intenções (intents), entidades (entities), webhooks e códigos de backend para deixar seu bot mais interativo, integrando com seu próprio sistema. Por fim, temos também a opção de integrações (integrations) que é o local onde vamos configurar o vínculo do DialogFlow com a Twilio.

"One-click Integration" do DialogFlow com Twilio

Vamos abrir a opção Integrations do menu para configurar sua conta. Na tela a seguir, você vai ver várias opções, entre elas as integrações de 1-clique e outras instruções com serviços baseados no tipo de comunicação, seja por telefonia, texto ou integrações de código-aberto desenvolvidas pela comunidade.

Mas qual a diferença entre as integrações?

O que vai impactar aqui vai ser a necessidade de construir um gateway para fazer a ponte entre o DialogFlow e o provedor de comunicação que for utilizar.

Vamos imaginar que você quer integrar não apenas voz, mas também mensagens vindas do WhatsApp ou SMS. Nesse caso, você precisa criar um serviço na nuvem que vai receber o webhook da Twilio e fazer a chamada na API do DialogFlow.

A grande diferença se você for optar por integrar telefonia é que, quando você opta pela integração de 1-clique, não vai ser necessário construir esse gateway na nuvem, como ocorre no formato tradicional utilizando a Twilio Media Streams, e você vai precisar gerenciar um servidor na nuvem para fazer essa intermediação.

Um ponto interessante sobre essa integração é que ela vai criar um fluxo no Twilio Studio e você pode personalizar esse fluxo, carregando parâmetros, chamando outras funções e webhooks e optando ou não por encaminhar para o agente do DialogFlow ou, se necessário, redirecionar para um atendimento humano utilizando o Twilio Flex.

Ativando a integração

Dando sequência ao nosso tutorial, clique na opção Twilio dentro do bloco One-click telephony.

Uma janela vai ser aberta para que você escolha o nome da integração e o ambiente (environment) que ela estará disponível. É possível que você tenha ambientes de desenvolvimento e produção independentes no DialogFlow, ou seja, você pode testar novas funcionalidades e implementar novas intenções sem interferir no que está em produção.

O nome que você der para essa integração vai ser replicado no console da Twilio tanto no fluxo do Twilio Studio quanto no nome da conexão com o agente do DialogFlow.

Uma vez que tenha informado o nome e o ambiente, clique em Sign Up para continuar. O DialogFlow vai te redirecionar para o console da Twilio, conforme a tela a seguir.

Um item importante desta tela é que você precisa escolher o idioma. Neste caso vamos alterar para português brasileiro (Portuguese - Brazil). Ao fazer isso, observe que a opção de análise de sentimento é desabilitada, pois não está disponível neste idioma.

Clique em Next para continuar. Na tela a seguir teremos a escolha do número de telefone que será vinculado ao agente.

Escolha um número existente na lista ou adquira um novo número clicando no botão +. Clique em Next para continuar e ver a tela de confirmação. Assim que chegamos nessa tela, basta clicar em Confirm configuration details para continuar. Uma nova janela de confirmação será exibida informando o nome do agente no DialogFlow e o número de telefone vinculado. Clique em Agree and Connect para confirmar e finalizar o processo.

Ao concluir, você será redirecionado novamente para o console do DialogFlow, exibindo a janela com os dados da integração da Twilio.

Pronto. Agora você pode ligar para o número que configurou e testar seu bot de voz! Só falar um "oi" que você será prontamente respondido. Além disso, se você já adicionou outras intenções, elas devem funcionar conforme programado.

Agora, vamos ver em detalhes como isso funciona do lado da Twilio? Quando você realiza essa integração, ela vai criar automaticamente um fluxo do Twilio Studio.

Se você nunca o utilizou, ele é uma forma de criar sistemas de atendimento conhecidos como URA (Unidade de Resposta Audível) e também automatiza respostas de SMS ou serviços de chat por mensagem através de uma API REST.

Através do Studio você pode criar uma árvore de decisão que identifica o objetivo do usuário e tem um resultado idêntico a qualquer sistema de atendimento por telefone que você já tenha utilizado. Para criar um fluxo, você simplesmente vai arrastar e soltar componentes e fazer a ligação sequencial entre eles, de acordo com a árvore que deseja montar.

Como personalizar o fluxo de conversa?

Agora que vimos que a conexão funciona, chegou o momento de você construir uma experiência mais amigável. Enviar o usuário diretamente para o agente no DialogFlow pode gerar alguma confusão, então vamos ver onde personalizar o fluxo de atendimento.

Vamos ajustar o fluxo no Twilio Studio e incluir alguma mensagem de saudação, informando ao cliente o que ele pode fazer e, se necessário, coletar alguma informação antes de encaminhar para a plataforma.

No console da Twilio, vá para o item Studio, ao abrir a lista de fluxos, clique no fluxo com o nome que você definiu na configuração do DialogFlow. Você vai ver a tela da imagem a seguir.

O que vemos aqui são dois blocos, um chamado Trigger que concentra os gatilhos de nova mensagem (Incoming Message), nova chamada (Incoming Call) e alguma chamada manual via REST (REST API).

Esse fluxo já conecta diretamente a chamada entrante com a conexão com o agente virtual. Vamos adicionar mais passos para incluir uma saudação inicial para direcionar melhor os usuários do nosso serviço.

E como eu faço isso? Simples, na lateral direita você verá uma lista de "widgets". Cada item dessa lista poderá realizar uma operação diferente, por exemplo, solicitar ao usuário que pressione um dígito ou fale alguma coisa, tocar algum áudio ou falar algum texto, rodar uma função no backend, etc.

Aqui temos a lista geral dos tipos de componentes, como controle de fluxo (Flow control) para criar uma árvore de decisão por exemplo, voz (Voice) com ações para uma chamada telefônica, mensagem (Messaging) para trabalhar com SMS e WhatsApp, ferramentas externas (Tools & Execute Code) para rodar coisas usando Twilio Functions ou seu próprio servidor na nuvem e conectar outros produtos (Connect Other Products) onde temos como conectar com um agente humano através do Twilio Flex.

Para direcionar nossos usuários, vamos falar um texto de forma que ele entenda que precisa dizer algo após a mensagem. Para isso, você vai adicionar o componente Say/Play e configurar os seguintes campos:

• Text to say: coloque uma mensagem de boas-vindas e solicite que ele diga algo o que precisa
• Language: escolha Portuguese (Brazilian) para português brasileiro
• Message Voice: escolha Alice ou qualquer uma das opções [Polly]
• Se desejar que o texto se repita várias vezes, basta alterar o campo Number os Loops

Depois de adicionar esse componente, precisamos ajustar o fluxo, clicando no círculo preenchido do componente AtendimentoProdução e arrastando para o círculo não preenchido do comando Say/Play. Na sequência, você precisa clicar no círculo do Audio Complete e arrastar para o círculo do "AtendimentoProdução".

Pronto, com essa configuração, ao receber uma nova chamada o fluxo vai começar falando o texto e na sequência vai direcionar para o agente do DialogFlow.

Veja a tela a seguir com os detalhes da configuração do widget do agente:

O Connector Name deve corresponder ao nome que você configurou ao conectar a integração da Twilio. Veja também que o idioma (Language) está configurado para Portuguese - Brazil.

Atendendo em múltiplos idiomas

Uma outra solução interessante que você pode implementar é ter o atendimento com múltiplos idiomas, mas mantendo o mesmo agente.

Como temos a opção de sintetizar um texto, vamos alterar o componente de Play/Say, mantendo em português e solicitando que quem ligou pressione 1 para Português e conectá-lo a um componente chamado Gather Input on Call para que o usuário pressione algum dígito. Ao final, vamos usar outro componente chamado Split Based On... para verificar qual dígito foi pressionado.

No componente Gather Input on Call você pode adicionar um texto para ser falado e escolher tanto o idioma (language) quanto a voz (voice). Vamos definir aqui o campo language como English (US) e o campo voice como Alice para manter o mesmo tom de voz. Para o campo Text to Say, preencha If you want help in English, press two.

Este componente também permite que o usuário fale algum comando ou pressione algum dígito. Vamos considerar apenas dígitos nesse exemplo. Outra configuração importante aqui é que você precisa definir o campo Stop Gathering After para 1, ou seja, quando o usuário pressionar um único dígito, ele vai seguir o fluxograma.

Veja como vai ficar a ligação entre os widgets na imagem a seguir:

E também os parâmetros do Gather Input On Call:

Você pode ligar a saída do No Input com o primeiro widget Say/Play, criando um loop para que o usuário continue apenas quando pressionar 1 ou 2 no telefone.

Vamos ligar a saída do User Pressed Keys em outro componente chamado Split Based On.... Esse componente vai permitir criarmos um seletor com base no número pressionado. Arraste o componente para o grid e faça os passos a seguir.

Quando você clicar no componente no grid aparecerão as configurações conforme a imagem acima. Além do nome do widget que definimos como seleciona_idioma, vamos escolher qual variável utilizaremos para fazer as comparações. No campo Variable to Test você vai clicar para abrir a lista de opções e escolher o subitem Digits do item gather_1. No final o texto vai ficar como widgets.gather_1.Digits. Uma vez que tenha definido a variável, vamos criar as comparações.

Clique no botão New do componente e em seguida na opção Condition Matches. A barra lateral será alterada para a imagem a seguir:

Observe que o campo Comparing With está definido para a variável de dígitos que escolhemos na etapa anterior.

Para continuar, no bloco If Value Equal_TO..., no campo Enter Value..., informe 1.

Na sequência, clique no botão + de New Condition e um novo bloco de comparação será exibido. Deixe o parâmetro de comparação como Equal To e no campo Enter Value..., informe 2. Se você conferir o componente vai perceber que ele agora tem duas conexões.

Clique no componente do agente (Connect Virtual Agent) e faça um CTRL-C e CTRL-V. Com o componente duplicado, clique no segundo e altere o idioma para English e conecte as saídas do widget Split Based On... para os valores 1 e 2 nos componentes correspondentes.

Veja como vai ficar a conexão:

Pronto. Agora é clicar no botão Publish para salvar sua URA e vermos como incluir o segundo idioma no DialogFlow e testar a ligação.

Adicionando um novo idioma no DialogFlow

No topo do menu lateral esquerdo ao lado do idioma, clique no botão +. Na tela seguinte, dentro da caixa de seleção Select Additional Language escolha English - en e clique em Save e um novo idioma vai aparecer no menu, da mesma forma que a imagem abaixo:

Clique no novo idioma para configurar seus intents e pronto.

Agora é só testar!

Se você quiser copiar este fluxo do Twilio Studio e testar na sua própria conta, copie e cole este arquivo JSON na tela que aparece quando clicar na opção Show Flow JSON das configurações do Trigger.

Conclusão

Essa conexão de 1 clique entre o DialogFlow e a Twilio trouxe simplicidade para integração de interfaces de conversação, mas é sempre importante que você se preocupe com a experiência do usuário. Criar uma conversação que faça sentido e que seja natural para quem está do outro lado da linha vai trazer melhores resultados, conversões e satisfação para seus clientes.

Se você ainda não testou os serviços de voz da Twilio, fica aqui meu convite para fazê-lo. E se você já tem algum projeto que vai implementar, me conte mais através do e-mail lleao@twilio.com.

Estou ansioso para ver o que você vai construir!