O que é o Flow Builder?

O Flow Builder (ou Flows) é a engine de automação visual da Bird para criar fluxos de comunicação entre canais — sem a necessidade de código, embora possa ser estendido com código personalizado.

Por que usar o Google Cloud Functions com Flows?

As Cloud Functions permitem que você execute código sem servidor para processar dados (como analisar imagens ou buscar dados de APIs externas) e alimentar os resultados de volta em seu fluxo.

O que a API do Google Vision faz nessa configuração?

Ele realiza análise de imagem — identificando objetos, rótulos ou conceitos (como “hot dog”) — e retorna dados estruturados para o seu Fluxo.

Como conecto uma Função em Nuvem ao Flow Builder?

Use a etapa Buscar Variáveis para chamar o endpoint HTTPS público da função. A resposta (por exemplo, { "isHotDog": true } ) pode ser usada em etapas posteriores.

Isso pode ser usado para casos reais de negócios?

Absolutamente. A mesma abordagem pode validar fotos de entrega, detectar itens danificados, reconhecer documentos ou verificar mídias enviadas.

O que torna esta integração poderosa?

Ele combina visão de IA , flexibilidade sem servidor e comunicação multicanal , permitindo automações mais inteligentes sem a necessidade de manutenção de infraestrutura.

Preciso de experiência em programação para acompanhar?

Uma familiaridade básica com JavaScript (para a Função do Google Cloud) ajuda, mas a maior parte do processo — desde a conexão de canais até a lógica de fluxo — é visual e amigável para iniciantes.

Como usar Flows com a Google Vision API e Google Cloud Functions

Pássaro

6 de out. de 2020

Construtor de Fluxo

1 min read

Como usar Flows com a Google Vision API e Google Cloud Functions

Principais Conclusões

- Flows é mais do que uma ferramenta sem código — é um mecanismo de automação flexível que permite estender fluxos de trabalho com código usando serviços externos como Google Cloud Functions ou AWS Lambda.
- Este tutorial demonstra como construir um chatbot do Telegram que utiliza Google Vision API para identificar imagens (como detectar se uma foto contém um cachorro-quente 🥪).
- O exemplo mostra como Flows pode facilmente se conectar a APIs de reconhecimento de imagem para processar automaticamente o conteúdo enviado pelo usuário.
- Desenvolvedores podem aproveitar essa arquitetura para construir automação do mundo real, como verificação de entregas, verificação de identidade ou fluxos de trabalho de controle de qualidade.
- Integrar o Google Vision API dentro de uma Cloud Function possibilita insights potencializados por IA (detecção de objetos, confiança na etiqueta, extração de metadados) que o Flows pode usar dinamicamente.
- O passo “Buscar Variáveis” no Flow Builder é a ponte — ele chama a função em nuvem e armazena a resposta da API para uso posterior na conversa.
- Blocos de resposta podem usar variáveis como {{isHotDog}} para personalizar respostas, transformando dados brutos em mensagens de chat contextuais.
- Enquanto a demonstração é lúdica, ela demonstra como os desenvolvedores podem misturar lógica sem código com funções serverless para desbloquear poderosas capacidades de automação em canais de mensagens.

Destaques de Perguntas e Respostas

O que é o Flow Builder?
O Flow Builder (ou Flows) é a engine de automação visual da Bird para criar fluxos de comunicação entre canais — sem a necessidade de código, embora possa ser estendido com código personalizado.
Por que usar o Google Cloud Functions com Flows?
As Cloud Functions permitem que você execute código sem servidor para processar dados (como analisar imagens ou buscar dados de APIs externas) e alimentar os resultados de volta em seu fluxo.
O que a API do Google Vision faz nessa configuração?
Ele realiza análise de imagem — identificando objetos, rótulos ou conceitos (como “hot dog”) — e retorna dados estruturados para o seu Fluxo.
Como conecto uma Função em Nuvem ao Flow Builder?
Use a etapa Buscar Variáveis para chamar o endpoint HTTPS público da função. A resposta (por exemplo, { "isHotDog": true }) pode ser usada em etapas posteriores.
Isso pode ser usado para casos reais de negócios?
Absolutamente. A mesma abordagem pode validar fotos de entrega, detectar itens danificados, reconhecer documentos ou verificar mídias enviadas.
O que torna esta integração poderosa?
Ele combina visão de IA, flexibilidade sem servidor e comunicação multicanal, permitindo automações mais inteligentes sem a necessidade de manutenção de infraestrutura.
Preciso de experiência em programação para acompanhar?
Uma familiaridade básica com JavaScript (para a Função do Google Cloud) ajuda, mas a maior parte do processo — desde a conexão de canais até a lógica de fluxo — é visual e amigável para iniciantes.

Flows é um poderoso motor de automação arrastar-e-soltar para criar fluxos de comunicação. Inicialmente o concebemos como uma solução sem código, mas descobrimos que muitos usuários conseguiam comportamentos realmente poderosos escrevendo algum código para casos de uso específicos. Esses pedaços de código podem estar dentro do Flow Builder, ou podem ser funções em nuvem de terceiros, como funções AWS Lambda ou Google Cloud Functions.

Esta é uma demonstração simples usando GoogleCloud Functions e Flows para fazer reconhecimento de imagem em uma imagem enviada pelo Telegram.

Fluxos e Além

Como desenvolvedor de Flows, muitas vezes penso em quem são nossos usuários, por que eles usam Flows e o que precisam para alcançar seus objetivos; e então, quais recursos precisamos implementar para melhor atender a esses usuários.

Flows é um poderoso motor de automação de arrastar e soltar para criar fluxos de comunicação. Nós o concebemos inicialmente como uma solução sem código, mas descobrimos que muitos usuários poderiam obter comportamentos realmente poderosos escrevendo algum código para casos de uso específicos. Por exemplo, você pode criar fluxos que automaticamente geram leads e casos no Salesforce com base em interações dos clientes em vários canais. Esses trechos de código podem estar dentro do Flows, ou podem ser funções de nuvem de terceiros, como funções do AWS Lambda ou funções do Google Cloud.

Um caso de uso interessante: Reconhecimento de Imagem

Para um exemplo curto e engraçado, eu vou mostrar como implementar um aplicativo que reconhece cachorro-quente. Nós vamos configurar um fluxo no Flows, que receberá imagens dos usuários e decidirá se eles enviaram um cachorro-quente ou não.

Para muitos dos nossos clientes, esse tipo de reconhecimento de imagem pode ser muito poderoso. Imagine que você administre um serviço de entrega e quisesse verificar entregas bem-sucedidas automaticamente. Semelhante ao que vou mostrar, você poderia usar dados de localização, fotos de pacotes e até mesmo assinaturas dos destinatários para criar um fluxo de verificação no Flows.

Um caso de uso interessante: Reconhecimento de Imagem

Um plano para o sucesso

Primeiro, configuraremos uma função em nuvem, que recebe uma solicitação com uma URL para uma imagem, então ela usa uma API de reconhecimento de imagem para processar a imagem, e responde se há um cachorro-quente na imagem ou não.

Depois, construiremos um fluxo, que recebe uma mensagem de um usuário através de um canal de mensagens (Telegram, neste caso), executa a função em nuvem acima e responde ao usuário se há um cachorro-quente na imagem que ele enviou.

Configurando a Google Cloud Function

Primeiro, precisaremos configurar uma função em nuvem. Para começar rapidamente, siga o tutorial de início rápido das Funções em Nuvem do Google. Como ‘Disparador’, escolha o disparador HTTP, ambiente de execução: Node.js 10, e no campo de código fonte insira o trecho de código. É um código simples, que verifica se o pedido contém código JSON e responde sim ou não.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Google Cloud Console interface with options for creating a new Cloud Function.

Em seguida, você precisará implantar esta função. Para testá-la dentro da Google Cloud Platform, siga os passos do tutorial.

Para testar a partir do seu navegador, vá para a seguinte URL inserindo o endereço específico da sua função:

https://seu-endereço-da-função.cloudfunctions.net/HotDogOrNot/?url=hello deve retornar {“isHotDog”: true} e o endereço https://seu-endereço-da-função.cloudfunctions.net/HotDogOrNot deve retornar {“isHotDog”: false}.

Bom trabalho! Você configurou uma função em nuvem do Google. Agora precisamos tornar nossa função em nuvem mais inteligente.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Em seguida, você precisará implantar esta função. Para testá-la dentro da Google Cloud Platform, siga os passos do tutorial.

Para testar a partir do seu navegador, vá para a seguinte URL inserindo o endereço específico da sua função:

Bom trabalho! Você configurou uma função em nuvem do Google. Agora precisamos tornar nossa função em nuvem mais inteligente.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (req, res) => {
  let message = req.query.url ? "yes" : "no";
  res.setHeader('Content-Type', 'application/json');
  res.status(200).send(JSON.stringify({ isHotDog: message }));
 };

Em seguida, você precisará implantar esta função. Para testá-la dentro da Google Cloud Platform, siga os passos do tutorial.

Para testar a partir do seu navegador, vá para a seguinte URL inserindo o endereço específico da sua função:

Bom trabalho! Você configurou uma função em nuvem do Google. Agora precisamos tornar nossa função em nuvem mais inteligente.

Configurando a API do Google Vision

Para torná-lo mais inteligente, vamos adicionar reconhecimento de imagem. Para este propósito, usaremos a API do Google Vision. Para começar, siga os passos 1-4 no guia de início rápido da API Vision. No tutorial, você ativará a API Vision e criará uma conta de serviço para usá-la.

Agora volte para a função em nuvem que você criou. Ative "Variáveis de ambiente, rede, tempos limite e mais" e no arquivo "Conta de serviço" escolha a conta de serviço VisionAPI que você acabou de criar. Agora podemos acessar a API Vision dentro da nossa função.

Advanced options interface of a cloud service configuration.

Agora vamos mudar o código. Na aba "Package.json", insira este código. Ele adicionará a biblioteca da API do Google Vision como uma dependência para sua função.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

na aba "Index.js", atualize o código existente com o seguinte trecho de código.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Development environment displaying the code for a package.json file.

Qual é a diferença em comparação com a versão anterior? Adicionamos uma solicitação à VisionAPI, que retorna os ‘rótulos’ encontrados na imagem. Depois filtramos esses rótulos pela descrição: se contiver “hot dog” e se tiver mais de 60% de confiança nesse rótulo. Se houver pelo menos 1 rótulo restante após a filtragem, isso significa que encontramos um hotdog na imagem.

Recursos da API Vision	O que isso habilita em Fluxos
Rótulos de objeto (por exemplo, “hot dog”)	Identificar objetos e automatizar ações com base na detecção
Scores de confiança	Controlar precisão (por exemplo, > 60% de confiança aciona fluxo de trabalho)
Extração de metadados	Incluir contexto como números, objetos e ambiente
Biblioteca expansível	Adicionar mais detecções com poder de IA além de hot dogs

Para entender como a API do Google Vision funciona e visualizar respostas de exemplo, verifique a documentação oficial da API Vision.

Depois disso, implante a nova versão da nossa função. Para testá-la a partir do seu navegador, encontre qualquer imagem de um hotdog e salve seu URL. Agora vá para o URL da sua função (inserindo o endereço correto para sua função) https://seu-endereco-da-funcao.cloudfunctions.net/HotDogOrNot?url=url_da_imagem e substitua o “url_da_imagem” pelo URL da imagem encontrada. Se houver um hotdog na imagem, a página retornará {“isHotDog”: true}.

Agora vamos conectar essa função ao Flow Builder.

Agora vamos mudar o código. Na aba "Package.json", insira este código. Ele adicionará a biblioteca da API do Google Vision como uma dependência para sua função.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

na aba "Index.js", atualize o código existente com o seguinte trecho de código.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Recursos da API Vision	O que isso habilita em Fluxos
Rótulos de objeto (por exemplo, “hot dog”)	Identificar objetos e automatizar ações com base na detecção
Scores de confiança	Controlar precisão (por exemplo, > 60% de confiança aciona fluxo de trabalho)
Extração de metadados	Incluir contexto como números, objetos e ambiente
Biblioteca expansível	Adicionar mais detecções com poder de IA além de hot dogs

Para entender como a API do Google Vision funciona e visualizar respostas de exemplo, verifique a documentação oficial da API Vision.

Agora vamos conectar essa função ao Flow Builder.

Agora vamos mudar o código. Na aba "Package.json", insira este código. Ele adicionará a biblioteca da API do Google Vision como uma dependência para sua função.

{
  "name": "sample-http",
  "version": "0.0.1",
  "dependencies": {
  "@google-cloud/vision": "^1.11.0"
  }
 }

na aba "Index.js", atualize o código existente com o seguinte trecho de código.

/**
 * Responds to any HTTP request.
 *
 * @param {!express:Request} req HTTP request context.
 * @param {!express:Response} res HTTP response context.
 */
 exports.helloWorld = (request, response) => {
  var url = request.query.url || request.body.url;
  if (url == null || url == "" ) {
  response.status(400).json({ error: "Must include a 'url' query parameter." });
  }
  
  
  getImageLabels(url)
  .then(labels => {
  // You can use 'console.log(labels);' command to check labels you got
  // We filter all labels if they contain "hot dog" in label description
  // And have a score > 0.6, which mean that VisionAPI is at least 60% sure that there is a hotdog on a picture
  labels = labels.filter(function(label) {
  return label.description.toLowerCase().includes("hot dog") && label.score > 0.6;
  });
  
  // If labels array contains at least 1 element, then we found a hot-dog!
  if (labels.length > 0) {
  response.status(200).json({isHotDog: true, error: ""});
  } else {
  response.status(200).json({isHotDog: false, error: ""});
  }
  })
  .catch(err => {
  response.status(500).json({ error: err });
  });
 };
  
 async function getImageLabels(imageUrl) {
  // Imports the Google Cloud client library
  const vision = require('@google-cloud/vision');
  // Creates a client
  const client = new vision.ImageAnnotatorClient();
  // Performs label detection on the image file
  const [result] = await client.labelDetection(imageUrl);
  const labels = result.labelAnnotations;
  return labels
 }

Recursos da API Vision	O que isso habilita em Fluxos
Rótulos de objeto (por exemplo, “hot dog”)	Identificar objetos e automatizar ações com base na detecção
Scores de confiança	Controlar precisão (por exemplo, > 60% de confiança aciona fluxo de trabalho)
Extração de metadados	Incluir contexto como números, objetos e ambiente
Biblioteca expansível	Adicionar mais detecções com poder de IA além de hot dogs

Para entender como a API do Google Vision funciona e visualizar respostas de exemplo, verifique a documentação oficial da API Vision.

Agora vamos conectar essa função ao Flow Builder.

Criando um fluxo no Flows

Faça login no Painel do Bird ou inscreva-se para uma conta se você não tiver uma.

Se você é novo no Flows e não configurou nenhum canal, você precisará ir para a página de configuração do Canal e escolher configurar o canal do Telegram. Eu escolhi o Telegram para esta demonstração porque é fácil e rápido de configurar.

Interface titled "Channel setup" with options to integrate communication platforms such as Telegram, Messenger, LINE, WeChat, SMS, WhatsApp, Email, and Instagram.

Agora você tem um canal que podemos usar no Flows. Vá para a página de Flows, crie um novo fluxo personalizado e escolha o gatilho do canal “Telegram”.

User interface for selecting a communication channel trigger, showing options such as Telegram, Facebook Messenger, Email, Incoming Order Activity, and Shopify Order.

Você será redirecionado para uma página de fluxo, onde deverá escolher seu canal do Telegram como o gatilho, no nosso caso é “Hotdog”. Por favor, adicione 2 etapas: “Buscar variáveis” e “Responder à mensagem do canal”.

Dentro da etapa “Buscar variáveis”, chamaremos nossa função em nuvem e recuperaremos a resposta na variável “isHotDog” que conterá “true” ou “false” como resposta da função GoogleCloud. No campo URL insira a URL da sua função https://your-function-address.cloudfunctions.net/HotDogOrNot e preencha todos os outros campos como na imagem do "Conteúdo da etapa de buscar variável".

E dentro da etapa “Responder à mensagem do canal”, responderemos ao cliente com uma mensagem contendo a resposta sim ou não. Para isso, insira no campo "Responder com mensagem" o seguinte texto "Hotdog na imagem? {{isHotDog}}".