Add interactive messages to chat
Interactive messages are rich messages that present a prompt and pre-configured display options that a customer can select from. These messages are powered by Amazon Lex and configured through Amazon Lex using a Lambda.
For step-by-step instructions on how to add interactive messages through Amazon Lex and
Lambda, see this blog: Set up interactive messages for your Amazon Connect chatbot
Amazon Connect provides two message display templates: a list picker and a time picker. These templates define how the information is going to render, and what information is surfaced in the chat interface. When interactive messages are sent through chat, flows validate that the message format follows one of these templates.
This topic provides details about these interactive message templates.
List picker template
Following are examples of how the list picker template renders information in a chat.

The following code is the list picker template that you can use in your Lambda. Note the following:
-
Bold text is a mandatory parameter.
-
In some cases, if the parent element exists in the request and it isn't mandatory/bold, but the fields in it are, then the fields are mandatory. For example, see
data.replyMessage
structure in the following template. If the structure exists, title is mandatory. Otherwise completereplyMessage
is optional.
Images should be uploaded in Amazon S3 and publicly accessible.
{ "templateType":"ListPicker", (mandatory) "version":"1.0", (mandatory) "data":{ (mandatory) "replyMessage":{ "title":"Thanks for selecting!", (mandatory) "subtitle":"Produce selected", "imageType":"URL", "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/fruit_34.3kb.jpg", "imageDescription":"Select a produce to buy" }, "content":{ (mandatory) *"title":"What produce would you like to buy?", (mandatory) "subtitle":"Tap to select option", "imageType":"URL", "imageData":"https://interactive-msg.s3-us-west-2.amazonaws.com/fruit_34.3kb.jpg", "imageDescription":"Select a produce to buy", "elements":[ (mandatory, 1-6 items) { "title":"Apple", (mandatory) "subtitle":"$1.00" "imageType":"URL", "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/apple_4.2kb.jpg" }, { "title":"Orange", (mandatory) "subtitle":"$1.50" "imageType":"URL", "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/orange_17.7kb.jpg", }, { "title":"Banana", (mandatory) "subtitle":"$10.00" "imageType":"URL", "imageData":"https://interactive-message-testing.s3-us-west-2.amazonaws.com/banana_7.9kb.jpg", "imageDescription":"Banana" } ] } } }
List picker limits
The following table lists the limits for each of the list picker elements, should you choose to build your own Lambda from scratch. The mandatory parameters are in bold.
Parent field | Field | Required | Minimum characters | Maximum characters | Other requirement |
---|---|---|---|---|---|
templateType |
Yes |
Valid template type |
|||
data |
Yes |
||||
version |
Yes |
Must be "1.0" |
|||
data |
content | Yes | |||
replyMessage | No | ||||
content |
title | Yes | 1 |
100 |
Should be a description for promptless templates |
elements | Yes | 1 item |
6 items |
This is an array of elements. Maximum 6 elements in the array. |
|
subtitle | No | 0 |
200 |
||
imageType | No | 0 |
50 |
Must be "URL" |
|
imageData | No | 0 |
200 |
Must be a valid public Amazon S3 URL |
|
imageDescription | No | 0 |
50 |
||
elements |
title | Yes | 1 |
100 |
|
subtitle | No | 0 |
200 |
||
imageType | No | 0 |
50 |
Must be "URL" |
|
imageData | No | 0 |
200 |
Must be a valid public Amazon S3 URL |
|
imageDescription | No | 0 |
50 |
Cannot exist without an image |
|
replyMessage |
title | Yes | 1 |
100 |
|
subtitle | No | 0 |
200 |
||
imageType | No | 0 |
50 |
Must be "URL" |
|
imageData | No | 0 |
200 |
Must be a valid public Amazon S3 URL |
|
imageDescription | No | 0 |
50 |
Cannot exist without an image |
Time picker template
Following are two examples of how the time picker template renders information in a chat.

The following code is the time picker template that you can use in your Lambda. Note the following:
-
Bold text is a mandatory parameter.
-
In some cases, if the parent element exists in the request and it isn't mandatory/bold, but the fields in it are, then the fields are mandatory. For example, see
data.replyMessage
structure in the following template. If the structure exists, title is mandatory. Otherwise completereplyMessage
is optional.
{ "templateType":"TimePicker", (mandatory) "version":"1.0", (mandatory) "data":{ (mandatory) "replyMessage":{ "title":"Thanks for selecting", (mandatory) "subtitle":"Appointment selected", }, "content":{ (mandatory) "title":"Schedule appointment", (mandatory) "subtitle":"Tap to select option", "timeZoneOffset":-450 "location":{ "latitude":47.616299, (mandatory) "longitude":-122.4311, (mandatory) "title":"Oscar" (mandatory) "radius":1, }, "timeslots":[ (mandatory, 1-20 items) { "date" : "2020-10-31T17:00+00:00" (mandatory) "duration": 60, (mandatory) }, { "date" : "2020-11-15T13:00+00:00" (mandatory) "duration": 60, (mandatory) }, { "date" : "2020-11-15T16:00+00:00" (mandatory) "duration": 60, (mandatory) } ], } } } }
Time picker limits
The following table lists the limits for each of the time picker elements. Use this information if you choose to build your own Lambda from scratch. The mandatory parameters are in bold.
Parent field | Field | Required | Minimum characters | Maximum characters | Other requirement |
---|---|---|---|---|---|
templateType |
Yes |
Valid template type |
|||
data |
Yes |
||||
version |
Yes |
Must be "1.0" |
|||
data |
replyMessage | No | |||
content | Yes | ||||
replyMessage |
title | Yes | 1 |
100 |
|
subtitle | No | 0 |
200 |
||
title |
Yes | 1 |
100 |
Should be description for promptless templates |
|
subtitle | No | 0 |
200 |
||
content |
title |
Yes | 1 |
100 |
Should be description for promptless templates |
subtitle | No | 0 |
200 |
||
timezone offset | No | -720 |
840 |
This is an optional field when not set. Our sample client defaults to the user's timezone. If set, this displays per the timezone entered. The field should be an integer representing the number of minutes from GMT, specifying the timezone of the event's location. |
|
location | No | ||||
timeslots | Yes | 1 |
20 |
This is an array of timeslots. Maximum of 20 elements in the array. |
|
location |
longitude | Yes | -180 |
180 |
Must be double |
latitude | Yes | -90 |
90 |
Must be double |
|
title | Yes | 1 |
100 |
||
radius |
No | 0 |
200 |
||
timeslots |
date | Yes |
|
Should be in ISO-8601 time format: YYYY-MM-DDTHH.MM+00.00 For example: "2020-08-14T21:21+00.00" |
|
duration | Yes | 1 |
3600 |