Vorschläge für Rezensionen mit clientseitiger KI ansehen

Maud Nalpas

Veröffentlicht: 21. Oktober 2024

Onlineshops können durch die Präsentation von Produktrezensionen einen Anstieg der Conversions um 270 % verzeichnen. Negative Rezensionen sind ebenfalls wichtig, da sie Glaubwürdigkeit schaffen. 82 % der Onlinekäufer suchen vor dem Kauf nach Rezensionen.

Es kann schwierig sein, Kunden aufzufordern, hilfreiche Rezensionen zu hinterlassen, insbesondere wenn sie negativ sind. Hier erfahren Sie, wie Sie generative KI nutzen können, um Nutzern dabei zu helfen, informative Rezensionen zu schreiben, die anderen bei der Kaufentscheidung helfen.

Demo und Code

Sehen Sie sich unsere Demo für Rezensionen an und sehen Sie sich den Code auf GitHub an.

So haben wir das Tool entwickelt

Clientseitige KI

Für diese Demo haben wir die Funktion aus folgenden Gründen clientseitig implementiert:

• Latenz. Wir möchten Vorschläge schnell anzeigen, sobald der Nutzer aufhört zu tippen. Wir können dies anbieten, indem wir Server-Roundtrips vermeiden.
• Kosten. Auch wenn dies eine Demo ist, können Sie mit dieser Funktion ohne serverseitige Kosten experimentieren, bis Sie herausgefunden haben, ob die Funktion für Ihre Nutzer sinnvoll ist.

Generative KI von MediaPipe

Wir haben uns aus folgenden Gründen für das Gemma 2B-Modell über die MediaPipe LLM Inference API (MediaPipe GenAI-Paket) entschieden:

• Modellgenauigkeit: Gemma 2B bietet ein hervorragendes Gleichgewicht zwischen Größe und Genauigkeit. Bei passenden Prompts hat das System Ergebnisse geliefert, die wir für diese Demo zufriedenstellend fanden.
• Browserübergreifende Unterstützung: MediaPipe wird in allen Browsern unterstützt, die WebGPU unterstützen.

Nutzererfahrung

Best Practices für die Leistung anwenden

Gemma 2B ist zwar ein kleines LLM, aber dennoch ein großer Download. Best Practices für die Leistung anwenden, einschließlich der Verwendung eines Webworkers.

Funktion optional machen

Wir möchten, dass die KI-basierten Rezensionsvorschläge den Workflow der Nutzer beim Posten einer Produktrezension verbessern. In unserer Implementierung kann der Nutzer eine Rezension posten, auch wenn das Modell nicht geladen wurde und daher keine Verbesserungsvorschläge bietet.

UI-Status und ‑Animationen

Die Inferenz dauert in der Regel länger als sofort. Daher signalisieren wir dem Nutzer, dass das Modell gerade eine Inferenz ausführt, also „nachdenkt“. Mithilfe von Animationen wird die Wartezeit verkürzt und der Nutzer wird gleichzeitig beruhigt, dass die Anwendung wie vorgesehen funktioniert. Sehen Sie sich die verschiedenen UI-Zustände an, die wir in unserer Demo implementiert haben, die von Adam Argyle entworfen wurde.

Weitere Hinweise

In einer Produktionsumgebung können Sie Folgendes tun:

• Bieten Sie einen Feedbackmechanismus. Was ist, wenn die Vorschläge nicht gut sind oder keinen Sinn ergeben? Implementieren Sie einen Mechanismus für schnelles Feedback (z. B. „Mag ich“ und „Mag ich nicht“) und nutzen Sie Heuristiken, um zu ermitteln, was Nutzer nützlich finden. Sie können beispielsweise prüfen, wie viele Nutzer mit der Funktion interagieren und ob sie sie deaktivieren.
• Sie müssen die Möglichkeit zum Deaktivieren der Funktion anbieten. Was ist, wenn der Nutzer lieber seine eigenen Worte ohne KI-Unterstützung verwenden möchte oder die Funktion als störend empfindet? Der Nutzer muss die Möglichkeit haben, die Funktion jederzeit zu deaktivieren und wieder zu aktivieren.
• Erläutern Sie, warum diese Funktion vorhanden ist. Eine kurze Erklärung kann Nutzer dazu anregen, das Feedback-Tool zu verwenden. Beispiel: „Besseres Feedback hilft anderen Käufern bei der Kaufentscheidung und uns dabei, die Produkte zu entwickeln, die Sie sich wünschen.“ Sie könnten eine ausführliche Erklärung dazu hinzufügen, wie die Funktion funktioniert und warum Sie sie anbieten. Vielleicht als Link, über den weitere Informationen zu finden sind.
• Gib gegebenenfalls die Nutzung von KI an. Mit clientseitiger KI werden die Inhalte des Nutzers nicht zur Verarbeitung an einen Server gesendet und können somit privat bleiben. Wenn Sie jedoch einen serverseitigen Fallback erstellen oder anderweitig Informationen mit KI erheben, sollten Sie dies in Ihrer Datenschutzerklärung, in den Nutzungsbedingungen oder an anderer Stelle angeben.

Implementierung

Unsere Implementierung für den Vorschlag von Rezensionen kann für eine Vielzahl von Anwendungsfällen verwendet werden. Die folgenden Informationen dienen als Grundlage für Ihre zukünftigen clientseitigen KI-Features.

MediaPipe in einem Web Worker

Mit der MediaPipe-LLM-Inferenz besteht der KI-Code aus nur wenigen Zeilen: Sie erstellen einen Datei-Resolver und ein LLM-Inferenzobjekt, indem Sie ihm eine Modell-URL übergeben. Später verwenden Sie dann diese LLM-Inferenzinstanz, um eine Antwort zu generieren.

Unser Codebeispiel ist jedoch etwas umfangreicher. Das liegt daran, dass es in einem Web Worker implementiert ist, sodass Nachrichten mit dem Hauptskript über benutzerdefinierte Nachrichtencodes weitergeleitet werden. Weitere Informationen zu diesem Muster

// Trigger model preparation *before* the first message arrives
self.postMessage({ code: MESSAGE_CODE.PREPARING_MODEL });
try {
  // Create a FilesetResolver instance for GenAI tasks
  const genai = await FilesetResolver.forGenAiTasks(MEDIAPIPE_WASM);
  // Create an LLM Inference instance from the specified model path
  llmInference = await LlmInference.createFromModelPath(genai, MODEL_URL);
  self.postMessage({ code: MESSAGE_CODE.MODEL_READY });
} catch (error) {
  self.postMessage({ code: MESSAGE_CODE.MODEL_ERROR });
}

// Trigger inference upon receiving a message from the main script
self.onmessage = async function (message) {
  // Run inference = Generate an LLM response
  let response = null;
  try {
    response = await llmInference.generateResponse(
      // Create a prompt based on message.data, which is the actual review
      // draft the user has written. generatePrompt is a local utility function.
      generatePrompt(message.data),
    );
  } catch (error) {
    self.postMessage({ code: MESSAGE_CODE.INFERENCE_ERROR });
    return;
  }
  // Parse and process the output using a local utility function
  const reviewHelperOutput = generateReviewHelperOutput(response);
  // Post a message to the main thread
  self.postMessage({
    code: MESSAGE_CODE.RESPONSE_READY,
    payload: reviewHelperOutput,
  });
};

export const MESSAGE_CODE ={
  PREPARING_MODEL: 'preparing-model',
  MODEL_READY: 'model-ready',
  GENERATING_RESPONSE: 'generating-response',
  RESPONSE_READY: 'response-ready',
  MODEL_ERROR: 'model-error',
  INFERENCE_ERROR: 'inference-error',
};

Eingabe und Ausgabe

Unser vollständiger Prompt wurde mit Few-Shot-Prompting erstellt. Sie enthält die Eingaben des Nutzers, also den von ihm verfassten Rezensionsentwurf.

Um den Prompt basierend auf der Nutzereingabe zu generieren, rufen wir zur Laufzeit unsere Dienstprogrammfunktion generatePrompt auf.

Clientseitige KI-Modelle und ‑Bibliotheken bieten in der Regel weniger Funktionen als serverseitige KI. So ist der JSON-Modus oft nicht verfügbar. Das bedeutet, dass wir die gewünschte Ausgabestruktur in unserem Prompt angeben müssen. Das ist weniger übersichtlich, wartungsfreundlich und zuverlässig als die Bereitstellung eines Schemas über die Modellkonfiguration. Außerdem sind clientseitige Modelle in der Regel kleiner, was bedeutet, dass sie anfälliger für strukturelle Fehler in der Ausgabe sind.

In der Praxis haben wir festgestellt, dass Gemma 2B im Vergleich zu JSON oder JavaScript eine bessere strukturierte Ausgabe als Text liefert. Für diese Demo haben wir uns daher für ein textbasiertes Ausgabeformat entschieden. Das Modell generiert Text, den wir dann in ein JavaScript-Objekt parsen, um ihn in unserer Webanwendung weiterzuverarbeiten.

Verbesserung des Prompts

Wir haben einen LLM verwendet, um unseren Prompt zu iterieren.

• Few-Shot-Prompts Für die Beispiele für unsere Few-Shot-Prompts haben wir Gemini Chat verwendet. Für Gemini Chat werden die leistungsstärksten Gemini-Modelle verwendet. So konnten wir qualitativ hochwertige Beispiele generieren.
• Prompt-Optimierung. Sobald die Struktur des Prompts fertig war, haben wir ihn auch mit Gemini Chat optimiert. Dadurch wurde die Ausgabequalität verbessert.

Kontext verwenden, um die Qualität zu verbessern

Durch die Aufnahme des Produkttyps in den Prompt konnte das Modell relevantere und hochwertigere Vorschläge liefern. In dieser Demo ist der Produkttyp statisch. In einer echten Anwendung könnten Sie das Produkt dynamisch in Ihren Prompt einbinden, je nachdem, welche Seite der Nutzer besucht.

Review: "I love these."
Helpful: No  
Fix: Be more specific, explain why you like these **socks**.
Example: "I love the blend of wool in these socks. Warm and not too heavy."

Eines der Beispiele im Abschnitt „wenige Aufnahmen“ unseres Prompts: Der Produkttyp („Socken“) ist in der Korrekturvorschlag und in der Beispielrezension enthalten.

LLM-Probleme und ‑Korrekturen

Gemma 2B erfordert in der Regel mehr Prompt-Engineering als ein leistungsfähigeres, größeres serverseitiges Modell.

Bei Gemma 2B sind einige Herausforderungen aufgetreten. So haben wir die Ergebnisse verbessert:

• Zu nett. Gemma 2B hatte Schwierigkeiten, Rezensionen als „nicht hilfreich“ zu kennzeichnen, da sie anscheinend zögerte, eine Bewertung abzugeben. Wir haben versucht, die Sprache der Labels neutraler zu gestalten („spezifisch“ und „unspezifisch“ anstelle von „hilfreich“ und „nicht hilfreich“) und Beispiele hinzuzufügen. Die Ergebnisse haben sich dadurch jedoch nicht verbessert. Die Ergebnisse wurden durch Beharrlichkeit und Wiederholungen in der Aufforderung verbessert. Ein Chain-of-Thought-Ansatz würde wahrscheinlich auch zu Verbesserungen führen.

• Die Anleitung war unklar. Das Modell hat den Prompt manchmal zu stark interpretiert. Anstatt die Rezension zu bewerten, wurde die Beispielliste fortgesetzt. Um das zu beheben, haben wir einen klaren Übergang in den Prompt aufgenommen:

  I'll give you example reviews and outputs, and then give you one review
  to analyze. Let's go:
  Examples:
  <... Examples>
  
  Review to analyze:
  <... User input>
  

  Eine klare Strukturierung des Prompts hilft dem Modell, zwischen der Beispielliste (wenige Aufnahmen) und der tatsächlichen Eingabe zu unterscheiden.

• Falsches Ziel. Gelegentlich schlug das Modell Änderungen am Produkt anstelle des Rezensionstexts vor. Bei einer Rezension mit dem Satz „Ich hasse diese Socken“ könnte das Modell beispielsweise vorschlagen: „Ersetzen Sie die Socken durch eine andere Marke oder einen anderen Stil.“ Das ist nicht der gewünschte Effekt. Durch die Aufteilung des Prompts konnte die Aufgabe klarer formuliert werden und das Modell konnte sich besser auf die Rezension konzentrieren.