Implémenter des modules et des connecteurs d'UI

Agent Assist fournit un ensemble de modules de composants d'UI prédéfinis et personnalisables que vous pouvez utiliser pour intégrer les fonctionnalités d'Agent Assist à votre UI. Vous pouvez intégrer les modules à n'importe quelle application Web pour afficher les suggestions d'Agent Assist à vos agents. Pour obtenir des instructions spécifiques sur l'intégration de modules dans LivePerson, consultez le tutoriel LivePerson.

Fonctionnalités d'Agent Assist

Voici les fonctionnalités Agent Assist que vous pouvez implémenter en tant que composants de module d'UI.

Avant de commencer

Avant de pouvoir implémenter des modules d'UI, configurez un profil de conversation.

Implémenter des modules d'UI

Choisissez les modules d'UI en fonction des fonctionnalités Agent Assist que vous utilisez :

Fonctionnalités Exemples de modules d'UI
Agent Companion, résumé de conversation Agent associé, Transcription
Coach d'IA, assistance proactive basée sur l'IA générative, réponses suggérées, résumé de conversation Conteneur V2, Réponse suggérée, Transcription

Tous les modules d'UI peuvent être utilisés avec n'importe quelle plate-forme de bureau d'agent, mais Agent Assist ne fournit que des intégrations de modules d'UI Open Source pour Genesys Cloud, LivePerson, Twilio et Salesforce. Pour intégrer des modules d'UI à une autre plate-forme de bureau d'agent, vous devez créer votre propre intégration.

Le connecteur de module d'UI facilite la communication entre les composants d'UI, l'interface de l'agent et le backend Agent Assist. Toutes les communications avec le client ont lieu par le biais de l'envoi d'événements personnalisés.

Agent associé

L'agent associé est un composant unique qui intègre un agent associé interactif dans l'espace de travail de votre agent. La fonctionnalité d'agent associé remplace la plupart des autres fonctionnalités Agent Assist, mais son module d'UI inclut certaines fonctionnalités complémentaires, telles que la synthèse des conversations. Par conséquent, vous n'avez pas besoin d'utiliser le conteneur avec le module d'UI de l'agent associé.

Pour en savoir plus, consultez la page de documentation de l'API de l'agent associé.

Conteneur de caractéristiques

Le conteneur est un composant unique qui affiche les fonctionnalités d'Aide à l'agent non associées que vous avez choisies dans un panneau réactif unifié. Utilisez le conteneur si vous utilisez le coach IA, l'assistance proactive à la génération de connaissances, la réponse intelligente ou la synthèse de conversations.

Pour en savoir plus, consultez la page de documentation de l'API Container v2.

Composants individuels

Vous pouvez intégrer certaines fonctionnalités Agent Assist individuellement, à côté de l'agent associé ou du conteneur. Si votre bureau d'agent gère les conversations vocales, vous ajoutez généralement le composant "Transcription". Nous ne recommandons d'utiliser d'autres composants individuels que si vous utilisez une application personnalisée dans laquelle les modules doivent être affichés dans différentes sections de la page ou si vous avez besoin d'une personnalisation importante. Par exemple, vous pouvez placer un module de réponses suggérées directement sous l'affichage du chat.

Dans ce cas, vous devez importer le module d'UI spécifique à la fonctionnalité sélectionnée individuellement. De plus, vous devez importer et initialiser le connecteur du module d'UI.

Versions de fichier

Récupérez la dernière version d'un fichier gstatic en spécifiant la dernière version :

    <script src="https://www.gstatic.com/agent-assist-ui-modules/v1/companion_agent.js"></script>

Récupérez une version stable spécifique d'un fichier gstatic en spécifiant la version exacte :

    <script src="https://www.gstatic.com/agent-assist-ui-modules/v1.1/companion_agent.js"></script>

Dernières versions : 

      Container: v1.16 // Legacy
      Container: v2.7
      Common: v1.17
      Companion agent: v1.1
      Generative knowledge assist: v2.10
      Smart reply: v1.4
      Summarization: v1.3
      Transcript: v1.4
      Genesys Cloud: v1.1

Implémenter le connecteur du module d'UI

Sauf si vous utilisez la version 1 du conteneur, vous devez implémenter le connecteur de module d'UI pour utiliser les modules d'UI. Ajoutez le code suivant à votre application pour exposer une classe UiModulesConnector globale qui peut ensuite être instanciée et initialisée :

    <script src="https://www.gstatic.com/agent-assist-ui-modules/v1/common.js"></script>

Méthodes :

    constructor(): void;
    init(config: ConnectorConfig): void;
    disconnect(): void;
    setAuthToken(token: string): void;

Vous trouverez ci-dessous l'interface TypeScript pour l'objet de configuration du connecteur. Si vous avez créé un connecteur de module d'UI personnalisé à utiliser avec un système non compatible, définissez agentDesktop sur Custom. L'exemple suivant fournit une liste des systèmes de bureau d'agent compatibles.

interface ConnectorConfig {
  /** Communication mode for the UI modules application. */
  channel: 'chat' | 'voice';

  /** Agent desktop to use. */
  agentDesktop: 'LivePerson' | 'GenesysCloud' | 'SalesForce' | 'GenesysEngageWwe' | 'Custom';

  /** Optional desktop source for metric tracking. */
  agentDesktopSource?: string;

  /** Conversation profile name to use. */
  conversationProfileName: string;

  /** API Connector config. */
  apiConfig: {
    /**
     * Authentication token to attach to outgoing requests. Should be a valid
     * OAuth token for Dialogflow API, or any other token for custom API
     * endpoints.
     */
    authToken: string;

    /**
     * Specifies a custom proxy server to call instead of calling the Dialogflow
     * API directly.
     */
    customApiEndpoint?: string;

    /** API key to use. */
    apiKey?: string;

    /**
     * Additional HTTP headers to include in the Dialogflow/proxy server API
     * request.
     */
    headers?: Array;
  }

  /** Event-based connector config. Required for voice/omnichannel conversations and some features of chat conversations. */
  eventBasedConfig?: {
    /** Transport protocol to use for updates. Defaults to 'websocket'. */
    transport?: string;

    /** Event-based library to use. */
    library?: 'SocketIo';

    /** Endpoint to which the connection will be established. */
    notifierServerEndpoint: string;

    /** Additional Socket.io connect options. */
    socketIoConnectOpts?: any;

    /** Options to retry initial Socket.io connection in case of failure. */
    backOffOpts?: {
      initialDelay: number;
      maxDelay: number;
      maxAttempts: number;
      connectionTimeout: number;
    };
  }

}

Exemple d'instanciation :

const connector = new UiModulesConnector();

connector.init({
  channel: 'chat',
  agentDesktop: 'Custom',
  conversationProfileName: 'projects/my-project/locations/global/conversationProfiles/123',
  apiConfig: {
    authToken: 'abc123',
    customApiEndpoint: 'https://my-dialogflow-proxy-server.com',
  },
  eventBasedConfig: {
    notifierServerEndpoint: 'https://my-notifier-server-endpoint.com',
    transport: 'websocket',
    library: 'SocketIo',
  }
});

Avis de non-responsabilité sur les prix

Si vous utilisez des modules d'UI, des frais sont associés aux services sous-jacents, y compris les suivants :