This is a simple demonstration using GoogleCloud-functies and Flows to do image recognition on an image sent on Telegram.

Flows en verder

Als ontwikkelaar van Flows denk ik vaak na over wie onze gebruikers zijn, waarom ze Flows gebruiken en wat ze nodig hebben om hun doelen te bereiken; en vervolgens, welke functies we moeten implementeren om die gebruikers het beste van dienst te zijn.

Flows is a powerful drag-and-drop automation engine for creating communication flows. We initially conceived it as a no-code solution, but we found many users could get really powerful behavior writing some code for specific use-cases.   These bits of code can be inside Flows, or they can be 3rd party cloud functions like AWS Lambda functions or Google Cloud Functions. 

An interesting use case: Image Recognition 

In een kort en grappig voorbeeld laat ik je zien hoe je een app implementeert die hotdogs herkent. We zetten een flow op in Flows, die afbeeldingen van gebruikers ontvangt en beslist of ze een hotdog hebben gestuurd of niet.

For many of our customers, this type of image recognition can be very powerful. Imagine you run a delivery service and you wanted to verify successful deliveries automatically. Similar to what I’m going to show, you could use location data, photos of parcels, and even recipient signatures to create a verification flow in Flows. 

Een plan voor succes

First, we will set up a cloud function, which receives a request with a URL to an image, then it uses an image recognition API to process the image,  and responds whether there is a hotdog in the image or not.

Vervolgens bouwen we een flow, die een bericht ontvangt van een gebruiker via een berichtenkanaal (Telegram in dit geval), de bovenstaande cloudfunctie uitvoert, en de gebruiker antwoordt of er een hotdog in een door hem verstuurde foto zit.

De Google Cloud-functie instellen

First,  we will need to set up a cloud function. To get started quickly, create a cloud function using this tutorial: https://cloud.google.com/functions/docs/quickstart-console. As a ‘Trigger’ choose HTTP trigger, execution environment: Node.js 10, and in the source code field insert het codefragment. It’s simple code, which checks whether the request contains JSON code and answers yes or no. 

Next, you’ll need to deploy this function. To test it inside Google Cloud Platform, follow steps from the tutorial. 

‍

Om vanuit uw browser te testen, gaat u naar de volgende URL en voegt u het specifieke adres voor uw functie in:

https://uw-functie-adres.cloudfunctions.net/HotDogOrNot/?url=hello should return {“isHotDog”: true} and the address https://uw-functie-adres.cloudfunctions.net/HotDogOrNot should return {“isHotDog”: false}.

Goed gedaan! Je hebt een google cloud functie opgezet. Nu moeten we onze cloud functie slimmer maken.

De Google Vision API instellen

To make it smarter let’s add image recognition. For this purpose we will use the Google Vision API. To get started, follow steps 1-4 of this tutorial: https://cloud.google.com/vision/docs/quickstart-client-libraries. In the tutorial you’ll activate the Vision API and create a service account to use it.

Ga nu terug naar de cloudfunctie die u hebt aangemaakt. Schakel "Omgevingsvariabelen, netwerken, time-outs en meer" en kies in het bestand "Serviceaccount" de VisionAPI-serviceaccount die u zojuist hebt aangemaakt. Nu hebben we toegang tot de Vision API in onze functie.

Now let’s change the code. On a “Package.json” tab, insert deze code. It will add Google Vision API library as a dependency to your function, and on "Index.js" tab update existing code with het volgende stukje code.

What’s the difference compared naar de previous version? We added a request to VisionAPI, which returns the "labels it found on the image.  Then we filter these labels by description: if it contains “hot dog” and if it has greater than 60% confidence in that label. If there is at least 1 label remaining after filtering, that means we found a hotdog on the image.

To understand how Google VisionAPI works and how the response looks like check their documentation, https://cloud.google.com/vision/docs

After that, deploy the new version of our function. To test it from your browser, find any image of a hotdog and save it's URL. Now go to URL of your function (inserting the correct address for your function) https://your-function-address.cloudfunctions.net/HotDogOrNot?url=url_to_image and replace the  “url_to_image” with a URL naar de found image. If there is a hotdog in the image, the page will return {“isHotDog”: true}.

Laten we nu deze functie verbinden met Flow Builder.

Een stroom creëren in Flows

Log in into the Bird Dashboard or aanmelden voor een account if you don’t have one.

Als je nieuw bent op Flows en je hebt nog geen channels ingesteld, moet je naar de pagina Kanaal instellen gaan en kiezen om het Telegram-kanaal in te stellen. Ik heb Telegram gekozen voor deze demo omdat het makkelijk en snel op te zetten is.

Nu heb je een kanaal dat we kunnen gebruiken in Flows. Ga naar de pagina Flows , maak een nieuwe aangepaste stroom en kies de kanaaltrigger "Telegram".

Je wordt doorgestuurd naar een flow pagina, waar je je Telegram kanaal als trigger moet kiezen, in ons geval is dat "Hotdog". Voeg 2 stappen toe: "Fetch variables" en "Reply to channel message".

Inside the “Fetch variables” step we will call our cloud function and retrieve response into variable “isHotDog” which will contain “true” or “false” as a response from the GoogleClound function. In URL field please insert URL to your function https://your-function-address.cloudfunctions.net/HotDogOrNot and fill all other fields as on the "Fetch variable step content" picture.

And inside the “Reply to channel message” step we will respond to the customer with a message containing the yes or no response. For that insert in "Reply with message" field the following text "Hotdog on the image? {{isHotDog}}".

‍

If you have any trouble building the flow, you can export it from file: simple-hotdog-flow.json.

To test it, send an image to your Telegram bot.

So far, it looks cool! We created a small chat bot, which checks images customers sent. To make it prettier, let’s add some more steps as shown below: 

If you have any trouble building the flow, you can export it from file: advanced-hotdog-flow.json.

Resultaten

While this is a fun example, we believe this type of functionality can be very useful for our users. 

If you want more features like this built-in in Flows, write to our support team to let us know.