Links

Assistant by Dialogflow

The Assistant component by Google's Dialogflow gives you the power of a Google Home or Amazon Alexa all from the comfort of your mobile device's built-in microphone.

Getting Started

Create a free Dialogflow account

Create a New Agent

An agent is the voice-enabled chatbot that is programmed to listen and respond to your given conversation
You'll have the option of selecting a default listening language

Add an Assistant component to Thunkable

To add an Assistant component to your app:
  • Go to your Blocks tab
  • Find the Advanced drawer of blocks. Click the drop-down menu icon to show the Advanced invisible components
  • Click the ⊕ icon next to the Assistants drawer
You will see a dialog with options to enter certain properties for your Assistant component. Click Submit to create the Assistant component, or Delete to dismiss the dialog without creating the component.

Editing your Assistant Component's properties

Once you have added at least one Assistant component to your app, you will be able to view all of your Assistant components under the Assistants drawer in the Advanced section of the Blocks tab.
To edit the properties of an Assistant component, click on the ⚙ icon next to the component's name to bring up the properties dialog. You will be able to change the properties and click Submit to save your changes, or click Delete to delete the component.

Connect Your Dialogflow Agent with Thunkable

There are 3 fields you'll need to fill out on the Thunkable properties panel to connect it to Dialogflow: Client Email, Private Key and Project Id.

Project Id

To get the Project Id, simply navigate to the ⚙settings on your Dialogflow account.

Client Email and Private Key

To get the Client Email and Private Key, will require you to create a new Google Cloud Platform Service Account. This is a bit of an extra step but it is put in places to provide extra security so that Google knows it is only you accessing your app.
To get to the Google Cloud Platform, simply click on the Service Account link that is below the Project Id field.
That will take you to the page below on the Google Cloud platform account.
Make sure you are signed in with the same Google account otherwise you may get an error
After signing in, select the three-dotted menu button and select the option to Create key.
It will then prompt you to select the format of the key. Select JSON and select Create.
This will download the JSON file to your computer.
Open the JSON file in your favorite text editor and you'll find the Client Email and Private Key as fields in the file. Copy and paste these to the appropriate fields in your Assistant properties panel on Thunkable.
Phew! That's it for set-up. You are now ready to program your Assistant.

Program the Assistant

Create intents and responses

The magic of the Assistant component is that it can listen for certain spoken phrases or intents and trigger a response based on those phrases. The more intents The more intents that you create, the more commands or questions the Assistant will be able to respond to. Since the Assistant is powered by a breakthrough technology called natural language processing, the user won't have to always say exactly what is specified in the intents (although the more expressions the better).
To program an intent, you simply create new intents in the Dialogflow interface.
Intents are meant to trigger a specific response, and for most users, this will simply be a simple text response.
The text response above can then be programmed with Thunkable blocks to complete a certain action e.g. play a specific sound file as in the sample app, Dad.
The text response you program in Dialogflow is the same as the value output of the Start listening block on Thunkable as shown below.
The following event blocks are available to program into your app on Thunkable.
Event
Description
Start Listening
Asks the Assistant to start listening to a voice query. You must use both the Start Listening and Stop Listening events to. When it detects a programmed intent, it will respond accordingly with a value if it's a text response or with an action (see below)
Stop Listening
Asks the Assistant to stop listening to a voice query
Query (text)
Submits a query to the Assistant in text form

Create an action

For more advanced users, Dialogflow also allows you to program actions in the following 3rd party applications. Each application has a different integration process so follow the instructions carefully if you want to use this option.

Select listening language

The agent is currently available to understand the following languages with more added periodically (apologies if the list below is not up to date):
Property
Description
Language
Refers to both the language recognized by the Assistant and the language which it speaks aloud. Currently available: ENGLISH,ENGLISH_GB, ENGLISH_US,CHINESE_CHINA,CHINESE_HONGKONG,CHINESE_TAIWAN,DUTCH, FRENCH,GERMAN,GREEK,ITALIAN,JAPANESE,KOREAN,PORTUGUESE,PORTUGUESE_BRAZIL,RUSSIAN,SPANISH,UKRANIAN
To change the language, simply change it in the Assistant properties panel and in your Dialogflow dashboard