Criando um Chatbot com Flutter e DialogFlow

Notas de aula do prof. Kleber de Oliveira Andrade

Um chatbot é um programa que pode conduzir uma conversa inteligente. Deve ser capaz de simular de forma convincente o comportamento humano.

Ao contrário do que muitos acreditam, os robôs de conversação (chatbots) não são uma novidade exclusiva do século XXI. Na década de 1950, o artigo “Computing Machinery and Intelligence,” publicado por Alan Turing, ganhou notoriedade por apresentar uma questão “seriam as máquinas capazes de pensar?”.

Para responder esta pergunta, Turing criou um método para verificar a capacidade de uma máquina de se comportar de forma equivalente a um ser-humano. Este método, popularmente chamado de Teste de Turing (ou Jogo da Imitação), tornou-se um estopim para os primeiros experimentos de chatbots desenvolvidos no campo acadêmico inicialmente.

Filme — O jogo da imitação

Segue uma lista dos principais chatbots , mas, eles não os únicos:

• Eliza (1964): criado no laboratório de Inteligência Artificial da MIT. Sua ideia básica era simular uma conversa entre um humano (pacientes) e uma máquina (psicólogo) —publica no artigo Computational Linguistics por Joseph Weizenbaum (1965).
• Parry (1972): simulou inexplicavelmente uma pessoa com esquizofrenia, descrita como a “Eliza com atitude”;
• Jabberwacky (1988): uma das primeiras tentativas de interação entre os humanos e a inteligência artificial;
• Dr. Sbaitso (1992): desenvolvido para MS-DOS para assumir um papel de “conselheiro”;
• A.L.I.C.E (1995): criada sobre padrões de descoberta para se adaptar a diferentes tipos de conversação;
• Smarterchild (2001): sistema inteligente amplamente utilizado para as mensagens via SMS;
• IBM’s Watson (2006): projetado especificamente para participar de um programa de perguntas e respostas da TV norte-americana, o Jeopardy. O Watson foi uma revolução, vencendo a edição 2011 e deixando dois antigos campeões para trás;
• Siri (2010): assistente virtual da Apple;
• Google Now (2012): assistente virtual do Google;
• Alexa (2015): serviço de voz da Amazon disponível em milhares de dispositivos;
• Cortana (2015): assistente virtual da Microsoft;
• Bots for Messenger (2016): plataforma do Facebook que permite a criação de bots para interagir com os contatos.

Fique agora com um vídeo explicativo do Nerdologia sobre Chatbots

DialogFlow

DialogFlow é uma das diversas plataformas que fornecem novas maneiras de interagir com seu produto criando interfaces conversacionais baseadas em voz e texto, como aplicativos de voz e chatbots com tecnologia IA.

O diagrama abaixo mostra como o api.ai está relacionado com os componentes e a forma como ele processa os dados:

api.ai — Diagram

O api.ai recebe uma query que é texto em linguagem natural ou um nome de evento enviado para plataforma como dados de entrada, que é transformado em seguida em actionable data e retorna dados de saída. O processo de transformar a linguagem natural em dados acionáveis ​​como contextos e propriedades de intenções, é chamado Natural Language Understanding (NLU).

Conceitos

Agente: Os agentes podem ser descritos como sendo o módulo NLU. Seu objetivo é transformar o idioma natural do usuário em dados acionáveis.

Entidades: As entidades representam conceitos e servem como uma poderosa ferramenta para extrair valores de parâmetros de entradas de linguagem natural.

Contextos: Contextos são cadeias de caracteres que representam o contexto atual do pedido de um usuário.

Parâmetros: As ações podem ter parâmetros para extrair informações das entradas de usuários.

Intenções: Uma intenção representa um mapeamento entre o que o usuário diz e quais ações devem ser tomadas pelo seu software.

As interfaces de intenção possuem as seguintes seções:

• Usuário diz
• Ação
• Resposta
• Contextos

O api.ai disponibiliza um passo a passo para tornar o processo de criação e integração de interfaces de conversação, o mais simples possível.

Cadastrando-se no Dialogflow

Para começar você precisa ter uma conta no Google e criar uma conta no Dialogflow

• Acessar https://dialogflow.com e criar uma conta
• Depois de criar a conta, vá ao canto superior direito do site, clique em “Ir para o console”.

Criando um Agente

Vamos criar um agente do Dialogflow, clique no canto superior direito em “Create Agent”

Logo em seguida, preencha o nome do agente, a linguagem default, o time zone e em qual projeto vai usar o seu chatbot (Create a new Google Project).

Criando uma Intent

Quando você cria um agente, ele já vem com duas Intents:

• Default Fallback Intent: para quando ele não compreende o que o usuário disse
• Default Welcome Intent: para saudar o usuário em sua primeira mensagem.

Para criarmos uma Intent, clique no botão Create Intent e adicione o nome “definição” no campo Intent Name. Na seção Training phrases, adicione as seguintes sentenças:

• Onde você trabalha?
• Quais empresas você da aula?
• Trabalha em quais faculdades professor?

Na seção Responses adicione a sentença:

• Eu trabalho na Fatec Americana e Unisal Campinas
• Faculdade de Tecnologia de Americana e Centro Universitário Salesiano de São Paulo, campus Campinas/São José

Quando você cadastra mais de uma resposta, significa que o DialogFlow pode alterar entre as respostas.

Clique no botão Save

Testando o chatbot

Vamos fazer um rápido teste do nosso chatbot. No lado direito do Console tem uma opção Try it now. Clique neste campo de texto e digite Trabalha onde?

Observe que perguntamos a ele Trabalha onde? e não Onde você trabalha? cadastrado anteriormente. Mesmo com algumas variações na entrada do usuário, ele responde corretamente.

Caso você queira saber mais sobre DialogFlow, recomendo o curso do professor Rogério Guimaraes que esta disponível na Udemy

Criando o Aplicativo

Abra o Visual Studio Code, e abra a paleta de comandos (Ctrl + Shift + P) e digite: Flutter: New Project

• Digite o nome do projeto Flutter (chatbot);
• Selecione a pasta para criar o projeto Flutter;

Estrutura do projeto

Dentro do projeto teremos um diretório chamado lib, e a árvore de arquivos deve ser como a apresentada abaixo:

Dependências

No arquivo pubspec.yaml adicione as seguintes dependências para este projeto

Sobre as dependências:

• flutter_dialogflow: https://pub.dev/packages/flutter_dialogflow

Classe ChatMessage

Crie uma classe ChatMessage (lib → models→ chat_message.dart), que servirá como modelo para persistência das mensagens. Adicionaremos também um enum para identificar se a mensagem foi enviada (sent) ou recebida (received).

Classe ChatMessageListItem

Crie uma classe ChatMessageListItem (lib → widgets → chat_message_list_item.dart), que será um StatelessWidget para exibir a mensagem do usuário que esta enviando (mensagem a direita) e das mensagens recebidas (mensagem a esqueda).

Classe Principal

Vamos atualizar o arquivo main.dart

Vale ressaltar que a classe HomePage ainda não existe, por isso o arquivo terá um erro neste momento. Se quiser já resolver este problema, é só criar a classe HomePage (StatefulWidget)

Classe HomePage

Crie uma classe HomePage (lib → views→ home_page.dart), que exibirá uma lista (ListView) de mensagens e uma forma de enviar mensagens (TextField e IconButton).

O método _dialogFlowRequest ainda não foi implementado, pois ele depende de integrarmos o DialogFlow com o Flutter, e para isso, teremos que utilizar o Google Cloud Platform (GCP)

Integrando o DialogFlow

Agora, queremos integrar nossas Intents do DialogFlow recém-treinada no nosso aplicativo

• Vá para o Google Cloud Platform (GCP) acessando o link https://cloud.google.com

Caso não tenha uma conta, crie uma — será exigido um cartão de crédito para criar a conta, mas só será cobrado algo, caso você utilize recursos pagos.

• Clique em Console após fazer o login, e selecione o projeto com o mesmo nome que colocou no DialogFlow (no meu caso é chatbot).

• Acesse agora API e Serviços → Credenciais

• Você já vai ter uma conta de serviço criada por padrão. Clique nela

• Clique em criar → mantenha o json (será feito automaticamente um download das suas credenciais para se conectar no serviço — eu vou renomear o meu arquivo para credentials.json)

• No seu projeto, crie uma pasta e nomeie-a como assets
• Mova o arquivo de credenciais (arquivo JSON) que você baixou do Google Cloud Platform (GCP) para a pasta assets.
• Abra o arquivo “pubspec.yaml” e configure-o conforme imagem

NOTA: O caminho deve ser o mesmo em nosso arquivo pubspec.yaml (“assets / credentials.json”)

• Vamos agora finalizar o método _dialogFlowRequest da classe HomePage

Resultados

Agora, aperte F5 para iniciar a depuração do projeto

Selecione um emulador existente ou crie um novo se for necessário. Se seu celular estiver plugado no computador e com o modo desenvolver ativado, você poderá rodar o aplicativo direto no celular.

Conseguiu chegar até aqui? Parabéns, você acaba de criar um chatbot!

O código completo pode ser baixado aqui.

Espero que tenham gostado, deixem seus comentários abaixo e um forte abraço!

Desafios

• Melhorar a exibição das mensagens, aplicando um Clippy no estilo Whatsapp (se quiser, pode utilizar o clippy_flutter)
• Adicionar data/hora de recebimento ou envio das mensagens (DateTime class)
• Fazer o TextField de envio de mensagens ser igual ao do Whatsapp (borda redonda)
• Criar um novo projeto de chatbot para um problema que deseja resolver e adicionar pelo menos 10 Intents
• Utilizar pelo menos 1 Entities no DialogFlow (tutorial de como usar)

Leitura complementar

• Documentação do DialogFlow (Oficial)
• Dialogflow Completo-Domine a Criação de Assistentes Virtuais (Curso na Udemy — Pago)
• Bots Brasil — Comunidade Discussões sobre ChatBots, PLN, IA, Facebook Messenger, Slack, Telegram
• Um guia para desenvolvedores de chatbots (Michael Yuan)
• Google e os cinco sentidos (Ricardo Ogliari)