Zwiększanie możliwości blogerów: jak CyberAgent wdrożył wbudowaną AI, aby usprawnić tworzenie treści

Yuriko Hirota
Yuriko Hirota
X LinkedIn
Kazunari Hara
Kazunari Hara
Strona główna

Opublikowano: 28 kwietnia 2025 r., ostatnia aktualizacja: 21 maja 2025 r.

Szybki rozwój AI otwiera nowe możliwości dla aplikacji internetowych, zwłaszcza dzięki pojawieniu się funkcji działających na urządzeniu. Dowiedz się, jak CyberAgent, czołowa japońska firma internetowa, wykorzystuje wbudowaną w Chrome'a AI i interfejs Prompt API, aby ulepszyć blogowanie na swojej platformie, Ameba Blog.

Opowiemy o ich celach, korzyściach płynących z pracy z wbudowaną AI, wyzwaniach, z którymi się zmierzyli, oraz o cennych spostrzeżeniach dla innych deweloperów korzystających z wbudowanej AI.

Czym jest interfejs Prompt API?

Wyjaśnienie Sieć Rozszerzenia Stan Chrome Intencja
GitHub Chrome 148 Chrome 138 Wyświetl Intencja wysłania
GitHub Wersja próbna origin Test origin dla parametrów próbkowania Chrome 148 Wyświetl Intencja przeprowadzenia eksperymentu

Interfejs Prompt API pomaga deweloperom korzystać z dużych modeli językowych, aby dodawać funkcje AI bezpośrednio do swoich aplikacji. Dzięki definiowaniu niestandardowych promptów aplikacje mogą wykonywać takie zadania jak wyodrębnianie danych, generowanie treści i personalizowanie odpowiedzi. W Chrome interfejs Prompt API wykonuje wnioskowanie po stronie klienta za pomocą Gemini Nano. To lokalne przetwarzanie, niezależnie od używanego modelu, zwiększa prywatność danych i szybkość odpowiedzi. Niezależnie od używanego modelu szybkość odpowiedzi klienta.

Pomoc AI dla autorów Ameba Blog

CyberAgent zauważył powszechny problem, z którym borykają się autorzy: często czasochłonny proces tworzenia atrakcyjnych treści, zwłaszcza tytułów. Postawili hipotezę, że zintegrowanie funkcji opartych na AI w interfejsie tworzenia bloga może znacząco poprawić jakość i wydajność tworzenia treści. Ich celem było udostępnienie narzędzi, które będą inspirować i pomagać blogerom w tworzeniu angażujących treści.

CyberAgent opracował rozszerzenie Chrome z interfejsem Prompt API. To rozszerzenie udostępnia zestaw funkcji opartych na AI, które mają pomagać autorom Ameba Blog w generowaniu tytułów i nagłówków, kolejnych akapitów oraz ogólnych ulepszeń tekstu.

CyberAgent zależało na elastyczności funkcji, co doprowadziło go do interfejsu Prompt API. Dzięki nieskończonym możliwościom w jednym interfejsie API CyberAgent mógł dokładnie określić, co będzie najlepiej działać i najbardziej przyda się autorom Ameba.

CyberAgent przetestował rozszerzenie z wybraną grupą blogerów, co pozwoliło uzyskać cenne informacje na temat praktyczności oferowanych funkcji. Opinie pomogły CyberAgentowi znaleźć lepsze zastosowania pomocy AI i udoskonalić projekt rozszerzenia. Na podstawie pozytywnych wyników i opinii CyberAgent planuje w przyszłości udostępnić tę funkcję, udostępniając społeczności blogerów możliwości AI po stronie klienta.

Przyjrzyjmy się bliżej tym funkcjom.

Pisanie lepszych tytułów i nagłówków

Rozszerzenie generuje wiele propozycji tytułów na podstawie pełnej treści bloga. Autorzy blogów mogą dodatkowo dopracowywać te sugestie, korzystając z opcji takich jak „Wygeneruj ponownie”, „Bardziej uprzejmy”, „Bardziej swobodny” czy „Wygeneruj podobne tytuły”.

CyberAgent zaprojektował interfejs użytkownika tak, aby użytkownicy nie musieli pisać żadnego promptu. Dzięki temu z możliwości AI mogą korzystać również użytkownicy, którzy nie znają się na inżynierii promptów.

Autorzy mogą ponownie generować tytuły, aby były bardziej formalne, bardziej swobodne lub miały ten sam ton.

Rozszerzenie może też generować atrakcyjne nagłówki poszczególnych sekcji bloga, o które autorzy mogą poprosić, zaznaczając odpowiedni tekst.

Po zaznaczeniu tekstu autorzy mogą wygenerować nagłówki dotyczące tej sekcji.

Kod do wygenerowania tytułu za pomocą interfejsu Prompt API zawiera prompt początkowy i prompt użytkownika. Prompt początkowy zawiera kontekst i instrukcje, aby uzyskać określony typ danych wyjściowych, natomiast prompt użytkownika prosi model o interakcję z tym, co pisze użytkownik. Więcej informacji o kodzie znajdziesz w artykule Wdrażanie pomocy AI.

Generowanie kolejnych akapitów

Rozszerzenie pomaga blogerom pokonać blokadę pisarską, generując kolejne akapity na podstawie zaznaczonego tekstu. Dzięki kontekstowi z poprzedniego akapitu AI tworzy jego kontynuację, co pozwala autorom zachować kreatywność.

Autor może poprosić o pomoc w napisaniu kolejnego akapitu, korzystając z kontekstu z poprzedniego akapitu.

Ulepszanie i edytowanie tekstu

Gemini Nano analizuje zaznaczony tekst i może sugerować ulepszenia. Użytkownicy mogą ponownie generować ulepszenia z dodatkowymi uwagami dotyczącymi tonu i wyboru języka, aby tekst był „ładniejszy” lub „prostszy”.

Wygeneruj ulepszoną wersję zaznaczonego tekstu z wyjaśnieniem, co model ulepszył.

Wdrażanie pomocy AI

CyberAgent podzielił kod rozszerzenia na 3 etapy: tworzenie sesji, wyzwalanie i promptowanie modelu.

Najpierw sprawdzają w przeglądarce, czy wbudowana AI jest dostępna i obsługiwana. Jeśli tak, tworzą sesję z parametrami domyślnymi.

if (!LanguageModel) {
  // Detect the feature and display "Not Supported" message as needed
  return;
}
// Define default values for topK and temperature within the application
const DEFAULT_TOP_K = 3;
const DEFAULT_TEMPERATURE = 1;
let session = null;

async function createAISession({ initialPrompts, topK, temperature } = {}) {
  const { available, defaultTopK, maxTopK, defaultTemperature } =
    await LanguageModel.availability();
  // "readily", "after-download", or "no"
  if (available === "no") {
    return Promise.reject(new Error('AI not available'));
  }
  const params = {
    monitor(monitor) {
      monitor.addEventListener('downloadprogress', event => {
        console.log(`Downloaded: ${event.loaded} of ${event.total} bytes.`);
      });
    },
    initialPrompts: initialPrompts || '',
    topK: topK || defaultTopK,
    temperature: temperature || defaultTemperature,
  };
  session = await LanguageModel.create(params);
  return session;
}

Każda funkcja ma funkcję pomocniczą wywoływaną przez użytkownika. Po wywołaniu, gdy użytkownik kliknie odpowiedni przycisk, sesja zostanie odpowiednio zaktualizowana.

async function updateSession({ initialPrompts, topK, temperature } = {
  topK: DEFAULT_TOP_K,
  temperature: DEFAULT_TEMPERATURE,
}) {
  if (session) {
    session.destroy();
    session = null;
  }
  session = await createAISession({
    initialPrompts,
    topK,
    temperature,
  });
}

Po zaktualizowaniu sesji model jest promptowany zgodnie z funkcją. Oto na przykład kod do wygenerowania tytułu i ponownego wygenerowania tytułu w bardziej formalnym tonie.

async function generateTitle() {
    // Initialize the model session
    await updateSession({
      initialPrompts: [
        { role: 'system', 
          content: `Create 3 titles suitable for the blog post's content,
          within 128 characters, and respond in JSON array format.`,
        }
      ]
    });
    const prompt = `Create a title for the following
    blog post.${textareaEl.textContent}`;
    const result = await session.prompt(prompt);
    try {
      const fixedJson = fixJSON(result);
      // display result
      displayResult(fixedJSON);
    } catch (error) {
      // display error
      displayError();
    }
  }
  async function generateMoreFormalTitle() {
    // Do not execute updateSession to reuse the session during regeneration
    const prompt = 'Create a more formal title.';
    const result = await session.prompt(prompt);
    ...
 }

Zalety wbudowanej AI

Wbudowana AI to rodzaj AI po stronie klienta, co oznacza, że wnioskowanie odbywa się na urządzeniu użytkownika. CyberAgent zdecydował się na użycie wbudowanych interfejsów AI API z Gemini Nano ze względu na atrakcyjne zalety, jakie oferuje zarówno deweloperom aplikacji, jak i użytkownikom.

Główne korzyści, na których skupił się CyberAgent, to:

  • Bezpieczeństwo i prywatność
  • Koszt
  • Szybkość reakcji i niezawodność
  • Łatwość programowania

Bezpieczeństwo i prywatność

Możliwość uruchamiania modeli AI bezpośrednio na urządzeniu użytkownika bez przesyłania danych na serwery zewnętrzne jest najważniejsza. Wersje robocze blogów nie są przeznaczone do publicznego wglądu, dlatego CyberAgent nie chce wysyłać ich na serwer zewnętrzny.

Wbudowana AI pobiera Gemini Nano na urządzenia użytkowników, eliminując potrzebę wysyłania i odbierania danych z serwerów. Jest to szczególnie przydatne podczas pisania, ponieważ wersje robocze mogą zawierać poufne informacje lub niezamierzone wyrażenia. Wbudowana AI przechowuje oryginalne i wygenerowane treści lokalnie, zamiast wysyłać je na serwer, co może zwiększyć bezpieczeństwo i chronić prywatność treści.

Oszczędności

Jedną z głównych zalet korzystania z wbudowanej AI jest to, że przeglądarka zawiera Gemini Nano, a interfejsy API są bezpłatne. Nie ma żadnych dodatkowych ani ukrytych kosztów.

Wbudowana AI znacznie zmniejsza koszty serwera i może całkowicie wyeliminować koszty związane z wnioskowaniem AI. To rozwiązanie można szybko skalować do dużej bazy użytkowników, a użytkownicy mogą przesyłać kolejne prompty, aby dopracowywać wyniki bez ponoszenia dodatkowych opłat.

Szybkość reakcji i niezawodność

Wbudowana AI zapewnia spójne i szybkie czasy odpowiedzi niezależnie od warunków sieciowych. Dzięki temu użytkownicy mogą wielokrotnie generować treści, co znacznie ułatwia im wypróbowywanie nowych pomysłów i szybkie uzyskiwanie satysfakcjonujących wyników.

Łatwość programowania

Wbudowana AI w Chrome upraszcza proces programowania, udostępniając gotowy interfejs API. Deweloperzy mogą łatwo tworzyć funkcje oparte na AI dla swoich aplikacji.

Gemini Nano i wbudowane interfejsy AI API są zainstalowane w Chrome, więc nie trzeba ich dodatkowo konfigurować ani zarządzać modelem. Interfejsy API korzystają z JavaScriptu, podobnie jak inne interfejsy API przeglądarki, i nie wymagają wiedzy z zakresu uczenia maszynowego.

Praca CyberAgenta z interfejsem Prompt API pozwoliła mu zdobyć cenne doświadczenie w zakresie pracy z LLM po stronie klienta.

  • Niespójne odpowiedzi: podobnie jak inne LLM, Gemini Nano nie gwarantuje identycznych wyników dla tego samego promptu. CyberAgent napotkał odpowiedzi w nieoczekiwanych formatach (np. Markdown i nieprawidłowy JSON). Nawet w przypadku instrukcji wyniki mogą się znacznie różnić. Podczas wdrażania dowolnej aplikacji lub rozszerzenia Chrome z wbudowaną AI warto dodać obejście, aby mieć pewność, że dane wyjściowe są zawsze w prawidłowym formacie.
  • Limit tokenów: zarządzanie wykorzystaniem tokenów jest kluczowe. CyberAgent używał właściwości i metod takich jak contextUsage, contextWindow i measureContextUsage(), aby zarządzać sesjami, utrzymywać kontekst i zmniejszać zużycie tokenów. Było to szczególnie ważne podczas dopracowywania tytułów.
  • Ograniczenia rozmiaru modelu: model jest pobierany i przechowywany na urządzeniu użytkownika, dlatego jest znacznie mniejszy niż model oparty na serwerze. Oznacza to, że w prompcie trzeba podać wystarczający kontekst, aby uzyskać zadowalające wyniki, zwłaszcza w przypadku podsumowania. Więcej informacji o rozmiarach LLM.

CyberAgent podkreśla, że chociaż modele po stronie klienta nie są jeszcze powszechnie dostępne we wszystkich przeglądarkach i urządzeniach, a mniejsze modele mają ograniczenia, mogą one nadal zapewniać imponującą wydajność w przypadku określonych zadań. Możliwość szybkiego iterowania i eksperymentowania bezpłatnie po stronie serwera sprawia, że jest to cenne narzędzie.

Radzą, aby znaleźć równowagę, zdając sobie sprawę, że uzyskanie idealnych odpowiedzi jest trudne w przypadku każdej AI, zarówno po stronie serwera, jak i po stronie klienta. Wreszcie, widzą przyszłość, w której podejście hybrydowe, łączące zalety AI po stronie serwera i po stronie klienta, otworzy jeszcze większy potencjał.

Perspektywy

Badanie wbudowanej AI przez CyberAgenta pokazuje ekscytujące możliwości bezproblemowej integracji AI w celu zwiększenia komfortu użytkowników. Rozszerzenie opracowane do współpracy z Ameba Blog pokazuje, jak można praktycznie wykorzystać te technologie do rozwiązywania rzeczywistych problemów, co stanowi cenną lekcję dla szerszej społeczności deweloperów internetowych.

W miarę rozwoju technologii i rozszerzania obsługi przeglądarek i urządzeń spodziewamy się jeszcze bardziej innowacyjnych zastosowań wbudowanej AI i innych form AI po stronie klienta.

Zasoby

Podziękowania

Dziękujemy blogerom Ameby: ao, Nodoka, Erin, Chiaki i socchi, którzy przekazali opinie i pomogli ulepszyć rozszerzenie. Dziękujemy Thomasowi Steinerowi, Alexandrze Klepper i Sebastianowi Benzowi za pomoc w napisaniu i sprawdzeniu tego posta na blogu.