Integre Twilio Flex con inteligencia de conversación de Dynamics 365 (vista previa)

[Este artículo es documentación preliminar y está sujeto a modificaciones].

Esta integración permite a sus vendedores realizar y recibir llamadas de Twilio Flex desde Dynamics 365 y obtener transcripciones en tiempo real durante la llamada e información de llamadas generada por IA después de la llamada.

Importante

• Esta es una característica en versión preliminar.
• Las características en vista previa no se han diseñado para un uso de producción y pueden tener una funcionalidad restringida. Estas características están sujetas a condiciones de uso adicionales y están disponibles antes del lanzamiento oficial para que los clientes puedan tener un acceso anticipado y proporcionar comentarios.

Requisitos previos

• Una cuenta de Twilio

• Una cuenta Twilio Flex: consulte este enlace para obtener más información sobre cómo configurar una cuenta Flex

• Un entorno de Microsoft Dynamics 365 Sales con la licencia Sales Premium o Sales Enterprise, junto con privilegios del sistema Administrador

• Conversation Intelligence instalado y configurado – Más información

• Marco de integración de canal de Dynamics 365 1.0 instalado. Más información

• Un entorno de Node JS local configurado

• La aplicación create-flex-plugin

Paso 1: Configurar Twilio Flex como proveedor de canales

En el Marco de integración de canal de Dynamics 365, cree un proveedor de canales para Twilio Flex. Vea la captura de pantalla siguiente como ejemplo:

Introduzca los siguientes valores::

• URL de canal:https://flex.twilio.com/agent-desktop

• Habilitar comunicación de salida: Sí

• Versión de API: 1.0

• Orden de canal: 1

• Dominio de confianza:https://flex.twilio.com/

• Seleccione Interfaz unificada Aplicaciones para el canal: Centro de ventas (o cualquier otra aplicación para la que desee habilitar la integración)

• Seleccione los roles de seguridad para el canal: Agregue los roles que utilizarían Twilio Flex. Por ejemplo, vendedor, gerente de ventas, etc. on.To inserte Twilio Flex como un iframe dentro de Dynamics 365, agregue la URL de la organización de Dynamics 365 a la lista de URL permitidas. Para obtener más información, consulte este artículo.

Paso 2: Instalar el conector SIPREC y enrutar las llamadas a Dynamics 365

1. Instale el complemento Conector SIPREC.

2. Abra la configuración del Centro de administración de Twilio y configúrelo para bifurcar los medios a la grabadora de Dynamics 365 como se ilustra en la siguiente captura de pantalla:

   

   Los siguientes campos son importantes para considerar:

   • Nombre exclusivo: Especifique un nombre y anótelo. Tendrá que utilizarlo en los pasos siguientes

   • Servidor de grabación de sesiones: Especifique la URL del servidor de grabación de medios de Dynamics 365. Para obtener una lista de grabadoras y regiones admitidas, consulte Extremos de grabadoras y regiones admitidas.

     • Si desea bifurcar los medios a la grabadora más cercana, use la siguiente URL: sip:SRS@media.recording.dynamics.com:5061;secure=true

     • Los campos de credenciales pueden permanecer vacíos. La autenticación se realiza con certificado en la configuración de TLS entre Twilio y Dynamics.

Paso 3: configurar el flujo de llamadas para bifurcar los medios a Dynamics 365

1. Vaya a la sección Studio Flows en la Consola y seleccione Voice IVR flow.

2. En el lado derecho, en la sección Voice en la biblioteca de widgets, agrega el widget Fork Stream:

   

3. Ahora, configure el widget para bifurcar la transmisión usando el conector SIPREC que definió anteriormente:

   

4. Introduzca los siguientes valores:

   - Acción de secuencia: Iniciar

   • Tipo de secuencia: Siprec
   • Nombre del conector: El nombre que le diste al conector SIPREC. En nuestro ejemplo, es SipRec1.
   • Pistas: Ambas pistas
   • Parámetros de secuencia

     • Rol: entrante (En nuestro ejemplo, vamos a grabar las llamadas entrantes)

     • CallerDisplayName: {{trigger.call.From}}

     • CalleeDisplayName: {{trigger.call.To}}

5. En la pestaña Transiciones, configure la secuencia de bifurcación para ser antes de enviar la llamada al agente:

   

6. Guarde el flujo y publique.

Paso 4: configurar un número de teléfono de Twilio

Debe apuntar un número de teléfono de Twilio a su Studio Flow recién creado.

1. Seleccione un número de su propiedad, o compre un número nuevo, desde la consola Números de teléfono de Twilio.

2. Abra el número de teléfono seleccionándolo, luego desplácese hacia abajo hasta la sección Voz de la página.

3. Seleccione el flujo que había definido anteriormente en los campos Llamada entra como se ilustra en la siguiente captura de pantalla:

   

Paso 5: Configurar Dynamics 365 para la integración

Configuremos Twilio como proveedor de llamadas y configuremos una política de grabación para definir quién puede grabar llamadas y otra información utilizada para obtener información sobre conversaciones.

1. En la aplicación Centro de ventas, vaya a Cambiar área y seleccione Configuración de Sales Insights.

2. Seleccione Inteligencia de conversaciones.

   

3. Seleccione Twilio en la sección Proveedores de llamadas y especifique el SID de la cuenta de Twilio.

4. Guarde los cambios.

5. Configure una política de grabación mediante el proveedor de llamadas de Twilio.

   1. Seleccione Crear una política de grabación y configure la política. Obtenga más información.

   2. Seleccione Crear y luego publique la configuración.

Paso 6: prepare el complemento Flex para integrar la experiencia en tiempo real

Flex es un proyecto de React y las personalizaciones que realiza en la interfaz de usuario se crean como componentes de complemento.

La preparación de un entorno de nodo y la configuración de un complemento Flex vacío están fuera del alcance de esta documentación. Consulte la documentación de Twilio para obtener un tutorial paso a paso sobre cómo crear su primer complemento de Flex.

Cree un complemento nuevo que esté listo para que agregue su código de personalización para Dynamics.

En este momento, el archivo JS del complemento debe tener este aspecto:

Agregue la biblioteca de Microsoft CIF Client a su complemento. La biblioteca del cliente debe cargarse de forma asíncrona cuando se inicia Flex, así que agregue el siguiente código a la función de inicio de Flex.

import React from 'react';
import \* as Flex from '@twilio/flex-ui';
import { FlexPlugin } from '@twilio/flex-plugin';
import reducers, { namespace } from './states';
const PLUGIN\_NAME = 'SamplePlugin';
export interface CallStartedEvent {
  callId: string;
  startTime: Date;
  isIncomingCall: boolean;
  contactNumber: string;
  contactName: string;
}

export interface CallEndedEvent {
  callId: string;
  callDurationInSeconds: number;
  callTerminationReason: string; // \['success', 'error'\]
  callEndTime: Date;
  isCallStarted: boolean;
}

export default class SamplePlugin extends FlexPlugin {
  constructor() {
    super(PLUGIN\_NAME);
  }
  /\*\*
   \* This code is run when your plugin is being started
   \* Use this to modify any UI components or attach to the actions framework
   \*
   \* @param flex { typeof Flex }
   \* @param manager { Flex.Manager }
   \*/
  async init(flex: typeof Flex, manager: Flex.Manager): Promise<void> {
    this.registerReducers(manager);
    this.loadCIF();
    flex.Actions.addListener('afterAcceptTask', (payload) => {
      const callStartedEvent : CallStartedEvent = {
        callId: payload.task.\_task.attributes.call\_sid,
        startTime: new Date(),
        isIncomingCall: true,
        contactName: payload.task.\_task.attributes.caller,
        contactNumber: payload.task.\_task.attributes.caller
      };
      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_STARTED', callStartedEvent);
    });

    flex.Actions.addListener('afterCompleteTask', (payload) => {
      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_ENDED', {
        callId: payload.task.\_task.attributes.call\_sid,
        callTerminationReason: 'success',
        callEndTime: new Date(),
        isCallStarted: true
      });
      const callEndedEvent : CallEndedEvent = {
        callId: payload.task.\_task.attributes.call\_sid,
        callEndTime: new Date(),
        callTerminationReason: 'success',
        isCallStarted: true
      };
 

      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_ENDED', callEndedEvent);
    });

    const options: Flex.ContentFragmentProps = { sortOrder: -1 };
    flex.AgentDesktopView.Panel1.Content.add(<div key="SamplePlugin-component" >Hello Partner!</div>, options);
  }

  loadCIF = () => {
    const script = document.createElement("script");
    script.src = \`${window.location.ancestorOrigins\[0\]}/webresources/Widget/msdyn\_ciLibrary.js\`;
    script.setAttribute('data-crmurl', window.location.ancestorOrigins\[0\]);
    script.setAttribute('data-cifid', 'CIFMainLibrary');
    document.body.appendChild(script);
  }

  /\*\*

   \* Registers the plugin reducers
   \*
   \* @param manager { Flex.Manager }
   \*/
  private registerReducers(manager: Flex.Manager) {
    if (!manager.store.addReducer) {
      // eslint-disable-next-line
      console.error(\`You need FlexUI > 1.9.0 to use built-in redux; you are currently on ${Flex.VERSION}\`);
      return;
    }
    manager.store.addReducer(namespace, reducers);
  }
}

Publique el complemento.
¡Ahora tenemos un complemento Flex que está listo para que lo probemos!

Paso 7: pruebe la inteligencia de conversación de Dynamics 365 y la integración de Flex

Inicie sesión en la aplicación Centro de ventas, seleccione el icono Llamar. Verá Twilio Flex incrustado en el panel derecho.

Asegúrese de haber establecido su estado como Disponible en Twilio y realice una llamada al número de teléfono de Twilio que configuró en el Paso 4: Configure un número de teléfono de Twilio.

Una vez que responda la llamada y comience a grabar, navegue a la pestaña Transcripción para ver la transcripción en tiempo real y luego vea las estadísticas de la llamada en la página Resumen de la llamada después de que termine la llamada.

Información relacionada

Ver y comprender una página de resumen de llamada