क्लाइंट-साइड एआई की मदद से, प्रॉडक्ट की समीक्षा के सुझाव पाना

Maud Nalpas

पब्लिश करने की तारीख: 21 अक्टूबर, 2024

प्रॉडक्ट की समीक्षाएं दिखाकर, ऑनलाइन स्टोर को कन्वर्ज़न में 270% की बढ़ोतरी दिख सकती है. नकारात्मक समीक्षाएं भी अहम होती हैं, वे विश्वसनीयता बनाए रख पाते हैं. ऑनलाइन खरीदारी करने वाले 82% खरीदार, खरीदारी करने से पहले इनकी तलाश करते हैं.

खरीदारों को प्रॉडक्ट की मददगार समीक्षाएं करने के लिए बढ़ावा देना मुश्किल हो सकता है. खास तौर पर, जब समीक्षाएं खराब हों. यहां हम जनरेटिव एआई का इस्तेमाल करने का तरीका बताएंगे, ताकि उपयोगकर्ता ऐसी जानकारीपूर्ण समीक्षाएं लिख सकें जिनसे दूसरों को खरीदारी करने का फ़ैसला लेने में मदद मिल सके.

डेमो और कोड

प्रॉडक्ट की समीक्षा वाले डेमो को आज़माएं और GitHub पर कोड देखें.

हमने इसे कैसे बनाया

क्लाइंट-साइड एआई

इस डेमो में, हमने इन वजहों से सुविधा क्लाइंट-साइड लागू की है:

• इंतज़ार का समय. हम उपयोगकर्ता के टाइप करना बंद करने के तुरंत बाद, सुझाव देना चाहते हैं. हम सर्वर राउंड-ट्रिप से बचकर, यह सुविधा दे सकते हैं.
• लागत. यह एक डेमो है. अगर आपको प्रोडक्शन में मिलती-जुलती कोई सुविधा लॉन्च करनी है, तो सर्वर साइड की लागत के बिना प्रयोग करना बेहतर होगा. ऐसा तब तक करें, जब तक यह पुष्टि न हो जाए कि यह सुविधा आपके उपयोगकर्ताओं के लिए सही है या नहीं.

MediaPipe का जनरेटिव एआई

हमने आपको जेमा 2B मॉडल को MediaPipe एलएलएम इन्फ़रेंस एपीआई (MediaPipe GenAI पैकेज), नीचे दी गई वजहों से:

• मॉडल की सटीक जानकारी: Gemma 2B का साइज़ और सटीक दोनों ही बेहतरीन संतुलन है. टास्क कब शुरू होगा सही संकेत मिलने के बाद, हमें इस डेमो से ऐसे नतीजे मिले जो हमें संतोषजनक लगे.
• क्रॉस-ब्राउज़र सहायता: MediaPipe में काम करती है वेबजीपीयू के साथ काम करने वाले सभी ब्राउज़र.

उपयोगकर्ता अनुभव

परफ़ॉर्मेंस के लिए सबसे सही तरीके लागू करना

Gemma 2B एक छोटा एलएलएम है, लेकिन यह एक बड़ा डाउनलोड है. परफ़ॉर्मेंस के सबसे सही तरीके अपनाएं. इनमें वेब वर्कर्स का इस्तेमाल करना भी शामिल है.

सुविधा को वैकल्पिक बनाएं

हम एआई पर आधारित समीक्षा के सुझाव चाहते हैं, ताकि उपयोगकर्ता का वर्कफ़्लो बेहतर हो सके प्रॉडक्ट की समीक्षा. हमने इस सुविधा को इस तरह से लागू किया है कि उपयोगकर्ता तब भी समीक्षा पोस्ट कर सकता है, जब मॉडल लोड न हुआ हो और इसलिए, उसे सुधार के सुझाव न मिल रहे हों.

यूज़र इंटरफ़ेस (यूआई) की स्थितियां और ऐनिमेशन

आम तौर पर, अनुमान लगाने में तुरंत लगने वाले समय से ज़्यादा समय लगता है. इसलिए, हम उपयोगकर्ता को यह संकेत देते हैं कि मॉडल किसी अनुमान पर काम कर रहा है या "सोच रहा है." हम ऐनिमेशन का इस्तेमाल करके, उपयोगकर्ता को भरोसा दिलाते हैं कि ऐप्लिकेशन सही तरीके से काम कर रहा है. साथ ही, इंतज़ार का समय कम करने के लिए ऐनिमेशन का इस्तेमाल किया जाता है. ऐडम अर्गल के डिज़ाइन किए गए डेमो में, यूज़र इंटरफ़ेस (यूआई) के अलग-अलग स्टेटस देखें.

दूसरी ज़रूरी बातें

प्रोडक्शन एनवायरमेंट में, आपको ये काम करने की ज़रूरत पड़ सकती है:

• सुझाव/राय देने या शिकायत करने की सुविधा उपलब्ध कराएं. अगर सुझाव खराब हों या उनका कोई मतलब न हो, तो क्या करें? तुरंत सुझाव/राय देने या शिकायत करने की सुविधा लागू करें. जैसे, थंब अप और थंब डाउन. साथ ही, उपयोगकर्ताओं को क्या काम का लगता है, यह पता लगाने के लिए हेयुरिस्टिक्स का इस्तेमाल करें. उदाहरण के लिए, यह आकलन करें कि आपके कितने उपयोगकर्ता इस सुविधा के साथ इंटरैक्ट कर रहे हैं और क्या वे इसे बंद कर रहे हैं.
• ऑप्ट-आउट करने की अनुमति दें. अगर उपयोगकर्ता एआई की मदद के बिना अपने शब्दों का इस्तेमाल करना चाहता है या उसे यह सुविधा पसंद नहीं आती है, तो क्या होगा? उपयोगकर्ता को ऑप्ट-आउट करने और फिर से ऑप्ट-इन करने की अनुमति दें.
• बताएं कि यह सुविधा क्यों मौजूद है. कम शब्दों में दी जाने वाली जानकारी की मदद से, फ़ीडबैक टूल का इस्तेमाल करने के लिए. उदाहरण के लिए, "बेहतर फ़ीडबैक से साथी को इससे खरीदार तय करते हैं कि उन्हें क्या खरीदना है. साथ ही, इससे हमें आपके पसंदीदा प्रॉडक्ट बनाने में मदद मिलती है." आपने लोगों तक पहुंचाया मुफ़्त में इस बात की काफ़ी जानकारी दी जा सकती है कि यह सुविधा कैसे काम करती है और आपने ऐसा क्यों किया है यह जानकारी, लिंक किए गए विषय के बारे में ज़्यादा जानकारी मिलेगी.
• जहां ज़रूरी हो वहां एआई के इस्तेमाल के बारे में बताएं. क्लाइंट-साइड एआई की मदद से, उपयोगकर्ता का कॉन्टेंट को प्रोसेस करने के लिए सर्वर के पास नहीं भेजा जाता, इसलिए इसे निजी रखा जा सकता है. हालांकि, अगर सर्वर-साइड फ़ॉलबैक बनाते हैं या एआई की मदद से जानकारी इकट्ठा करते हैं, इसे अपनी निजता नीति, सेवा की शर्तों या दूसरी जगहों पर जोड़ने के बारे में सोचें.

लागू करना

प्रॉडक्ट की समीक्षा के सुझाव देने वाली सुविधा को लागू करने का हमारा तरीका, इस्तेमाल के कई उदाहरणों के लिए काम कर सकता है. इस जानकारी को अपने भविष्य के लिए आधार मानें क्लाइंट-साइड एआई की सुविधाएं उपलब्ध हैं.

वेब वर्कर्स में MediaPipe

MediaPipe एलएलएम इंफ़रेंस की मदद से, एआई कोड सिर्फ़ कुछ लाइनों में लिखा जा सकता है: मॉडल का यूआरएल डालकर, फ़ाइल रिज़ॉल्वर और एलएलएम इंफ़रेंस ऑब्जेक्ट बनाएं. इसके बाद, जवाब जनरेट करने के लिए, एलएलएम इंफ़रेंस इंस्टेंस का इस्तेमाल करें.

हालांकि, हमारा कोड सैंपल थोड़ा बड़ा है. ऐसा इसलिए, क्योंकि लागू किया जाता है, ताकि यह मुख्य स्क्रिप्ट के साथ मैसेज पास कर सके कस्टम मैसेज कोड. इस पैटर्न के बारे में ज़्यादा जानें.

// Trigger model preparation *before* the first message arrives
self.postMessage({ code: MESSAGE_CODE.PREPARING_MODEL, payload: null });
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, payload: null });
} catch (error) {
  self.postMessage({ code: MESSAGE_CODE.MODEL_ERROR, payload: null });
}

// Trigger inference upon receiving a message from the main script
self.onmessage = function (message) {
  if (!llmInference) {
    // Just in case. This condition shouldn't normally be hit because
    // the inference UI button is disabled until the model is ready
    throw new Error("Can't run inference, the model is not ready yet");
  }
  (async function () {
    // Run inference = Generate an LLM response
    try {
    const 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, payload: null });
    }
    // 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',
};

इनपुट और आउटपुट

हमारा पूरा प्रॉम्प्ट को इसके साथ बनाया गया था कुछ शॉट में प्रॉम्प्ट. इसमें उपयोगकर्ता का इनपुट या दूसरे शब्दों में, उपयोगकर्ता के पास मौजूद समीक्षा का ड्राफ़्ट शामिल है लिखा गया है.

उपयोगकर्ता के इनपुट के आधार पर अपना प्रॉम्प्ट जनरेट करने के लिए, हम रनटाइम के समय अपनी यूटिलिटी को कॉल करते हैं फ़ंक्शन generatePrompt.

क्लाइंट-साइड एआई मॉडल और लाइब्रेरी में, आम तौर पर कम सुविधाएं होती हैं. सर्वर-साइड एआई. उदाहरण के लिए, अक्सर JSON मोड उपलब्ध नहीं होता. इसका मतलब है कि हमें अपने प्रॉम्प्ट में, अपनी पसंद के मुताबिक आउटपुट का स्ट्रक्चर देना होगा. यह तरीका, मॉडल कॉन्फ़िगरेशन के ज़रिए स्कीमा उपलब्ध कराने के मुकाबले कम बेहतर, मैनेज करने में मुश्किल, और भरोसेमंद नहीं है. इसके अलावा, क्लाइंट-साइड मॉडल छोटे होते हैं. इसका मतलब है कि उनके आउटपुट में स्ट्रक्चर से जुड़ी गड़बड़ियां होने की संभावना ज़्यादा होती है.

व्यावहारिक तौर पर, हमने देखा कि Gemma 2B JSON या JavaScript की तुलना में टेक्स्ट के तौर पर स्ट्रक्चर्ड आउटपुट. इसलिए, इस डेमो के लिए, हमने टेक्स्ट पर आधारित आउटपुट फ़ॉर्मैट चुना है. मॉडल, टेक्स्ट जनरेट करता है. इसके बाद, हमारे वेब पर आगे की प्रोसेस के लिए, आउटपुट को JavaScript ऑब्जेक्ट में पार्स करना है.

प्रॉम्प्ट को बेहतर बनाना

अपने सवाल को दोहराने के लिए, हमने एलएलएम का इस्तेमाल किया.

• उदाहरण के साथ डाले गए प्रॉम्प्ट. कुछ शॉट वाले प्रॉम्प्ट के उदाहरण जनरेट करने के लिए, हम Gemini Chat पर निर्भर करता था. Gemini Chat सबसे ज़्यादा Gemini के बेहतरीन मॉडल. इससे यह पक्का हुआ कि हमने अच्छी क्वालिटी के उदाहरण जनरेट किए हैं.
• प्रॉम्प्ट को बेहतर बनाना. प्रॉम्प्ट का स्ट्रक्चर तैयार होने के बाद, हमने प्रॉम्प्ट को बेहतर बनाने के लिए, Gemini Chat का भी इस्तेमाल किया. इससे आउटपुट क्वालिटी में सुधार हुआ.

क्वालिटी बेहतर बनाने के लिए कॉन्टेक्स्ट का इस्तेमाल करें

हमारे प्रॉम्प्ट में प्रॉडक्ट टाइप शामिल करने से, मॉडल को ज़्यादा बेहतर नतीजे पाने में मदद मिली और अच्छी क्वालिटी के लिए काम के सुझाव देते हैं. इस डेमो में, प्रॉडक्ट टाइप को स्टैटिक किया गया है. असल ऐप्लिकेशन में, प्रॉडक्ट को डाइनैमिक तौर पर अपने उपयोगकर्ता के विज़िट किए गए पेज के मुताबिक प्रॉम्प्ट.

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."

हमारे प्रॉम्प्ट के कुछ शॉट सेक्शन में इसका एक उदाहरण दिया गया है: प्रॉडक्ट टाइप ("socks") प्रॉडक्ट को, सुझाए गए सुधार और उदाहरण के तौर पर दी गई समीक्षा में शामिल किया गया है.

एलएलएम से जुड़ी गड़बड़ियां और उन्हें ठीक करना

Gemma 2B के लिए आम तौर पर, प्रॉम्प्ट इंजीनियरिंग शक्तिशाली, बड़ा सर्वर-साइड मॉडल.

हमें Gemma 2B में कुछ समस्याएं आ रही हैं. हमने नतीजों को बेहतर बनाने के लिए ये काम किए हैं:

• बहुत बढ़िया. Gemma 2B को समीक्षाओं को "काम का नहीं है" के तौर पर मार्क करने में मुश्किल हो रही थी. ऐसा लगता है कि वह इस फ़ैसले को लेकर थोड़ा झिझक रही थी. हमने लेबल की भाषा में सभी का कोई भेदभाव करने की कोशिश की ("मददगार" और "मददगार नहीं है" के बजाय, "खास" और "अनिर्दिष्ट" के रूप में मार्क किया गया है) और लेकिन इससे नतीजों में कोई सुधार नहीं हुआ. नतीजों में क्या सुधार हुआ का सुझाव देने और उसे दोहराना. अलग-अलग सोच वाला तरीका अपनाने से भी सुधार हो सकता है.

• निर्देश साफ़ तौर पर नहीं दिए गए हैं. इस मॉडल ने कभी-कभी प्रॉम्प्ट को बहुत ज़्यादा समझा. समीक्षा का आकलन करने के बजाय, इसने उदाहरण की सूची का इस्तेमाल किया. इसे ठीक करने के लिए, हमने प्रॉम्प्ट में ट्रांज़िशन के बारे में साफ़ तौर पर बताया है:

  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>
  

  प्रॉम्प्ट को साफ़ तौर पर स्ट्रक्चर करने से, मॉडल को यह पता लगाने में मदद मिलती है कि उदाहरण सूची (कुछ शॉट) और वास्तविक इनपुट शामिल करें.

• गलत टारगेट. कभी-कभी, मॉडल ने प्रॉडक्ट में बदलाव करने के सुझाव दिए होते हैं शब्दों में जानकारी दें. उदाहरण के लिए, "मुझे ये जूते पसंद नहीं हैं" वाली समीक्षा के लिए, मॉडल यह सुझाव दे सकता है कि "जूतों को किसी दूसरे ब्रैंड या स्टाइल से बदलें". हालांकि, यह सुझाव सही नहीं है. प्रॉम्प्ट को अलग-अलग हिस्सों में बांटने से, टास्क को समझने में मदद मिली. साथ ही, मॉडल की समीक्षा पर फ़ोकस करने की क्षमता भी बेहतर हुई.