Trabajar con tarjetas en conversaciones de bots

Próximamente: Conector Genesys Digital Bot

Las tarjetas contienen una imagen, un título, un cuerpo y una lista de botones. Los clientes pueden interactuar con las tarjetas haciendo clic en un botón. Las tarjetas contienen dos tipos de botones: texto atrás y URL web. Los botones de retroceso de texto se convierten en parte del mensaje enviado al bot y forman parte de la conversación. Los botones de URL web permiten a los clientes acceder rápidamente a sitios web relevantes y le permiten proporcionar más detalles sobre sus productos u ofertas. Las tarjetas no desaparecen después de que los clientes interactúan con ellas, por lo tanto, pueden interactuar con las tarjetas más de una vez.

Ejemplo: Tarjetas en Genesys Web Messenger

Tarjetas en Genesys Web Messenger

Soporte para bots y canales

Las respuestas rápidas permiten respuestas rápidas y estructuradas, lo que le permite ofrecer respuestas sencillas y guiadas a mensajes directos eligiendo de una lista de opciones. Las tarjetas proporcionan una descripción más sofisticada de productos y servicios mediante la introducción de imágenes, títulos, textos corporales y referencias opcionales a sitios web externos. Las respuestas rápidas facilitan las conversaciones de los bots al mejorar la experiencia automatizada del cliente y resolver los problemas de manera más rápida.

Nota: Las mejores prácticas recomiendan limitar el número de selecciones de bots en una sola tarjeta a tres opciones.

Bots actualmente compatibles:

  • Google Dialogflow ES
  • Google Dialogflow CX
  • Conector Digital Bot
  • Conector de bot

Bots actualmente compatibles:

  • Mensajero web de Genesys
  • Facebook Messenger
  • Instagram
  • Mensaje de Whatssap
  • Instagram
  • Nota: Para poder utilizar esta función en Open Messaging, primero debe crear un perfil de configuración y seleccionar el tipo de mensaje Cards adecuado. A continuación, asígnalo a tu integración de mensajería abierta. Para más información, consulte Crear y asignar un perfil de configuración.
    Mensajería abierta

Consideraciones sobre la aplicación de las tarjetas

Cuando diseñe e implemente estructuras de carrusel en sus respuestas de bots, tenga en cuenta estas limitaciones:

  • Las acciones predeterminadas no son compatibles con WhatsApp, LINE o Twitter. Si se configuran acciones por defecto en estas aplicaciones, éstas las ignoran.

Cuando configure tarjetas en WhatsApp, tenga en cuenta las siguientes consideraciones:

  • WhatsApp admite hasta tres botones con tarjetas. Si configura más de tres botones, se produce un error.
  • El soporte de WhatsApp se limita a los botones de retroceso de texto. WhatsApp no admite botones de URL.
  • El cliente puede seleccionar cada botón de retroceso de texto una vez y no se limita a una sola opción. El comportamiento de su bot debe tener en cuenta escenarios en los que el usuario puede seleccionar múltiples opciones.
  • WhatsApp no admite la defaultAction en la respuesta del bot para las tarjetas.
  • Las tarjetas que incluyen una imagen o un vídeo no muestran un título. Cuando usa solo texto, se muestra el título.

Por ejemplo, si configura una tarjeta con un título de "50% de descuento en vuelos a Noruega" e incluye una imagen, el título no aparece:

Si configura la tarjeta con un título y sin imagen, el título aparece en la tarjeta:

    Google Dialogflow CX

    Estas secciones describen cómo incorporar respuestas rápidas en su bot de Google Dialogflow ES e incluyen ejemplos de casos de uso y otros recursos.

    Nota: Las acciones predeterminadas no son compatibles con WhatsApp, LINE o Twitter. Si se configuran acciones por defecto en estas aplicaciones, éstas las ignoran.

    1. Instale la integración de Google Dialogflow desde Genesys AppFoundry.
    2. Configurar la credencial de la cuenta de servicio de la plataforma Google Dialogflow.
    3. Habilite la integración de Google Dialogflow.
    4. Para configurar opciones de respuesta rápida en la consola de Dialogflow, use este JSON personalizado para definir opciones para la intención de su bot:
    {
        "genesys_prompt": "String", // optional message text
        "genesys_carousel": [
             {
                  "title": "String", // mandatory cards title line
                  "description": "String", // optional cards body text explaining its purpose
                  "image": "URL", // optional a URL pointing to the image shown in the card
                  "defaultAction":  {
                        "type": "String", //Describes the type of action. Valid values Link Postback
                        "text": "String", //The response text from the button click
                        "payload": "String", // Text to be returned as the payload from a ButtonResponse when a button is clicked.
                        "url": "String" //A URL of a web page to direct the user to.
                  },
                  "actions": [
                        {                                       
                             "type": "String", //Describes the type of action.  Valid values Link Postback
                             "text": "String", //The response text from the button click
                             "payload": "String" // Text to be returned as the payload from a ButtonResponse when a button is clicked.
                        },
                        {
                             "type": "String", //Describes the type of action.  Valid values Link Postback
                             "text": "String", //The response text from the button click
                             "url": "String" //A URL of a web page to direct the user to.
                        }
                  ]
             }
        ]
    }

    Para usar las opciones de la tarjeta para cambiar entre las intenciones de su bot, en la consola de Dialogflow, agregue el JSON personalizado de la sección anterior en el campo de entrada Respuesta:

    Ejemplo de Google Cloud Dialogflow ES

    Haga clic en la imagen para ampliarla.

    Tarjetas en Google Dialogflow

    Ejemplo de Google Cloud Dialogflow CX

    Haga clic en la imagen para ampliarla.

    Tarjetas en Google Dialogflow CX

    Para usar las opciones de la tarjeta para llenar la ranura de su bot, use el JSON personalizado de la sección anterior en un webhook. También puede utilizar AWS Lambda para este propósito. Para más información, consulte Webhook for slot filling en la guía de Google Cloud Dialogflow ES.

    Aprende más:

    Conector Digital Bot

    Estas secciones describen cómo incorporar tarjetas a tu bot Genesys Digital Bot Connector, e incluyen otros recursos.

    1. Crear un bot que se adhiera a las especificaciones de Genesys Digital Bot Connector
    2. Configurar la integración de Genesys Digital Bot Connector.
    3. Utilice el formato normalizado de Genesys para definir las tarjetas.
        {
          "type": "Structured",
          "content": [
            {
              "contentType": "Card",
              "card": {
                "title": "50% off Flights to Norway",
                "description": "Valid September to November only",
                "image": "https://www.samplesite.com/photo/1234.jpg",
                "defaultAction": {
                  "type": "Link",
                  "url": "http://www.samplesite.com/flights/norway"
                },
                "actions": [
                  {
                    "type": "Link",
                    "text": "View Details",
                    "url": "http://www.samplesite.com/flights/norway"
                  },
                  {
                    "type": "Postback",
                    "text": "Book Now",
                    "payload": "I want it"
                  }
                ]
              }
            }
          ]
        }
    
    

    Conector de bot

    Estas secciones describen cómo incorporar respuestas rápidas en su bot de Genesys Bot Connector e incluyen otros recursos.