Opublikowano: 21 października 2024 r.
Sklepy internetowe mogą odnotować wzrost liczby konwersji o 270% dzięki wyświetlaniu opinii o produktach. Negatywne opinie są również ważne, ponieważ budują wiarygodność. 82% kupujących online szuka ich przed zakupem.
Zachęcanie klientów do zamieszczania przydatnych opinii o produktach, zwłaszcza negatywnych, może być trudne. Dowiesz się, jak wykorzystać generatywną AI, aby pomóc użytkowników piszą przydatne opinie, które pomagają innym decyzji o zakupie.
Wersja demonstracyjna i kod
Wypróbuj nasze prezentacja opinii o produktach i przeanalizować w GitHubie.
Jak to powstało
AI po stronie klienta
Na potrzeby tej prezentacji wdrożyliśmy tę funkcję po stronie klienta z tych powodów:
- Czas oczekiwania. Chcemy szybko wyświetlać sugestie, gdy tylko użytkownik przestanie pisać. Możemy to zapewnić, unikając przesyłania danych z serwerów w obie strony.
- Koszt. To jest wersja demonstracyjna, ale jeśli rozważasz wdrożenie podobnej funkcji w wersji produkcyjnej, możesz przeprowadzić eksperyment bez żadnych kosztów po stronie serwera, dopóki nie upewnisz się, że ta funkcja jest przydatna dla użytkowników.
Generatywne AI w MediaPipe
Zdecydowaliśmy się na użycie Gemma 2B za pomocą funkcji Interfejs MediaPipe LLM Inference API (pakiet MediaPipe GenAI), z następujących powodów:
- Dokładność modelu: Gemma 2B zapewnia doskonały balans między rozmiarem a dokładnością. Gdy został odpowiednio skonfigurowany, uzyskał wyniki, które w przypadku tego pokazu są wystarczające.
- Obsługa w różnych przeglądarkach: MediaPipe jest obsługiwany we wszystkich przeglądarkach, które obsługują WebGPU.
Interfejs użytkownika
Stosowanie sprawdzonych metod dotyczących skuteczności
Gemma 2B to mały model LLM, ale nadal zajmuje dużo miejsca. Stosuj sprawdzone metody dotyczące wydajności, które obejmują używanie web workera.
Uczynić funkcję opcjonalną
Chcemy, aby sugestie opinii oparte na AI ułatwiały użytkownikom publikowanie opinii o produktach. W naszym przypadku użytkownik może opublikować opinię, nawet jeśli model nie został wczytany i dlatego nie oferuje wskazówek dotyczących poprawy.
Stany i animacja interfejsu
Interpretacja zajmuje zwykle więcej czasu niż natychmiastowa, dlatego sygnalizujemy użytkownikowi, że model wykonuje interpretację, czyli „myśli”. Używamy animacji, aby uprzyjemnić użytkownikom czas oczekiwania i zapewnić im, że aplikacja działa zgodnie z oczekiwaniami. Poznaj różne stany interfejsu, które wdrożyliśmy w naszej wersji demonstracyjnej według projektu Adama Argyle'a.
Inne uwagi
W środowisku produkcyjnym warto:
- Zapewnij mechanizm przesyłania opinii. Co zrobić, jeśli sugestie są przeciętne lub nie mają sensu? wdrożyć mechanizm szybkiego przekazywania opinii (np. kciuk w górę). i nie), a za pomocą heurystyki określamy, co znajdują przydatne. Oszacuj na przykład, ilu użytkowników wchodzi w interakcję z reklamami a także czy są wyłączone.
- Zezwól na rezygnację. Co zrobić, jeśli użytkownik woli używać własnych słów bez pomocy AI czy uważasz, że dana funkcja jest irytująca? Zezwalaj użytkownikowi na rezygnację z usługi i powrót do niej.
- Wyjaśnij, dlaczego ta funkcja istnieje. Krótkie wyjaśnienie może zachęcić użytkowników do korzystania z narzędzia do przesyłania opinii. Na przykład „Lepsze opinie pomagają innym decydują o zakupie i pomaga nam tworzyć te produkty, na których Ci zależy”. Ty możesz dodać obszerne wyjaśnienie sposobu działania tej funkcji i wyjaśniania, dlaczego podał je na przykład w postaci linków z dodatkowymi informacjami.
- W stosownych przypadkach informuj o korzystaniu z AI. W przypadku AI po stronie klienta treści użytkownika nie są wysyłane na serwer do przetworzenia, dzięki czemu mogą pozostać prywatne. Jeśli jednak tworzysz alternatywę po stronie serwera lub gromadzisz informacje za pomocą AI, rozważ dodanie informacji o tym do polityki prywatności, warunków korzystania z usługi lub w innych miejscach.
Implementacja
Nasza implementacja podpowiadającego recenzje produktów może sprawdzić się przypadków użycia. Poniższe informacje mogą Ci się przydać w przyszłości funkcje AI po stronie klienta.
MediaPipe w instancji roboczej
W przypadku MediaPipe LLM inference kod AI składa się tylko z kilku linii: tworzysz resolver plików i obiekt LLM inference, przekazując mu URL modelu, a następnie używasz instancji LLM inference do generowania odpowiedzi.
Nasz przykładowy kod jest jednak nieco bardziej rozbudowany. Dzieje się tak, ponieważ jest ona implementowana w procesie web worker, więc przekazuje wiadomości z głównego skryptu za pomocą kodów wiadomości niestandardowych. Więcej informacji o tego wzoru.
// 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',
};
Dane wejściowe i wyjściowe
Nasz pełny prompt powstał w prompt „few-shot”. Zawiera dane wejściowe użytkownika, czyli wersję roboczą opinii napisane.
Aby wygenerować prompt na podstawie danych wejściowych użytkownika, wywołujemy w czasie wykonywania funkcję pomocniczą generatePrompt.
Modele i biblioteki AI po stronie klienta zwykle mają mniej narzędzi niż AI po stronie serwera. Na przykład tryb JSON często jest niedostępny. Oznacza to, że w promptzie musimy podać żądaną strukturę danych wyjściowych. Ta metoda jest mniej przejrzysta, mniej niezawodna i trudniejsza do utrzymania niż podanie schematu w ramach konfiguracji modelu. Dodatkowo modele po stronie klienta są zazwyczaj mniejsze, co oznacza, że są bardziej podatne na błędy strukturalne w wyjściu.
W praktyce zauważyliśmy, że Gemma 2B lepiej radzi sobie z wygenerowaniem danych wyjściowych w postaci tekstu uporządkowanego niż w przypadku formatu JSON czy JavaScript. W tej prezentacji wybraliśmy format tekstowy. Model generuje tekst, który następnie przetwarzamy na obiekt JavaScript do dalszego przetwarzania w naszej aplikacji internetowej.
ulepszanie prompta,
Do iteracji promptu użyliśmy LLM.
- Prompty „few-shot”. Aby wygenerować przykłady promptów typu „few-shot”, korzystało z Gemini Chat. Gemini Chat korzysta z najbardziej zaawansowanych modeli Gemini. Dzięki temu udało nam się wygenerować przykłady wysokiej jakości.
- Dopracowywanie promptów. Gdy struktura promptu była gotowa, użyliśmy Gemini Chat, aby go dopracować. Poprawiło to jakość danych wyjściowych.
Używaj kontekstu, aby poprawić jakość
Uwzględnienie typu produktu w promptach pomogło modelowi generować bardziej trafne sugestie o wyższej jakości. W tej wersji demonstracyjnej typ usługi jest statyczny. W prawdziwej aplikacji możesz dynamicznie dodawać produkt do promptu na podstawie strony, którą przegląda użytkownik.
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."
Jednym z przykładów w sekcji „kilka ujęć” naszego promptu jest nazwa „Typ produktu”. („skarpetki”) są uwzględnione w sugerowanej poprawce i przykładowej opinii.
Problemy z modelami LLM i ich poprawki
Gemma 2B zwykle wymaga innych metod inżynierii promptów po stronie serwera.
Wystąpiły pewne problemy z Gemma 2B. Oto, jak udało nam się poprawić wyniki:
- Za miły. Gemma 2B miała problemy z oznaczeniem opinii jako „nieprzydatne”, ponieważ nie była pewna, jaką ocenę wystawić. Staraliśmy się, aby język etykiet był bardziej neutralny („konkretne” i „nieprecyzyjne”, zamiast „przydatne” i „nieprzydatne”) oraz dodano przykłady, ale nie poprawiło to wyników. Co wpłynęło na poprawę wyników: naległości i powtórzeń w prompcie. Podejście oparte na ciągu myśli również może przynieść poprawę.
Niejasne instrukcje. Model czasami nadinterpretował prompt. Zamiast oceny opinia została kontynuowana z listy przykładów. Aby rozwiązać ten problem: w prompcie zawarliśmy wyraźne przejście:
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>Jasne ustrukturyzowanie promptu pomaga modelowi odróżnić listę przykładów (kilka ujęć) od rzeczywistego wejścia.
Nieprawidłowy cel. Czasami model sugerował zmiany w produkcie, a nie w tekście recenzji. Na przykład dla opinii zawierającej „Nienawidzę tych skarpetki”, model może zasugerować: „Zastąp skarpetki innym, „marka lub styl”, co nie jest pożądanym efektem. Podzielenie prompta pomogło wyjaśnić zadanie i skupić model na weryfikacji.