Workflow Balloons

Workflow balloons are small information boxes that appear on the application screen and direct users on what to do in the current stage of the flow. The workflow instructions given by a user appears inside these balloons and helps in easy navigation across the application.

Entering Instructions Inside Balloons

  • While designing Workflows try to keep the heading short and direct, preferably restrict it to 3 words.
  • The content of the balloon should clearly indicate what must be done, as an action to the pointed element and supplement information if required to complete the stated action.

Once you start playing a workflow in autoplay or manual mode, you can see the balloons appearing on the screen helping you navigate through the application.

Avoid duplicating the Heading in the content section. Ensure the Content/Description has proper verbiage.

Balloon Position

Select balloon positions that will not block the important screen elements.

Make sure the balloon does not go out of the screen in all the scenarios: for example, click on a New balloon when there are more projects.

Make sure to use corner balloon positions when selecting an element which is too extreme sides of the page. Balloon position must be decided to make sure that it does not block the validation icon.