Most of the time a text response is used in the chat conversation but Dialogflow allows us to use different messages types as well. e.g Image, Cards and pre-defined options which known as quick replies as well.

Let’s check out how we can use these rich messages one by one. We’ll use Facebook Messenger integration in this guide. Here is a guide to integrating Facebook messenger with Dailogflow.

Images

First, create an intent and then send an image to a user as a response using the below steps.

  • Go to “Intents” from the left navigation and click on “Create Intent”
  • Give it the name “sendImage”
  • Go to the “Training Phrases” section and add what a user might ask to request an image. e.g “please give me screenshot” or “please show me your pic”
  • You can’t store images on the Dialogflow so use any cloud storage or your own web server and store the image and copy the image URL.
  • Go to the “Responses” section and click on Add Response. Now choose “Image” as a response instead of the text response.
  • Paste the image URL and click on Save Intent.
  • Now test it using the right side “try it now” section.

Card

This is a very useful message type to show your products to the user and allow them to buy a product using an action button.

Dialogflow Card Message
  • Go to “Intents” from the left navigation and click on “Create Intent”
  • Give it the name “sendCard”
  • Go to the “Training Phrases” section and add what users might ask to request. e.g “show me your product” or “send me product details”
  • Go to the “Responses” section and click on Add Response. Now choose “Card” as a response.
  • Enter here image URL, card title, card subtitle, action button title, and link to redirect.
  • Now test it using the right side “try it now” section.

Quick Replies

You can give options to the user and they can choose the one to respond back. This is very useful for making a chat conversation easy.

  • Go to “Intents” from the left navigation and click on “Create Intent”
  • Give it the name “sendOptions”
  • Go to the “Training Phrases” section and add what users might ask to request. e.g “show me colors variation in tesla car” or “what are color options in a tesla car”
  • Go to the “Responses” section and click on Add Response. Now choose “Quick Replies” as a response.
  • Enter here options title and available options.
  • Now test it using the right side “try it now” section.