UI-Module und Connectors implementieren

Agent Assist bietet eine Reihe vordefinierter, anpassbarer UI-Komponentenmodule, mit denen Sie Agent Assist-Funktionen in Ihre UI einbinden können. Sie können die Module in jede Webanwendung einbetten, um Ihren Kundenservicemitarbeitern Agent Assist-Vorschläge zu präsentieren. Eine genaue Anleitung dazu, wie Sie Module in LivePerson einbinden, finden Sie im LivePerson-Tutorial.

Agent Assist-Funktionen

Im Folgenden finden Sie die Agent Assist-Funktionen, die Sie als UI-Modulkomponenten implementieren können.

Hinweis

Bevor Sie UI-Module implementieren können, müssen Sie ein Konversationsprofil konfigurieren.

UI-Module implementieren

Wählen Sie UI-Module basierend auf den Agent Assist-Funktionen aus, die Sie verwenden:

Features Beispiel für UI-Module
Companion-Agent, Zusammenfassung von Unterhaltungen Companion-Agent, Transkript
KI-Coach, (proaktiver) Generative Knowledge Assist, Smart Reply, Zusammenfassung von Unterhaltungen Container V2, Smart Reply, Transkript

Alle UI-Module können mit jeder Agent-Desktop-Plattform verwendet werden. Agent Assist bietet jedoch nur Open-Source-UI-Modulintegrationen für Genesys Cloud, LivePerson, Twilio und Salesforce. Wenn Sie UI-Module in eine andere Agent-Desktop-Plattform einbinden möchten, müssen Sie eine eigene Integration erstellen.

Der UI-Modul-Connector ermöglicht die Kommunikation zwischen den UI-Komponenten, dem Agent Desktop und dem Agent Assist-Backend. Die gesamte Clientkommunikation erfolgt durch das Senden von benutzerdefinierten Ereignissen.

Companion-Agent

Der Companion-Agent ist eine einzelne Komponente, die einen interaktiven Companion-Agenten in Ihren Agent-Desktop einbettet. Das Companion-Agent-Feature ersetzt die meisten anderen Agent Assist-Funktionen. Das zugehörige UI-Modul enthält jedoch einige ergänzende Funktionen wie die Zusammenfassung von Unterhaltungen. Daher müssen Sie den Container nicht zusammen mit dem Companion-Agent-UI-Modul verwenden.

Weitere Informationen finden Sie auf der API-Dokumentationsseite für Companion-Agents.

Feature-Container

Der Container ist eine einzelne Komponente, in der die ausgewählten Agent Assist-Funktionen für nicht begleitende Agenten in einem einheitlichen, reaktiven Bereich gerendert werden. Verwenden Sie den Container, wenn Sie den KI-Coach, die (proaktive) generative Wissensunterstützung, Smart Reply oder die Zusammenfassung von Unterhaltungen verwenden.

Weitere Informationen finden Sie auf der Dokumentationsseite zur Container V2 API.

Einzelne Komponenten

Sie können einige Agent Assist-Funktionen einzeln in den Companion-Agenten oder den Container einbinden. Wenn Ihr Agent-Desktop Sprachunterhaltungen verarbeitet, fügen Sie in der Regel die Komponente „Transkript“ hinzu. Andere einzelne Komponenten empfehlen wir nur, wenn Sie eine benutzerdefinierte Anwendung verwenden, in der die Module in verschiedenen Bereichen der Seite gerendert werden müssen, oder wenn Sie umfangreiche Anpassungen benötigen. Sie möchten beispielsweise ein Modul für intelligente Antworten direkt unter der Chatanzeige platzieren.

In diesem Fall müssen Sie das ausgewählte funktionsspezifische UI-Modul einzeln importieren. Außerdem müssen Sie den UI-Modul-Connector importieren und initialisieren.

Dateiversionen

So rufen Sie die neueste Version einer gstatic-Datei ab:

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

So rufen Sie eine bestimmte stabile Version einer gstatic-Datei ab, indem Sie die genaue Version angeben:

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

Neueste Versionen: 

      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

UI-Modul-Connector implementieren

Sofern Sie nicht Version 1 des Containers verwenden, müssen Sie den UI-Modul-Connector implementieren, um UI-Module nutzen zu können. Fügen Sie Ihrer Anwendung den folgenden Code hinzu, um eine globale UiModulesConnector-Klasse verfügbar zu machen, die dann instanziiert und initialisiert werden kann:

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

Methoden:

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

Im Folgenden wird die TypeScript-Schnittstelle für das Connector-Konfigurationsobjekt beschrieben. Wenn Sie einen Connector für benutzerdefinierte UI-Module für die Verwendung mit einem nicht unterstützten System erstellt haben, setzen Sie agentDesktop auf Custom. Das folgende Beispiel enthält eine Liste der unterstützten Agent-Desktop-Systeme.

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;
    };
  }

}

Beispiel für die Instanziierung:

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',
  }
});

Rechtliche Hinweise für Preise

Wenn Sie UI-Module verwenden, fallen Kosten für die zugrunde liegenden Dienste an, darunter: