Os chatbots estão se tornando uma ferramenta cada vez mais vital para as empresas na era moderna. Com as ferramentas e know-how certos, as empresas criam agentes de chat que podem ter conversas reais com os clientes.
O Google Dialogflow ES é uma das ferramentas de criação de chatbots mais poderosas e gratuitas do mercado. Mas como você pode liberar todo o seu potencial?
Etapa 1: criar seu agente do Dialogflow ES
Criar seu próprio agente do Dialogflow ES é a primeira etapa desse processo. Qualquer conta do Google funciona, e você começa navegando até o Site do Google Dialogflow ES. Clique em Criar agente depois de fazer login e preencher os detalhes no formulário antes de clicar Crio. Você pode usar o Dialogflow para criar um chatbot para entretenimento, automação ou atendimento ao cliente. Este projeto abrange o último.
Etapa 2: adicionar intents de acompanhamento do Dialogflow
O novo agente tem apenas uma intenção de boas-vindas padrão e uma intenção de fallback padrão. Uma intenção é um fragmento ou estágio em uma conversa.
Você precisa adicionar duas intenções de acompanhamento à intenção de boas-vindas padrão existente para começar. Passe o mouse sobre Intenção de boas-vindas padrão, Clique em Adicionar intenção de acompanhamento, e escolha Sim no menu suspenso. Repita o processo selecionando Não no menu suspenso para criar a segunda intenção de acompanhamento.
A intenção Sem acompanhamento encerrará a conversa e se despedirá do usuário. Abra o Sem intenção de acompanhamento e adicione uma série de respostas de texto para encerrar a conversa. Ative o Definir esta intenção como o fim da conversa controle deslizante.
Volte para a tela principal de Intenções e clique no botão Sim intenção de acompanhamento para abri-lo.
Etapa 3: criar uma lista avançada de respostas do Dialogflow com JSON
Agora que você configurou essas intenções, é hora de fazer uma pergunta ao usuário para que ele possa acessá-las. Abra o Intenção de boas-vindas padrão e Excluir as respostas que gerou. Clique Adicionar respostas e selecione Carga útil personalizada do cardápio.
O código JSON abaixo adiciona dois tipos diferentes de respostas avançadas; informações e fichas.
{
"ricoConteúdo": [
[
{
"tipo": "chips",
"opções": [
{
"texto": "Sim"
},
{
"texto": "Não"
}
]
},
{
"imagem": {
"src": {
"rawUrl": "https://upload.wikimedia.org/wikipedia/commons/thumb/5/50/TK_email_icon.svg/1024px-TK_email_icon.svg.png"
}
},
"title": "Fale-me sobre você :)",
"subtitle": "Dê-me algumas de suas informações pessoais. Vou enviar para você em um e-mail. Este é o acordo; absolutamente nenhum negócio engraçado. Promessa! Você está?",
"tipo": "informações"
}
]
]
}Etapa 4: coletar o nome do usuário como um parâmetro do Dialogflow
Em seguida, é hora de adicionar outra intenção de acompanhamento para coletar dados do usuário. Conforme descrito na Etapa 2, você já deve ter uma intenção de acompanhamento Sim que solicite o nome do usuário. Passe o mouse sobre Sim intenção de acompanhamento no menu principal de intents, clique em Adicionar intenção de acompanhamento, e selecione Personalizado da lista.
Isso criará uma nova intenção de acompanhamento sem nenhuma frase de treinamento. Vá para a seção Frases de Treinamento, digite um nome na caixa e pressione Enter para adicioná-lo como uma nova frase. Isso acionará a criação de um novo parâmetro com o tipo de entidade @sys.person. Clique no @sys.person entidade e alterá-lo para um @sys.given-name entidade.
Isso armazenará a entrada do usuário para que o agente possa usá-la. Vá para a seção Respostas e adicione uma resposta com $nome dado dentro dele. Isso chama o parâmetro name que você coletou, permitindo que ele apareça no chat.
Etapa 5: usar um payload personalizado do Dialogflow para acionar intents
Permanecendo na intenção de acompanhamento que você acabou de adicionar, clique em Adicionar respostas e selecione Carga útil personalizada na lista. Adicionar o código JSON abaixo a esta seção acionará uma resposta rica em lista solicitando que o usuário escolha uma cor.
A parte mais importante desse código JSON é a seção de eventos com cada entrada. Quando clicado, cada item da lista chama um evento chamado COLOR com o nome e os parâmetros de cor que foram coletados até o momento. Os intents podem ter eventos atribuídos a eles que os acionarão.
{
"richContent": [
[
{
"evento": {
"languageCode": "pt",
"parâmetros": {
"nome": "$nome dado",
"cor": "Vermelho"
},
"nome": "COR"
},
"título": "Vermelho",
"modelo": "Lista"
},
{
"modelo": "divisor"
},
{
"evento": {
"nome": "COR",
"languageCode": "pt",
"parâmetros": {
"nome": "$nome dado",
"cor": "Verde"
}
},
"modelo": "Lista",
"título": "Verde"
},
{
"modelo": "divisor"
},
{
"modelo": "Lista",
"título": "Azul",
"evento": {
"languageCode": "pt",
"nome": "COR",
"parâmetros": {
"nome": "$nome dado",
"cor": "Azul"
}
}
}
]
]
}Etapa 6: mover parâmetros do Dialogflow entre intents
Volte ao menu principal de Intenções e clique em Criar intenção. Dê um nome à sua nova intenção e digite COR na seção de eventos antes de bater Digitar.
Vá para a seção Frases de Treinamento e adicione um nome e uma cor à lista de frases para acionar a criação de novos parâmetros. Mudar o @sys.person entidade de parâmetro para um @sys.given-name entidade e certifique-se de que a entidade de cor esteja definida como @sys.color.
Agora você pode adicionar algumas respostas usando $given-name e $color para que as entradas do usuário apareçam na janela de bate-papo.
Por fim, volte para o Contextos seção na parte superior da página e adicione uma saída com um nome exclusivo. Isso passará os parâmetros desse intent para o próximo.
Etapa 7: coletar o país e o número de telefone do usuário como parâmetros do Dialogflow
Volte para o menu principal de Intenções, passe o mouse sobre o Intenção de cor você acabou de criar e clique em Adicionar intenção de acompanhamento. Verifique a seção Contextos da nova intenção. Certifique-se de que inclui o contexto de cor que você criou na última etapa nas seções de entrada e saída. Adicione outro contexto de saída para a intenção atual.
Vou ao Frases de treinamento seção e adicione o nome de um país à lista antes de clicar Digitar. Isso criará um novo parâmetro. Altere o tipo de entidade do parâmetro para @sys.geo-country antes de adicionar o parâmetro à seção de resposta.
Volte ao menu principal de Intenções e crie uma nova intenção de acompanhamento para a intenção que você acabou de criar. Repita as etapas que acabou de seguir, mas use um número de telefone no Frases de treinamento seção. Certifique-se de que o parâmetro gerado tenha um @sys.phone-number tipo de entidade.
Volte ao menu principal de Intenções e crie duas novas intenções de acompanhamento para a intenção que você acabou de criar; a Sim e Não intenção de acompanhamento. Você pode definir a intenção Sem acompanhamento para encerrar a conversa.
A intenção de acompanhamento Sim precisa ter todos os Contextos das intenções anteriores que você criou.
Por fim, volte ao menu principal de intenções e crie uma nova intenção de acompanhamento para a intenção de acompanhamento Sim que você acabou de criar. Adicione um endereço de e-mail à seção Frases de treinamento e certifique-se de que o parâmetro gerado tenha @sys.email como seu tipo de entidade.
Vou ao Respostas seção, clique Adicionar respostas, e selecione Carga útil personalizada da lista. O código JSON a seguir adicionará uma resposta avançada do tipo lista que chama um evento chamado SENDEMAIL. Todos os parâmetros do usuário solicitados até agora serão enviados para essa intent.
{
"richContent": [
[
{
"título": "Enviar email",
"evento": {
"parâmetros": {
"nome": "#Color-followup.name",
"país": "#Color-country-followup.country",
"o email": "$e-mail",
"cor": "#Color-followup.color",
"telefone": "#Color-country-phonenum-followup.phone-number"
},
"nome": "ENVIAR EMAIL",
"languageCode": "pt"
},
"modelo": "Lista"
}
]
]
}Etapa 8: enviar um e-mail usando o editor embutido Node.js do Dialogflow
Clique Criar intenção no menu principal de Intenções. Adicionar ENVIAR EMAIL para o Eventos seção e bater Digitar. Siga isso adicionando todos os parâmetros que você coletou ao Ação e parâmetros seção.
Vou ao Cumprimento seção na parte inferior da página e ative o controle deslizante rotulado Ativar chamada de webhook para esta intent. Isso permitirá que você adicione código personalizado a essa intent.
Selecionar Cumprimento no menu principal à esquerda da página e ative o controle deslizante para ativar o Editor em linha. Talvez seja necessário adicionar uma conta de faturamento ao seu projeto do Google para fazer isso.
Clique no pacote.json guia e role até a parte inferior do arquivo. Substitua a seção de dependências pelo código a seguir para adicionar a API Nodemailer ao seu projeto.
"dependências": {
"ações no google": "^2.2.0",
"administrador do firebase": "^5.13.1",
"funções do firebase": "^2.0.2",
"fluxo de diálogo": "^0.6.0",
"nodemailer": "^4.4.2",
"realização de fluxo de diálogo": "^0.5.0"
}
Volte para o arquivo index.js e substitua o código existente pelo exemplo encontrado em este projeto CodePen antes de clicar Implantar. Você precisará substituir as credenciais do Gmail pelas de sua própria conta. Você precisa usar uma senha de aplicativo para isso. Depois de concluído, seu chatbot enviará por e-mail todos os detalhes que você coletar para o usuário no final de uma conversa bem-sucedida. Você pode saiba mais sobre o Node.js e como usá-lo com nosso guia prático.
Como usar o Dialogflow ES em seu site
Seu novo chatbot pode coletar informações do usuário e enviar e-mails, mas o Dialogflow ES pode fazer muito mais. Você pode conectar praticamente qualquer API a esse serviço e usar a API do Dialogflow para controlar seu chatbot em seu próprio site.
