İstemci tarafı yapay zeka ile ürün yorum önerilerini inceleyin

Maud Nalpas
Maud Nalpas

Yayınlanma tarihi: 21 Ekim 2024

Online mağazalar, ürün yorumlarını göstererek dönüşümlerde % 270 artış elde edebilir. Güvenilirlik açısından olumsuz yorumlar da önemlidir. Online alışveriş yapanların %82'si satın almadan önce bu bilgileri araştırıyor.

Müşterileri, özellikle olumsuz yorumlar söz konusu olduğunda faydalı ürün yorumları bırakmaya teşvik etmek zor olabilir. Bu makalede, kullanıcıların diğer kullanıcıların satın alma kararlarına yardımcı olacak bilgilendirici yorumlar yazmasına yardımcı olmak için üretken yapay zekanın nasıl kullanılacağını inceleyeceğiz.

Demo ve kod

Ürün incelemesi demomuzu inceleyin ve GitHub'daki kodu inceleyin.

Bu raporu nasıl oluşturduk?

İstemci tarafı yapay zeka

Bu demoda, özelliği aşağıdaki nedenlerle istemci tarafında uyguladık:

  • Gecikme. Kullanıcı yazmayı bıraktığında önerileri hızlı bir şekilde sunmak isteriz. Sunucu gidiş gelişlerini önleyerek bunu sunabiliriz.
  • Maliyet. Bu bir demo olsa da üretimde benzer bir özellik kullanıma sunmayı düşünüyorsanız özelliğin kullanıcılarınız için uygun olup olmadığını doğrulayana kadar sunucu tarafı maliyeti olmadan deneme yapabilirsiniz.

MediaPipe üretken yapay zeka

Aşağıdaki nedenlerden dolayı MediaPipe LLM Tahmin API (MediaPipe GenAI paketi) üzerinden Gemma 2B modelini kullanmayı tercih ettik:

  • Model doğruluğu: Gemma 2B, boyut ve doğruluk arasında mükemmel bir denge sunar. Doğru şekilde istendiğinde, bu demo için tatmin edici bulduğumuz sonuçlar verdi.
  • Tarayıcılar arası destek: MediaPipe, WebGPU'yu destekleyen tüm tarayıcılarda desteklenir.

Kullanıcı deneyimi

Performansla ilgili en iyi uygulamaları uygulayın

Gemma 2B küçük bir LLM olsa da indirme boyutu büyüktür. Web işleyici kullanmayı da içeren performansla ilgili en iyi uygulamaları uygulayın.

Özelliği isteğe bağlı hale getirme

Yapay zeka tabanlı yorum önerilerinin, kullanıcının ürün yorumu yayınlama iş akışını iyileştirmesini istiyoruz. Uygulamamızda, model yüklenmemiş olsa bile kullanıcı yorum yayınlayabilir ve bu nedenle iyileştirme ipuçları sunulmaz.

Şekil 1. Kullanıcılar, yapay zeka özelliği henüz kullanıma sunulmamış olsa bile yorumlarını yayınlamaya devam edebilir.

Kullanıcı arayüzü durumları ve animasyonları

Çıkarsama işlemi genellikle anında hissedilenden daha uzun sürer. Bu nedenle, kullanıcıya modelin çıkarım yaptığını veya "düşündüğünü" bildiririz. Bekleme süresini kısaltmak ve kullanıcıya uygulamanın amaçlandığı gibi çalıştığından emin olmak için animasyonlar kullanırız. Adam Argyle tarafından tasarlanan ve demomuzda uyguladığımız farklı kullanıcı arayüzü durumlarını keşfedin.

Şekil 2. Animasyonlar, modelin yüklendiğini, ardından "düşündüğünü" ve sonunda işlemin tamamlandığını gösterir.

Dikkat edilmesi gereken diğer noktalar

Üretim ortamında şunları yapabilirsiniz:

  • Geri bildirim mekanizması sağlayın. Önerilerin kalitesi düşükse veya anlamlı değilse ne olur? Beğenme ve beğenmeme gibi hızlı bir geri bildirim mekanizması uygulayın ve kullanıcıların neleri yararlı bulduğunu belirlemek için sezgilerden yararlanın. Örneğin, kaç kullanıcınızın bu özellikle etkileşimde bulunduğunu ve özelliği devre dışı bırakıp bırakmadığını değerlendirin.
  • Kapsam dışında kalmayı etkinleştirin. Kullanıcı yapay zeka yardımı olmadan kendi kelimelerini kullanmayı tercih ederse veya özelliği rahatsız edici bulursa ne olur? Kullanıcının dilediğinde devre dışı bırakıp etkinleştirmesine izin verin.
  • Bu özelliğin neden bulunduğunu açıklayın. Kısa bir açıklama, kullanıcılarınızı geri bildirim aracını kullanmaya teşvik edebilir. Örneğin, "Daha iyi geri bildirimler, diğer alışveriş yapan kullanıcıların ne satın alacağına karar vermesine ve istediğiniz ürünleri üretmemize yardımcı olur." Özelliğin işleyiş şekli ve neden sunduğunuzla ilgili uzun bir açıklama ekleyebilirsiniz. Bu açıklamayı, daha fazla bilgi için bağlantı vererek de ekleyebilirsiniz.
  • Uygun durumlarda yapay zeka kullanımı hakkında bilgi verin. İstemci tarafı yapay zeka sayesinde kullanıcının içeriği işlenmek üzere bir sunucuya gönderilmez ve bu nedenle gizli tutulabilir. Ancak sunucu tarafı yedek bir çözüm oluşturursanız veya yapay zeka ile başka bir şekilde bilgi toplarsanız bunu gizlilik politikanıza, hizmet şartlarınıza veya başka yerlere ekleyebilirsiniz.

Uygulama

Ürün yorumu öneren aracımız, çok çeşitli kullanım alanları için işe yarayabilir. Gelecekte sunacağınız istemci tarafı yapay zeka özellikleri için aşağıdaki bilgileri temel alabilirsiniz.

Web işçisinde MediaPipe

MediaPipe LLM çıkarımıyla yapay zeka kodu yalnızca birkaç satırdan oluşur: Bir dosya çözücü ve LLM çıkarım nesnesi oluşturun, ardından bir model URL'si ile gönderin ve daha sonra yanıt oluşturmak için bu LLM çıkarım örneğini kullanın.

Ancak kod örneğimiz biraz daha kapsamlı. Bunun nedeni, bir web işçisinde uygulanmış olmasıdır. Bu nedenle, ana komut dosyası ile iletileri özel mesaj kodları üzerinden iletir. Bu model hakkında daha fazla bilgi edinin.

// 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',
};

Giriş ve çıkış

Şekil 3. İstemlerin, ham LLM çıkışına dayalı çıkarım yoluyla işlenmesini ve ardından görüntülenmek üzere okunacak bir öneriye ayrıştırılmasını gösteren bir diyagram.

Tam istemimiz, çok görevli istem ile oluşturuldu. Kullanıcının girişini veya başka bir deyişle, yazdığı yorum taslağını içerir.

İstemimizi kullanıcı girişine göre oluşturmak için çalışma zamanında generatePrompt yardımcı program işlevimizi çağırıyoruz.

İstemci tarafı yapay zeka modelleri ve kitaplıkları genellikle sunucu tarafı yapay zekaya kıyasla daha az yardımcı program içerir. Örneğin, JSON modu genellikle kullanılamaz. Bu nedenle, istemimize istenen çıkış yapısını sağlamamız gerekir. Bu yöntem, model yapılandırması aracılığıyla şema sağlamaya kıyasla daha az temiz, sürdürülebilir ve güvenilirdir. Ayrıca istemci tarafı modeller genellikle daha küçüktür. Bu da çıktılarında yapısal hatalara daha yatkın oldukları anlamına gelir.

Uygulamada, Gemma 2B'nin JSON veya JavaScript'e kıyasla metin olarak yapılandırılmış bir çıkış sağlama konusunda daha iyi performans gösterdiğini gözlemledik. Bu nedenle, bu demo için metne dayalı bir çıkış biçimi tercih ettik. Model, metin oluşturur. Ardından, web uygulamamızda daha fazla işleme tabi tutulması için çıkışı bir JavaScript nesnesine ayrıştırırız.

İstemimizi iyileştirme

Gemini Chat arayüzündeki istemim ve yanıtı.
Şekil 4. Gemini Chat'ten istemimizi iyileştirmesini istedik. Gemini Chat, hangi iyileştirmelerin yapıldığını ve etkililik hakkında bir uyarıyı da ekleyerek yanıt verdi.

İstemimizi iterasyonla işlemek için bir LLM kullandık.

  • Çok görevli istem. Çok görevli istemlerimiz için örnekleri Gemini Chat'i kullanarak oluşturduk. Gemini Chat, en güçlü Gemini modellerini kullanır. Bu sayede yüksek kaliteli örnekler oluşturduk.
  • İstemleri düzeltme. İstem hazır olduğunda, istemi hassaslaştırmak için Gemini Chat'i de kullandık. Bu sayede çıkış kalitesi iyileştirildi.

Kaliteyi artırmak için bağlamı kullanma

Ürün türünü istemimize dahil etmek, modelin daha alakalı ve daha yüksek kaliteli öneriler sunmasına yardımcı oldu. Bu demoda ürün türü statiktir. Gerçek bir uygulamada, ürünü kullanıcının ziyaret ettiği sayfaya göre isteminize dinamik olarak dahil edebilirsiniz.

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

İstemimizin birkaç çekim bölümündeki örneklerden biri: Ürün türü ("çoraplar") önerilen düzeltmeye ve örnek incelemeye dahil edilmiştir.

LLM ile ilgili hatalar ve düzeltmeler

Gemma 2B, genellikle daha güçlü ve daha büyük sunucu tarafı modellerden daha fazla mühendislik çalışması gerektirir.

Gemma 2B ile ilgili bazı zorluklarla karşılaştık. Sonuçları nasıl iyileştirdik?

  • Çok güzel. Gemma 2B, yorumları "yararlı değil" olarak işaretlemekte zorlandı ve yorumları değerlendirmekte tereddüt etti. Etiket dilini daha tarafsız hale getirmeye ("yararlı" ve "yararsız" yerine "belirli" ve "belirsiz") çalıştık ve örnekler ekledik ancak bu durum sonuçları iyileştirmedi. Sonuçları iyileştiren ise istemde ısrar ve tekrar oldu. Düşünce zinciri yaklaşımı da muhtemelen iyileştirmeler sağlayacaktır.
  • Talimatlar net değil. Model bazen istemi fazla yorumladı. İnceleme yerine örnek listeye devam etti. Bu sorunu düzeltmek için istemde net bir geçiş ekledik:

    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>
    

    İstem net bir şekilde yapılandırıldığında model, örnek liste (az sayıda çekim) ile gerçek giriş arasında ayrım yapabilir.

  • Yanlış hedef. Bazen model, yorum metni yerine üründe değişiklik yapılmasını öneriyordu. Örneğin, "Bu çoraplardan nefret ediyorum" ifadesini içeren bir yorum için model, "Çorapları farklı bir marka veya modelle değiştirmeyi düşünebilirsiniz" önerisinde bulunabilir. Bu, istenen sonuç değildir. İstem bölünerek görevin netleştirilmesi sağlandı ve modelin incelemeye odaklanmasını iyileştirildi.