Typing indicators are a helpful way to indicate to a user that the agent or bot is active and in the process of responding. Likewise, agents can also appreciate being able to see when the user is responding.
This guide covers everything you need to know to use typing indicators effectively.
There are three types of typing indicators:
The user and agent will see each other's typing indicators. Both the user and the agent will see the bot's typing indicators.
Type of indicator
User and agent
Not all integrations support typing indicators. Refer to the table below for a list of integrations that currently support typing indicators.
* appear as "Bot is typing..."
Typing indicators are turned on by default, but can be disabled.
To prevent the bot from generating typing indicators, add
typing: false to your app's
bot/default.yaml file. Here's an example:
type: meya.bot.element name: Hello World Bot markdown: true typing: false
To disable typing indicators, add
typing: false to the integration file. Here's an example for the Orb integration:
type: meya.orb.integration typing: false
In this case, an agent would no longer see the Orb user's typing indicators, but would still see the bot's typing indicators. The Orb user would still see the agent and bot typing indicators.
Since typing indicators are turned on by default there's no need to add
typing: trueto your integration file or
bot/default.yamlfile unless you want to be explicit.
For the bot, however, typing indicators are explicitly turned on and off using the
typing component. Here's an example:
- typing: on|off
When the bot is speaking, it can be helpful to add delays to some flow steps. From a user experience perspective, this helps prevent the bot from displaying messages too quickly and overwhelming the user.
Also, if the bot works too quickly, it is likely the
presence.typing.off entries will be received in rapid succession causing the typing indicator to flash on and off, or to not display at all.
For these reasons, we recommend adding a 1-2 second delay to steps that display messages to the user, like this:
steps: - say: Here is some text. - typing: on - delay: 2 - say: Here is some more text.
Implicit typing off events
Notice in the above example that there was no need to explicitly turn off the typing indicator. Components that generate output, like the
saycomponent, also create a
To demonstrate the different ways typing indicators can be used, try adding the code below to your app.
In your app's
flow folder, create a subfolder called
typing_indicator. Inside the new folder, create a file called
typing_indicator.yaml and copy this code into it:
steps: - typing: on
steps: - say: Typing on... - typing: on - delay: 2 - say: Typing off... - typing: off
steps: - typing: off
steps: - typing: on - delay: 2 - say: Done.
steps: - typing: on - delay: 2 - say: Choose quick_replies: - text: First - text: Second
steps: - typing: on - delay: 2 - type: component.tile.yes_no text: Do you want to continue?
steps: - typing: on - delay: 2 - status: This is a status
Test with a supported messaging integration
To run these examples, we recommend using the Orb integration with the chat window open (i.e. not in embed mode).
Updated 7 months ago