पब्लिश करने की तारीख: 21 अक्टूबर, 2024
प्रॉडक्ट की समीक्षाएं दिखाकर, ऑनलाइन स्टोर को कन्वर्ज़न में 270% की बढ़ोतरी दिख सकती है. नेगेटिव समीक्षाएं भी अहम होती हैं, क्योंकि इनसे आपके कारोबार की विश्वसनीयता बढ़ती है. ऑनलाइन खरीदारी करने वाले 82% खरीदार, खरीदारी करने से पहले इनकी खोज करते हैं.
खरीदारों को प्रॉडक्ट की मददगार समीक्षाएं करने के लिए बढ़ावा देना मुश्किल हो सकता है. खास तौर पर, जब समीक्षाएं खराब हों. यहां हम जनरेटिव एआई का इस्तेमाल करने का तरीका बताएंगे, ताकि उपयोगकर्ता ऐसी जानकारीपूर्ण समीक्षाएं लिख सकें जिनसे दूसरों को खरीदारी के फ़ैसले लेने में मदद मिल सके.
डेमो और कोड
प्रॉडक्ट की समीक्षा वाले डेमो को आज़माएं और GitHub पर कोड देखें.
हमने इसे कैसे बनाया
क्लाइंट-साइड एआई
इस डेमो के लिए, हमने क्लाइंट-साइड पर इस सुविधा को लागू किया है. ऐसा इन वजहों से किया गया है:
- इंतज़ार का समय. हम उपयोगकर्ता के टाइप करना बंद करने के तुरंत बाद, सुझाव देना चाहते हैं. हम सर्वर राउंड-ट्रिप से बचकर, यह सुविधा दे सकते हैं.
- लागत. यह एक डेमो है. अगर आपको प्रोडक्शन में मिलती-जुलती कोई सुविधा लॉन्च करनी है, तो सर्वर साइड की लागत के बिना प्रयोग करना बेहतर होगा. ऐसा तब तक करें, जब तक यह पुष्टि न हो जाए कि यह सुविधा आपके उपयोगकर्ताओं के लिए सही है या नहीं.
MediaPipe का जनरेटिव एआई
हमने इन वजहों से, MediaPipe LLM Inference API (MediaPipe GenAI पैकेज) के ज़रिए Gemma 2B मॉडल का इस्तेमाल करने का फ़ैसला लिया है:
- मॉडल की सटीक जानकारी: Gemma 2B, साइज़ और सटीक जानकारी के बीच बेहतर संतुलन देता है. सही तरीके से पूछे जाने पर, हमें इस डेमो के लिए बेहतर नतीजे मिले.
- अलग-अलग ब्राउज़र पर काम करना: MediaPipe, WebGPU के साथ काम करने वाले सभी ब्राउज़र पर काम करता है.
उपयोगकर्ता अनुभव
परफ़ॉर्मेंस के लिए सबसे सही तरीके लागू करना
Gemma 2B एक छोटा एलएलएम है, लेकिन इसे डाउनलोड करने में ज़्यादा समय लगता है. परफ़ॉर्मेंस के सबसे सही तरीके अपनाएं. इनमें वेब वर्कर्स का इस्तेमाल करना भी शामिल है.
इस सुविधा को वैकल्पिक बनाना
हम चाहते हैं कि एआई के आधार पर समीक्षा के सुझाव, प्रॉडक्ट की समीक्षा पोस्ट करने के लिए उपयोगकर्ता के वर्कफ़्लो को बेहतर बनाएं. हमने इस सुविधा को इस तरह से लागू किया है कि उपयोगकर्ता तब भी समीक्षा पोस्ट कर सकता है, जब मॉडल लोड न हुआ हो और इसलिए, उसे सुधार के सुझाव न मिल रहे हों.
यूज़र इंटरफ़ेस के स्टेटस और ऐनिमेशन
आम तौर पर, अनुमान लगाने में ज़्यादा समय लगता है, जो तुरंत नहीं लगता. इसलिए, हम उपयोगकर्ता को बताते हैं कि मॉडल अनुमान लगा रहा है या "सोच रहा है". हम एनिमेशन का इस्तेमाल करके, उपयोगकर्ताओं को यह भरोसा दिलाते हैं कि ऐप्लिकेशन सही तरीके से काम कर रहा है. इससे, उन्हें इंतज़ार करने में आसानी होती है. ऐडम अर्गल के डिज़ाइन किए गए डेमो में, यूज़र इंटरफ़ेस (यूआई) के अलग-अलग स्टेटस देखें.
दूसरी ज़रूरी बातें
प्रोडक्शन एनवायरमेंट में, ये काम किए जा सकते हैं:
- सुझाव/राय देने या शिकायत करने की सुविधा उपलब्ध कराएं. अगर सुझाव खराब हों या उनका कोई मतलब न हो, तो क्या करें? तुरंत सुझाव/राय देने या शिकायत करने की सुविधा लागू करें. जैसे, पसंद और नापसंद करने की सुविधा. साथ ही, उपयोगकर्ताओं को क्या काम का लगता है, यह पता लगाने के लिए हेयुरिस्टिक्स का इस्तेमाल करें. उदाहरण के लिए, यह आकलन करें कि आपके कितने उपयोगकर्ता इस सुविधा के साथ इंटरैक्ट कर रहे हैं और क्या वे इसे बंद करते हैं.
- ऑप्ट-आउट करने की अनुमति दें. अगर उपयोगकर्ता एआई की मदद के बिना अपने शब्दों का इस्तेमाल करना चाहता है या उसे यह सुविधा पसंद नहीं आती है, तो क्या होगा? उपयोगकर्ता को ऑप्ट-आउट करने और फिर से ऑप्ट-इन करने की अनुमति दें.
- बताएं कि यह सुविधा क्यों मौजूद है. कम शब्दों में जानकारी देने से, आपके उपयोगकर्ताओं को फ़ीडबैक टूल का इस्तेमाल करने के लिए बढ़ावा मिल सकता है. उदाहरण के लिए, "सुझाव/राय/शिकायत से, खरीदारों को यह तय करने में मदद मिलती है कि उन्हें क्या खरीदना है. साथ ही, इससे हमें आपके हिसाब से प्रॉडक्ट बनाने में मदद मिलती है." इस सुविधा के काम करने के तरीके और इसे उपलब्ध कराने की वजह के बारे में ज़्यादा जानकारी दी जा सकती है. इसके लिए, ज़्यादा जानें लिंक जोड़ा जा सकता है.
- जहां ज़रूरी हो वहां एआई के इस्तेमाल के बारे में बताएं. क्लाइंट-साइड एआई की मदद से, उपयोगकर्ता के कॉन्टेंट को प्रोसेस करने के लिए सर्वर पर नहीं भेजा जाता. इसलिए, उसे निजी रखा जा सकता है. हालांकि, अगर आपने सर्वर-साइड फ़ॉलबैक बनाया है या एआई की मदद से जानकारी इकट्ठा की है, तो इसे अपनी निजता नीति, सेवा की शर्तों या अन्य जगहों पर जोड़ें.
लागू करना
प्रॉडक्ट की समीक्षा के सुझाव देने वाली सुविधा को लागू करने का हमारा तरीका, इस्तेमाल के कई उदाहरणों के लिए काम कर सकता है. आने वाले समय में क्लाइंट-साइड एआई की सुविधाओं के लिए, इस जानकारी को आधार के तौर पर इस्तेमाल करें.
वेब वर्कर्स में MediaPipe
MediaPipe एलएलएम इंफ़रेंस की मदद से, एआई कोड सिर्फ़ कुछ लाइनों में लिखा जा सकता है: मॉडल का यूआरएल डालकर, फ़ाइल रिज़ॉल्वर और एलएलएम इंफ़रेंस ऑब्जेक्ट बनाएं. इसके बाद, जवाब जनरेट करने के लिए उस एलएलएम इंफ़रेंस इंस्टेंस का इस्तेमाल करें.
हालांकि, हमारा कोड सैंपल थोड़ा बड़ा है. ऐसा इसलिए है, क्योंकि इसे वेब वर्कर्स में लागू किया गया है. इसलिए, यह मुख्य स्क्रिप्ट के साथ मैसेज को पसंद के मुताबिक मैसेज कोड के ज़रिए पास करता है. इस पैटर्न के बारे में ज़्यादा जानें.
// 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',
};
इनपुट और आउटपुट
हमारा पूरा प्रॉम्प्ट, उदाहरण के साथ डाले गए प्रॉम्प्ट की मदद से बनाया गया था. इसमें उपयोगकर्ता का इनपुट या दूसरे शब्दों में, समीक्षा का वह ड्राफ़्ट शामिल होता है जिसे उपयोगकर्ता ने लिखा है.
उपयोगकर्ता के इनपुट के आधार पर प्रॉम्प्ट जनरेट करने के लिए, हम रनटाइम पर अपने यूटिलिटी फ़ंक्शन generatePrompt
को कॉल करते हैं.
क्लाइंट-साइड एआई मॉडल और लाइब्रेरी में, आम तौर पर सर्वर-साइड एआई की तुलना में कम सुविधाएं होती हैं. उदाहरण के लिए, अक्सर JSON मोड उपलब्ध नहीं होता. इसका मतलब है कि हमें अपने प्रॉम्प्ट में, अपनी पसंद के मुताबिक आउटपुट का स्ट्रक्चर देना होगा. यह मॉडल कॉन्फ़िगरेशन के ज़रिए स्कीमा उपलब्ध कराने के मुकाबले कम बेहतर, मैनेज करने में मुश्किल, और भरोसेमंद नहीं है. इसके अलावा, क्लाइंट-साइड मॉडल छोटे होते हैं. इसका मतलब है कि उनके आउटपुट में स्ट्रक्चर से जुड़ी गड़बड़ियां होने की संभावना ज़्यादा होती है.
हमने पाया है कि JSON या JavaScript की तुलना में, Gemma 2B, टेक्स्ट के तौर पर स्ट्रक्चर्ड आउटपुट देने में बेहतर परफ़ॉर्म करता है. इसलिए, इस डेमो के लिए, हमने टेक्स्ट पर आधारित आउटपुट फ़ॉर्मैट चुना है. मॉडल टेक्स्ट जनरेट करता है. इसके बाद, हम अपने वेब ऐप्लिकेशन में आगे की प्रोसेसिंग के लिए, आउटपुट को JavaScript ऑब्जेक्ट में पार्स करते हैं.
प्रॉम्प्ट को बेहतर बनाना
हमने अपने प्रॉम्प्ट पर बार-बार काम करने के लिए, एलएलएम का इस्तेमाल किया.
- उदाहरण के साथ डाले गए प्रॉम्प्ट. फ़ew-शॉट प्रॉम्प्ट के लिए उदाहरण जनरेट करने के लिए, हमने 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."
हमारे प्रॉम्प्ट के कुछ शॉट वाले सेक्शन में मौजूद एक उदाहरण: सुझाई गई समस्या को ठीक करने के तरीके और उदाहरण की समीक्षा में, प्रॉडक्ट टाइप ("सॉक्स") शामिल है.
एलएलएम से जुड़ी गड़बड़ियां और उन्हें ठीक करना
आम तौर पर, 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>
प्रॉम्प्ट को साफ़ तौर पर स्ट्रक्चर करने से, मॉडल को उदाहरण की सूची (कुछ शॉट) और असल इनपुट के बीच अंतर करने में मदद मिलती है.
गलत टारगेट. कभी-कभी, मॉडल ने समीक्षा के टेक्स्ट के बजाय प्रॉडक्ट में बदलाव करने का सुझाव दिया. उदाहरण के लिए, "मुझे ये जूते पसंद नहीं हैं" वाली समीक्षा के लिए, मॉडल यह सुझाव दे सकता है कि "जूतों को किसी दूसरे ब्रैंड या स्टाइल से बदलें". हालांकि, यह सुझाव सही नहीं है. प्रॉम्प्ट को अलग-अलग हिस्सों में बांटने से, टास्क को समझने में मदद मिली. साथ ही, समीक्षा पर मॉडल का फ़ोकस बेहतर हुआ.