オンデバイスのウェブ AI で有益な商品レビューを促進

Maud Nalpas
Maud Nalpas
Kenji Baheux
Kenji Baheux
Alexandra Klepper
Alexandra Klepper

肯定的なレビューも否定的なレビューも、購入者の購入の意思決定に役立つ可能性があります。

外部調査によると、オンライン買い物客の 82% は、購入に先立ってネガティブな商品やサービス、 購入を決定する際の評価と言えますこのような否定的なレビューは 顧客や企業に対する利益を拡大します。否定的なレビューが公開されると、 返品率を減らし、メーカーの製品の改善に役立てることができます。

レビューの質を高める方法をいくつかご紹介します。

  • 送信前に各レビューに有害性がないか確認します。他のユーザーがより適切な購入の意思決定を行えるように、不適切な表現やその他の有用でないコメントを削除するようユーザーに促すことができます。
    • ネガティブ: このバッグは最悪です。嫌いです。
    • ネガティブで、参考になるフィードバックがある: ジッパーが非常に硬く、素材が安っぽいと感じます。このバッグを返品しました。
  • レビューで使用されている言語に基づいて評価を自動生成します。
  • レビューが否定的か肯定的かを判断します。
で確認できます。 <ph type="x-smartling-placeholder">
</ph> センチメントと星評価を含むレビュー例のスクリーンショット。
この例では、レビュー投稿者のコメントに肯定的な感情と 5 つ星の評価が付けられています。

最終的に、ユーザーに商品評価について最終的な言葉を伝えます。

次の Codelab では、デバイス上のブラウザ内でソリューションを提供します。AI なし API キーが必要です。

前提条件

ソリューション( Gemini API OpenAI API など)は、 説明します。このガイドでは、オンデバイス ウェブ AI に焦点を当てます。オンデバイス ウェブ AI ウェブユーザー エクスペリエンスを向上させるために、AI モデルをブラウザで実行します。 サーバー ラウンドトリップも不要です。

この Codelab では、さまざまな手法を使用して、ツールボックスの内容を紹介します。 構築しました

次のライブラリとモデルを使用します。

  • TensforFlow.js: 有害性分析。TensorFlow.js は、ウェブ上での推論とトレーニングの両方を行うオープンソースの ML ライブラリです。
  • transformers.js: 感情分析。Transformers.js は、Hugging Face のウェブ AI ライブラリです。
  • Gemma 2B: 星評価。Gemma は、Google が Gemini モデルの作成に使用した研究とテクノロジーに基づいて構築された、軽量なオープンモデルのファミリーです。ブラウザで Gemma を実行するために、MediaPipe の試験運用版の LLM Inference API とともに Gemma を使用します。

UX と安全性に関する考慮事項

最適なユーザー エクスペリエンスと安全性を確保するために、次の点を考慮してください。

  • ユーザーによる評価の編集を許可します。最終的には、ユーザーに最終版の 質問してください。
  • 評価とレビューが自動化されていることをユーザーに明示します。
  • 有害であると分類されたレビューの投稿をユーザーに許可するが、2 回目のチェックを実施する 表示されます。これにより、有害でないレビューが投稿されたユーザーに 誤って有害と分類されるケース(偽陽性)です。これには 不正なユーザーがクライアントサイドのチェックをバイパス
  • クライアントサイドの有害性チェックは有用ですが、回避することもできます。必ず サーバーサイドでもチェックできます

TensorFlow.js で有害性を分析する

TensorFlow.js を使用すると、ユーザー レビューの有害性の分析をすぐに開始できます。

  1. インストールインポート TensorFlow.js ライブラリと有害性モデルです。
  2. 予測最小信頼度を設定する。デフォルトは 0.85 で、この例では 0.9 に設定します
  3. モデルを非同期で読み込みます。
  4. レビューを非同期で分類します。予測は、1 対 1 の すべてのカテゴリのしきい値を 0.9 とします。

このモデルは、アイデンティティ攻撃、侮辱、わいせつなどで有害性を分類できます。

例:

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

Transformers.js で感情を特定する

  1. インストール Transformers.js ライブラリをインポートします。

  2. 感情分析を設定する タスク 専用のパイプラインを使用します。 パイプラインを初めて使用するときに、モデルがダウンロードされてキャッシュに保存されます。 それ以降、感情分析は非常に高速になります。

  3. レビューを非同期で分類します。カスタムのしきい値を使用してレベルを設定する 信頼度が高くなります。

例:

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
}

Gemma と MediaPipe で星評価を提案する

LLM Inference API を使用すると、大規模言語モデル(LLM)を完全に実行できます。 表示されます。

この新しい機能は、メモリとネットワーク インフラストラクチャの 大規模言語モデル(LLM)の 100 倍以上もの 従来のオンデバイス モデルと同じ機能を使用できます。オンデバイス スタック全体の最適化により、 これには新しいオペレーション、量子化、キャッシュ保存、重み共有が含まれます。 出典: 「Large Language Models On-Device with MediaPipe and TensorFlow Lite」

  1. インストールとインポート MediaPipe LLM 推論 API を使用します。
  2. モデルをダウンロードする。 ここでは、Gemma 2B を使用します。 (Kaggle からダウンロード) Gemma 2B は Google の最小オープンウェイト モデルです。
  3. FilesetResolver を使用して、コードが適切なモデルファイルを指すようにします。これは、 生成 AI モデルは特定のディレクトリ構造を持つ場合があるため、重要です。 確保できます。
  4. MediaPipe の LLM インターフェースでモデルを読み込んで構成する。準備する 使用するモデル: モデルの場所、希望する回答の長さ、 温度でどの程度の創造性が望ましいかを 指定できます
  5. モデルにプロンプトを入力します(例を参照)。
  6. モデルのレスポンスを待ちます。
  7. 評価の解析: モデルのレスポンスから星評価を抽出します。
で確認できます。
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);

質問の例

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

要点

AI/ML の専門知識は必要ありません。プロンプトの設計には反復処理が必要ですが 残りのコードは標準的なウェブ開発です。

デバイス上のモデルはかなり正確です。ここからスニペットを実行すると、 有害性分析と感情分析の両方で、 正確な結果を得られます。Gemma の評価はほとんどの場合、Gemini モデルと一致しています 検証済みのリファレンスレビューで 評価を得ましたその正確性を検証するため さらにテストが必要になります

とはいえ、Gemma 2B のプロンプトを設計するには多大な労力が必要です。Gemma 2B は 満足のいく結果を生成するには詳細なプロンプトが必要です。 Gemini API よりも詳細に出力されます。

推論は高速です。このドキュメントのスニペットを実行すると、 推論がサーバーよりも高速に 往復レイテンシを短縮できますとはいえ、推論速度は 非常に困難です。対象デバイスで徹底的なベンチマークを実施する必要があります。デバイス上に Web GPU、WebAssembly、ライブラリの更新により、推論を高速化 たとえば、Transformers.js は、 v3 での Web GPU のサポート これにより、デバイス上の推論を何倍も高速化できます。

ダウンロード サイズは非常に大きくなる場合があります。ブラウザでの推論は高速ですが、 AI モデルの読み込みは簡単ではありません。ブラウザ内 AI を実行するには、通常、 ライブラリとモデルの両方が必要で、ウェブアプリのダウンロード サイズが増えます。

TensorFlow の有害性モデル(古典的な自然言語処理モデル)は、 サイズがわずか数キロバイトの場合、Transformers.js のデフォルトの 最大 60 MB に到達しました。Gemma などの大規模言語モデルは、 最大 1.3GB です中央値を超えています 2.2 MB のウェブページサイズ 大幅に向上させることができますデバイス上 生成 AI は特定のシナリオで実行可能である。

ウェブの生成 AI の分野は急速に進化しています。小規模、 ウェブ用に最適化されたモデルは、 使用できます。

次のステップ

Chrome は、ブラウザで生成 AI を実行する別の方法をテストしています。 早期プレビュー プログラムに登録できます。 テストします。