Flow block: Show view - Amazon Connect

Flow block: Show view


  • Use this block configure UI-based workflows that you can surface to users of front end applications. You can use this block to create step-by-step guides for agents who are using the Amazon Connect agent workspace.

  • To use this block, first select a View resource from a drop-down menu and then map data to the different fields in the View's schema. You can use the Set JSON mapping option which lets you pass in entire JSON objects. For details on the available View templates, see View resource.

  • When the block receives a response back from the client application, the output data can be referenced in flows using $.Views.ViewResultData.

  • Check out our library of samples and reusable modules to help you get started with using the Show view block and creating step-by-step guides. These modules show how you can configure the different types of Show view blocks and ways you can integrate step-by-step guides with other workflows and services. They demonstrate good design patterns for common and complex use cases, and address the most common design concerns.

    To load the samples into your Amazon Connect instance, use the Import/export flows feature to load the flow with the sample Show view block into your account.

Supported channels

This block routes step-by-step guides that are to be displayed to agents in the agent workspace. It routes the guides as chat contacts. This type of chat contact is different from the customer-based contact that the agent is handling.

For example, a premium customer may call your contact center. The Show view block is triggered to display the premium step-by-step guide to the agent. There are two contacts involved:

  • The customer, who is a voice contact.

  • The step-by-step guide, which is routed as a chat contact.

Flow types

You can use this block in the following flow type:

  • Inbound flow


Properties are dynamically populated depending on which View resource you select. The following image shows the Properties page of the Show view block. It is set to the Wizard solution view.

                    The properties page of the Show view block.

How to use the Set JSON option

This section walks through an example of how to use the Set JSON option.

  1. In the View section of the Properties page, choose Confirmation from the dropdown menu, as shown in the following image.

                            The confirmation option.

    When you choose the Confirmation View, the input schema of the View is displayed on the properties page. The schema has the following sections where you can add information: Heading, AttributeBar, Graphic, Next, Style, Subheading, and Timeout. The following image shows some of these sections.

                            The confirmation option.
  2. The following image shows the AttributeBar parameter, the Set using JSON option. To view all of the JSON you pasted in, click the corner of the box and pull down.

                            The input parameters.

    Fix any errors if the JSON is invalid. The following image shows an example error message because there's an extra comma.

                                An error message that JSON is not valid.
  3. Choose Save and publish when you are ready.

Configured block

The following image shows an example of what this block looks like when it is configured. It has the following branches: Back, Next, No Match, Error, and Timeout.

The chat contact is routed down the Back or Next branches depending on what the user clicks on the View. No match is only possible if the user has an action component with a custom Action value.

                    A configured Show view block.