Learn more about how to build Google Actions with visual output using the Jovo Framework.
- Introduction to Visual Output
- Simple Response
- Basic Card
- Table Card
- Suggestion Chips
Visual output is used to describe or enhance the voice interaction.
With Simple Responses, you can provide basic text output in the form of chat bubbles to your users. They consist of visual text output and use SSML or TTS for sound.
Basic Cards are used for the most basic cases of visual output. They can be used to display plain text, images and a button in addition to the speech output.
Image Cards represent a simpler alternative to Basic Cards, which you can use when you just want to present an image.
Table Cards are used for displaying tabular data.
You can use one of the following selection types to let the user choose one out of several options as a response.
A List can be used to display a vertical list of selectable items. Lists must contain at least 2 items, but at most 30.
Each list provides an array of list items, containing keys for each item you want to show in your list. To add a list entry, you can utilize type overrides:
Contrary to Lists, Collections display a horizontal list of selectable items, that allow for richer content to be displayed. Collections must also contain at least 2 items, but only a maximum of 10 items.
Analogous to vertical lists, each collection provides an array of items, containing keys for each item you want to show in your list. To add an entry, you can utilize type overrides:
After the user selects one of the items in your visual selection, they will be redirected to the
ON_ELEMENT_SELECTED intent, if available. There you can use
this.getSelectedElementId() to get the
key of the selected item:
Use suggestion chips to add possible responses as a hint as to how the user can interact with your Conversational Action next.