Mit clientseitiger Web-KI nützliche Produktrezensionen fördern

Maud Nalpas

Kenji Baheux

Alexandra Klepper

Veröffentlicht: 16. Mai 2024

Sowohl positive als auch negative Bewertungen können die Kaufentscheidung eines Käufers beeinflussen.

Laut einer externen Studie suchen 82% der Onlinekäufer aktiv nach negativen Rezensionen, bevor sie etwas kaufen. Diese negativen Rezensionen sind sowohl für Kunden als auch für Unternehmen nützlich, da sie dazu beitragen können, die Rücksendequote zu senken und die Hersteller dabei unterstützen, ihre Produkte zu verbessern.

So können Sie die Qualität der Rezensionen verbessern:

• Prüfen Sie jede Rezension auf unangemessene Inhalte, bevor Sie sie einreichen. Wir könnten Nutzer dazu auffordern, anstößige Sprache und andere unpassende Äußerungen zu entfernen, damit ihre Rezension anderen Nutzern bei der Kaufentscheidung hilft.
  • Negativ: Diese Tasche ist schrecklich und ich hasse sie.
  • Negativ mit nützlichem Feedback Die Reißverschlüsse sind sehr steif und das Material fühlt sich billig an. Ich habe diese Tasche zurückgesendet.
• Eine Bewertung wird automatisch anhand der in der Rezension verwendeten Sprache generiert.
• Stellen Sie fest, ob die Rezension negativ oder positiv ist.

In diesem Beispiel ist der Kommentar des Rezensenten positiv bewertet und mit fünf Sternen bewertet.

Letztendlich sollte das letzte Wort zur Produktbewertung den Nutzenden folgen.

Das folgende Codelab bietet clientseitige Lösungen, sowohl auf dem Gerät als auch im Browser. Es sind keine Kenntnisse in der KI-Entwicklung, keine Server und keine API-Schlüssel erforderlich.

Achtung :Clientseitige KI bietet zwar spannende Möglichkeiten, aber Sie sollten sich auch ihrer Einschränkungen bewusst sein, insbesondere bei generativer KI und Large Language Models (LLMs). Diese Modelle haben eine große Downloadgröße und hohe Hardwareanforderungen, was sich auf die Leistung und Nutzerfreundlichkeit auswirken kann. Achten Sie darauf, diese Einschränkungen zu verstehen, und prüfen Sie, ob sie für Ihren Anwendungsfall geeignet sind.

Vorbereitung

Serverseitige KI mit Lösungen wie der Gemini API oder der OpenAI API bietet zwar robuste Lösungen für viele Anwendungen, in diesem Leitfaden konzentrieren wir uns jedoch auf clientseitige Web-KI. Die clientseitige KI-Inferenz erfolgt im Browser, um die Nutzerfreundlichkeit für Webnutzer zu verbessern, indem Server-Wechsel vermieden werden.

In diesem Codelab verwenden wir eine Mischung aus Techniken, um Ihnen zu zeigen, was sich in Ihrer Toolbox für clientseitige KI befindet.

Wir verwenden die folgenden Bibliotheken und Modelle:

• TensforFlow.js für die Toxizitätsanalyse. TensorFlow.js ist eine Open-Source-Bibliothek für maschinelles Lernen für Inferenz und Training im Web.
• transformers.js für die Stimmungsanalyse. Transformers.js ist eine Web-KI-Bibliothek von Hugging Face.
• Gemma 2B für Bewertungen. Gemma ist eine Familie einfacher, offener Modelle, die auf der Forschung und Technologie basieren, mit denen Google die Gemini-Modelle erstellt hat. Um Gemma im Browser auszuführen, verwenden wir die experimentelle LLM Inference API von MediaPipe.

UX- und Sicherheitsaspekte

Es gibt einige Dinge, die Sie beachten sollten, um die Nutzerfreundlichkeit und Sicherheit zu optimieren:

• Der Nutzer darf die Bewertung bearbeiten. Letztendlich sollte der Nutzer die endgültige Entscheidung über die Produktbewertung treffen.
• Machen Sie den Nutzern deutlich, dass Bewertung und Rezensionen automatisiert sind.
• Nutzern erlauben, eine als toxisch eingestufte Rezension zu posten, aber eine zweite Überprüfung auf dem Server ausführen. So wird verhindert, dass eine nicht schädliche Rezension fälschlicherweise als schädlich eingestuft wird (falsch positiv). Dies gilt auch für Fälle, in denen es einem böswilligen Nutzer gelingt, die clientseitige Prüfung zu umgehen.
• Eine clientseitige Prüfung auf toxische Inhalte ist hilfreich, kann aber umgangen werden. Führe auch eine serverseitige Prüfung durch.

Toxizität mit TensorFlow.js analysieren

Mit TensorFlow.js können Sie schnell damit beginnen, die Toxizität einer Nutzerbewertung zu analysieren.

1. Installieren und import Sie die TensorFlow.js-Bibliothek und das Modell für unangemessene Äußerungen.
2. Legen Sie eine minimale Vorhersagekonfidenz fest. Der Standardwert ist 0, 85. In unserem Beispiel haben wir ihn auf 0,9 festgelegt.
3. Laden Sie das Modell asynchron.
4. Klassifizieren Sie die Rezension asynchron. Unser Code erkennt Vorhersagen, die für eine Kategorie einen Schwellenwert von 0,9 überschreiten.

Dieses Modell kann Toxizität nach Identitätsangriffen, Beleidigung, Obszönitäten usw. kategorisieren.

Beispiel:

import * as toxicity from '@tensorflow-models/toxicity';

// Minimum prediction confidence allowed
const TOXICITY_COMMENT_THRESHOLD = 0.9;

const toxicityModel = await toxicity.load(TOXICITY_COMMENT_THRESHOLD);
const toxicityPredictions = await toxicityModel.classify([review]);
// `predictions` is an array with the raw toxicity probabilities
const isToxic = toxicityPredictions.some(
    (prediction) => prediction.results[0].match
);

Mit Transformers.js den Ton bestimmen

1. Installieren und importieren Sie die Transformers.js-Bibliothek.

2. Richten Sie die Aufgabe für die Sentimentanalyse mit einer speziellen Pipeline ein. Wenn eine Pipeline zum ersten Mal verwendet wird, wird das Modell heruntergeladen und im Cache gespeichert. Danach sollte die Sentimentanalyse viel schneller erfolgen.

   Hinweis: Sofern Sie kein Modell angeben, verwendet Transformers.js das Standardmodell für diese bestimmte Pipeline.

3. Klassifizieren Sie die Rezension asynchron. Mit einem benutzerdefinierten Schwellenwert können Sie das Konfidenzniveau festlegen, das für Ihre Anwendung geeignet ist.

Beispiel:

import { pipeline } from '@xenova/transformers';

const SENTIMENT_THRESHOLD = 0.9;
// Create a pipeline (don't block rendering on this function)
const transformersjsClassifierSentiment = await pipeline(
  'sentiment-analysis'
);

// When the user finishes typing
const sentimentResult = await transformersjsClassifierSentiment(review);
const { label, score } = sentimentResult[0];
if (score > SENTIMENT_THRESHOLD) {
  // The sentiment is `label`
} else {
  // Classification is not conclusive
}

Bewertung mit Gemma und MediaPipe vorschlagen

Mit der LLM Inference API können Sie Large Language Models (LLMs) vollständig im Browser ausführen.

Angesichts der Speicher- und Rechenanforderungen von LLMs, die über hundertmal größer sind als clientseitige Modelle, ist diese neue Funktion besonders transformativ. Dies wird durch Optimierungen im gesamten Web-Stack ermöglicht, einschließlich neuer Vorgänge, Quantisierung, Caching und Gewichtsfreigabe. Quelle: „Large Language Models On-Device with MediaPipe and TensorFlow Lite“

1. Installieren und importieren Sie die MediaPipe LLM-Inferenz-API.
2. Modell herunterladen Hier verwenden wir Gemma 2B, das von Kaggle heruntergeladen wurde. Gemma 2B ist das kleinste der offenen Modelle von Google.
3. Verweisen Sie den Code mit FilesetResolver auf die richtigen Modelldateien. Das ist wichtig, da generative KI-Modelle für ihre Assets möglicherweise eine bestimmte Verzeichnisstruktur haben.
4. Laden und konfigurieren Sie das Modell mit der LLM-Oberfläche von MediaPipe. Bereiten Sie das Modell für die Verwendung vor: Geben Sie den Modellstandort, die bevorzugte Länge der Antworten und die bevorzugte Kreativität bei der Temperatur an.
5. Geben Sie dem Modell einen Prompt (Beispiel ansehen).
6. Warten Sie auf die Antwort des Modells.
7. Bewertungen analysieren: Die Bewertung in Form von Sternen aus der Antwort des Modells extrahieren.

Hinweis: Die von uns verwendete Gemma-Variante ist anweisungsbasiert (siehe „it“ im Modellnamen). Das bedeutet, dass Sie wie bei Chatoberflächen wie Gemini oder ChatGPT über eine Anleitung mit dem Modell interagieren können.

import { FilesetResolver, LlmInference } from '@mediapipe/tasks-genai';

const mediaPipeGenAi = await FilesetResolver.forGenAiTasks();
const llmInference = await LlmInference.createFromOptions(mediaPipeGenAi, {
    baseOptions: {
        modelAssetPath: '/gemma-2b-it-gpu-int4.bin',
    },
    maxTokens: 1000,
    topK: 40,
    temperature: 0.5,
    randomSeed: 101,
});

const prompt = …
const output = await llmInference.generateResponse(prompt);

const int = /\d/;
const ratingAsString = output.match(int)[0];
rating = parseInt(ratingAsString);

Beispielaussage

Hinweis :Da Gemma 2B ein kleines LLM ist, benötigt es einen detaillierten Prompt, um zufriedenstellende Ergebnisse zu erzielen. Hier verwenden wir Techniken wie Prompts zur Gedankenkette und Few-Shot-Prompts.

const prompt = `Analyze a product review, and then based on your analysis give me the
corresponding rating (integer). The rating should be an integer between 1 and 5.
1 is the worst rating, and 5 is the best rating. A strongly dissatisfied review
that only mentions issues should have a rating of 1 (worst). A strongly
satisfied review that only mentions positives and upsides should have a rating
of 5 (best). Be opinionated. Use the full range of possible ratings (1 to 5). \n\n
  \n\n
  Here are some examples of reviews and their corresponding analyses and ratings:
  \n\n
  Review: 'Stylish and functional. Not sure how it'll handle rugged outdoor use,
  but it's perfect for urban exploring.'
  Analysis: The reviewer appreciates the product's style and basic
  functionality. They express some uncertainty about its ruggedness but overall
  find it suitable for their intended use, resulting in a positive, but not
  top-tier rating.
  Rating (integer): 4
  \n\n
  Review: 'It's a solid backpack at a decent price. Does the job, but nothing
  particularly amazing about it.'
  Analysis: This reflects an average opinion. The backpack is functional and
  fulfills its essential purpose. However, the reviewer finds it unremarkable
  and lacking any standout features deserving of higher praise.
  Rating (integer): 3
  \n\n
  Review: 'The waist belt broke on my first trip! Customer service was
  unresponsive too. Would not recommend.'
  Analysis: A serious product defect and poor customer service experience
  naturally warrants the lowest possible rating. The reviewer is extremely
  unsatisfied with both the product and the company.
  Rating (integer): 1
  \n\n
  Review: 'Love how many pockets and compartments it has. Keeps everything
  organized on long trips. Durable too!'
  Analysis: The enthusiastic review highlights specific features the user loves
  (organization and durability), indicating great satisfaction with the product.
  This justifies the highest rating.
  Rating (integer): 5
  \n\n
  Review: 'The straps are a bit flimsy, and they started digging into my
  shoulders under heavy loads.'
  Analysis: While not a totally negative review, a significant comfort issue
  leads the reviewer to rate the product poorly. The straps are a key component
  of a backpack, and their failure to perform well under load is a major flaw.
  Rating (integer): 1
  \n\n
  Now, here is the review you need to assess:
  \n
  Review: "${review}" \n`;

Fazit

Es sind keine KI-/ML-Kenntnisse erforderlich. Das Entwerfen eines Prompts erfordert Iterationen, aber der Rest des Codes entspricht der Standard-Webentwicklung.

Clientseitige Modelle sind ziemlich genau. Wenn Sie die Snippets aus diesem Dokument ausführen, sehen Sie, dass sowohl die Toxizitäts- als auch die Sentimentanalyse genaue Ergebnisse liefern. Die Gemma-Bewertungen stimmten größtenteils mit den Bewertungen des Gemini-Modells für einige getestete Referenzrezensionen überein. Um diese Richtigkeit zu bestätigen, sind weitere Tests erforderlich.

Das Entwerfen des Prompts für Gemma 2B ist jedoch mit Arbeit verbunden. Da Gemma 2B ein kleines LLM ist, benötigt es einen detaillierten Prompt, um zufriedenstellende Ergebnisse zu liefern – insbesondere im Vergleich zur Gemini API.

Inferenz kann blitzschnell sein. Wenn Sie die Snippets aus diesem Dokument ausführen, sollten Sie feststellen, dass die Inference auf einer Reihe von Geräten schnell, möglicherweise sogar schneller als Server-Roundtrips, erfolgen kann. Die Inferenzgeschwindigkeit kann jedoch stark variieren. Eine gründliche Benchmarking-Analyse auf den Zielgeräten ist erforderlich. Wir gehen davon aus, dass die Browser-Inferenz mit WebGPU, WebAssembly und Bibliotheksupdates immer schneller wird. In Transformers.js wird beispielsweise in Version 3 Web-GPU-Unterstützung hinzugefügt, wodurch die On-Device-Inferenz um ein Vielfaches beschleunigt werden kann.

Downloadgrößen können sehr groß sein. Inferenzen im Browser sind schnell, aber das Laden von KI-Modellen kann eine Herausforderung sein. Für die Ausführung von KI im Browser benötigen Sie in der Regel sowohl eine Bibliothek als auch ein Modell, was die Größe der Downloaddatei Ihrer Webanwendung erhöht.

Während das Tensorflow-Toxizitätsmodell (ein klassisches Modell für die Verarbeitung natürlicher Sprache) nur wenige Kilobyte groß ist, erreichen generative KI-Modelle wie das Standardmodell für die Sentimentanalyse von Transformers.js 60 MB. Large Language Models wie Gemma können bis zu 1,3 GB groß sein. Das übersteigt den Median von 2, 2 MB, der bereits weit über der für eine optimale Leistung empfohlenen Größe liegt. Clientseitige generative KI ist in bestimmten Szenarien sinnvoll.

Das Gebiet der generativen KI im Web entwickelt sich rasant weiter. Es wird erwartet, dass in Zukunft kleinere, weboptimierte Modelle auf den Markt kommen.

Nächste Schritte

In Chrome wird eine andere Möglichkeit getestet, generative KI im Browser auszuführen. Sie können sich für das Vorab-Vorschauprogramm registrieren, um es zu testen.