Unterstützung für Blogger: Wie CyberAgent integrierte KI eingesetzt hat, um die Erstellung von Inhalten zu verbessern

Yuriko Hirota
Yuriko Hirota
X
Kazunari Hara
Kazunari Hara
Startseite

Veröffentlicht: 28. April 2025, zuletzt aktualisiert: 21. Mai 2025

Die rasante Entwicklung von KI eröffnet neue Möglichkeiten für Webanwendungen, insbesondere mit dem Aufkommen von On-Device-Funktionen. CyberAgent, ein führendes japanisches Internetunternehmen, nutzt die eingebaute KI von Chrome und die Prompt API, um das Bloggen auf seiner Plattform Ameba Blog zu verbessern.

Wir teilen ihre Ziele, die Vorteile der Verwendung von KI-Funktionen, die Herausforderungen, denen sie begegnet sind, und wertvolle Erkenntnisse für andere Entwickler, die KI-Funktionen verwenden.

Was ist die Prompt API?

Erklärvideo Web Erweiterungen Chrome-Status Absicht
GitHub Experimentell In EPP Chrome Beta Chrome 137 Beta Ansicht Testabsicht

Mit der Prompt API können Entwickler große Sprachmodelle verwenden, um KI-Funktionen direkt in ihre Apps einzubinden. Durch das Definieren benutzerdefinierter Prompts können Apps Aufgaben wie Datenextraktion, Inhaltserstellung und personalisierte Antworten ausführen. In Chrome führt die Prompt API clientseitige Inferenzen mit Gemini Nano aus. Diese lokale Verarbeitung verbessert unabhängig vom verwendeten Modell den Datenschutz und die Reaktionsgeschwindigkeit. Unabhängig vom verwendeten Modell: die Geschwindigkeit der Clientantwort.

KI-gestützte Unterstützung für Ameba-Blogautoren

CyberAgent erkannte ein häufiges Problem für Autoren: das oft zeitaufwendige Erstellen ansprechender Inhalte, insbesondere von Titeln. Sie stellten die Hypothese auf, dass die Integration KI-gestützter Funktionen in die Benutzeroberfläche zum Erstellen von Blogs die Qualität und Effizienz der Inhaltserstellung erheblich verbessern könnte. Das Ziel war es, Tools bereitzustellen, die Bloggern Inspiration geben und ihnen helfen, ansprechende Inhalte zu erstellen.

CyberAgent hat eine Chrome-Erweiterung mit der Prompt API entwickelt. Diese Erweiterung bietet eine Reihe von KI-gestützten Funktionen, mit denen Ameba-Blog-Autoren Titel und Überschriften, nachfolgende Absätze und allgemeine Verbesserungen am Text erstellen können.

CyberAgent wollte flexible Funktionen, was direkt zur Prompt API führte. Dank der unzähligen Möglichkeiten in einer API konnte CyberAgent genau bestimmen, was am besten funktioniert und für die Ameba-Autoren am nützlichsten ist.

CyberAgent hat die Erweiterung mit einer ausgewählten Gruppe von Bloggern getestet, was wertvolle Erkenntnisse zur Praktikabilität der angebotenen Funktionen lieferte. Das Feedback half CyberAgent, bessere Anwendungsfälle für die KI-Unterstützung zu identifizieren und das Design der Erweiterung zu optimieren. Aufgrund der positiven Ergebnisse und des Feedbacks plant CyberAgent, diese Funktion in Zukunft einzuführen und die Vorteile der clientseitigen KI direkt für die Community zu nutzen.

Sehen wir uns diese Funktionen genauer an.

Bessere Titel und Überschriften verfassen

Die Erweiterung generiert mehrere Titelvorschläge, die auf dem gesamten Bloginhalt basieren. Blogger können diese Vorschläge mit Optionen wie „Neu generieren“, „Höflicher“, „Lockerer“ oder „Ähnliche Titel generieren“ weiter verfeinern.

CyberAgent hat die Benutzeroberfläche so gestaltet, dass die Nutzer keine Prompts schreiben müssen. So können auch Nutzer, die mit Prompt-Engineering nicht vertraut sind, von der KI profitieren.

Autoren können Titel neu generieren, um sie formeller oder lässiger zu gestalten, oder sie im selben Tonfall neu generieren.

Die Erweiterung kann auch ansprechende Überschriften für einzelne Abschnitte des Blogs generieren. Autoren können diese anfordern, indem sie den entsprechenden Text für eine Überschrift auswählen.

Durch das Auswählen des Texts können Autoren Überschriften für diesen Abschnitt generieren.

Der Code zum Generieren eines Titels mit der Prompt API enthält einen ersten Prompt und einen Nutzer-Prompt. Der erste Prompt liefert Kontext und Anweisungen, um eine bestimmte Art von Ausgabe zu erhalten, während die Prompts der Nutzer das Modell auffordern, mit dem zu interagieren, was der Nutzer schreibt. Weitere Informationen zu diesem Code finden Sie unter KI-Unterstützung bereitstellen.

Nachfolgende Absätze generieren

Die Erweiterung hilft Bloggern, den Schreibblock zu überwinden, indem sie auf Grundlage des ausgewählten Texts nachfolgende Absätze generiert. Anhand des Kontexts aus dem vorherigen Absatz erstellt die KI eine Fortsetzung des Absatzes, damit Autoren ihren kreativen Fluss beibehalten können.

Der Autor kann Hilfe beim Schreiben des nächsten Absatzes mit dem Kontext aus dem vorherigen Absatz anfordern.

Text optimieren und bearbeiten

Gemini Nano analysiert den ausgewählten Text und kann Verbesserungsvorschläge machen. Die Nutzer können die Verbesserungen mit zusätzlichen Anmerkungen zum Ton und zur Sprachauswahl neu generieren, um den Text „kürzer“ oder „einfacher“ zu gestalten.

Eine verbesserte Version des ausgewählten Texts mit einer Erklärung dazu, was das Modell verbessert hat.

KI-Unterstützung bereitstellen

CyberAgent hat den Code der Erweiterung in drei Schritte unterteilt: Sitzungserstellung, Trigger und Modellaufforderung.

Zuerst prüfen sie, ob die integrierte KI im Browser verfügbar und unterstützt wird. Falls ja, wird eine Sitzung mit Standardparametern erstellt.

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;
}

Jede Funktion hat eine vom Nutzer ausgelöste Hilfsfunktion. Wenn der Nutzer auf die entsprechende Schaltfläche klickt, wird die Sitzung entsprechend aktualisiert.

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,
  });
}

Nachdem die Sitzung aktualisiert wurde, fordert er das Modell entsprechend der Funktion auf. Hier ist beispielsweise der Code zum Generieren eines Titels und zum Generieren eines Titels in einem formelleren Ton.

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);
    ...
 }

Vorteile der integrierten KI

Eingebettete KI ist eine Art clientseitige KI. Das bedeutet, dass die Inferenz auf dem Gerät des Nutzers erfolgt. CyberAgent hat sich für die Verwendung integrierter KI-APIs mit Gemini Nano entschieden, da diese sowohl für App-Entwickler als auch für Nutzer überzeugende Vorteile bieten.

CyberAgent hat sich auf die folgenden Hauptvorteile konzentriert:

  • Sicherheit und Datenschutz
  • Kosten
  • Reaktionsfähigkeit und Zuverlässigkeit
  • Einfache Entwicklung

Sicherheit und Datenschutz

Es ist wichtig, dass KI-Modelle direkt auf dem Gerät des Nutzers ausgeführt werden können, ohne Daten an externe Server zu übertragen. Blogentwürfe sind nicht für die Öffentlichkeit bestimmt. Daher möchte CyberAgent diese Entwürfe nicht an einen Server eines Drittanbieters senden.

Die integrierte KI lädt Gemini Nano auf die Geräte der Nutzer herunter, sodass keine Daten mehr von Servern gesendet und empfangen werden müssen. Das ist besonders beim Schreiben nützlich, da Entwürfe vertrauliche Informationen oder unbeabsichtigte Formulierungen enthalten können. Die integrierte KI speichert die ursprünglichen und generierten Inhalte lokal, anstatt sie an einen Server zu senden. So können die Sicherheit erhöht und die Daten der Nutzer besser geschützt werden.

Kosteneinsparungen

Ein großer Vorteil der integrierten KI ist, dass der Browser Gemini Nano enthält und die APIs kostenlos nutzbar sind. Es fallen keine zusätzlichen oder versteckten Kosten an.

Die integrierte KI reduziert die Serverkosten erheblich und kann die Kosten für KI-Inferenzen vollständig eliminieren. Diese Lösung kann schnell auf eine große Nutzerbasis skaliert werden und ermöglicht es Nutzern, aufeinanderfolgende Prompts einzureichen, um die Ergebnisse zu optimieren, ohne dass zusätzliche Gebühren anfallen.

Reaktionsfähigkeit und Zuverlässigkeit

Die integrierte KI sorgt unabhängig von den Netzwerkbedingungen für konstante und schnelle Reaktionszeiten. So konnten die Nutzer immer wieder Inhalte generieren, was es ihnen viel leichter machte, neue Ideen auszuprobieren und schnell ein zufriedenstellendes Endergebnis zu erzielen.

Einfache Entwicklung

Die integrierte KI von Chrome vereinfacht den Entwicklungsprozess durch eine sofort verfügbare API. Entwickler profitieren davon, wie einfach es ist, KI-gestützte Funktionen für ihre Anwendung zu erstellen.

Gemini Nano und die integrierten KI-APIs sind in Chrome installiert. Es ist also keine zusätzliche Einrichtung oder Modellverwaltung erforderlich. Die APIs verwenden wie andere Browser-APIs JavaScript und erfordern keine Kenntnisse im Bereich maschinelles Lernen.

Die Erfahrungen von CyberAgent mit der Prompt API haben wertvolle Erkenntnisse über die Feinheiten der Arbeit mit clientseitigen LLMs geliefert.

  • Nicht konsistente Antworten: Wie andere LLMs garantiert auch Gemini Nano nicht identische Ausgaben für denselben Prompt. CyberAgent hat Antworten in unerwarteten Formaten gefunden, z. B. Markdown und ungültiges JSON. Selbst mit einer Anleitung können die Ergebnisse stark variieren. Wenn Sie eine Anwendung oder Chrome-Erweiterung mit integrierter KI implementieren, kann es sinnvoll sein, eine Umgehung zu implementieren, damit die Ausgabe immer im richtigen Format ist.
  • Tokenlimit: Die Tokennutzung muss unbedingt verwaltet werden. CyberAgent nutzte Properties und Methoden wie inputUsage, inputQuota und measureInputUsage(), um Sitzungen zu verwalten, den Kontext beizubehalten und den Tokenverbrauch zu reduzieren. Das war besonders wichtig, wenn es um die Optimierung von Titeln ging.
  • Einschränkungen bei der Modellgröße: Da das Modell heruntergeladen und auf dem Gerät des Nutzers gespeichert wird, ist es deutlich kleiner als ein serverbasiertes Modell. Daher ist es wichtig, im Prompt ausreichend Kontext anzugeben, um zufriedenstellende Ergebnisse zu erzielen, insbesondere bei Zusammenfassungen. Weitere Informationen zu LLM-Größen

CyberAgent betont, dass clientseitige Modelle zwar noch nicht für alle Browser und Geräte verfügbar sind und die kleineren Modelle Einschränkungen haben, sie aber dennoch für bestimmte Aufgaben eine beeindruckende Leistung erzielen können. Die Möglichkeit, schnell zu iterieren und ohne serverseitige Kosten zu experimentieren, macht es zu einem wertvollen Tool.

Er rät, ein Gleichgewicht zu finden, da perfekte Antworten mit jeder KI schwierig zu erreichen sind, egal ob server- oder clientseitig. Schließlich sieht er in der Zukunft einen Hybridansatz, der die Stärken von server- und clientseitiger KI kombiniert, um noch mehr Potenzial zu erschließen.

Zukunftspläne

Die Untersuchungen von CyberAgent zur integrierten KI zeigen die spannenden Möglichkeiten einer nahtlosen KI-Integration zur Verbesserung der Nutzerfreundlichkeit. Die Erweiterung für Ameba Blog zeigt, wie diese Technologien praktisch angewendet werden können, um reale Probleme zu lösen. Sie bietet wertvolle Erkenntnisse für die Webentwicklungsbranche.

Mit der Weiterentwicklung der Technologie und der Ausweitung der Unterstützung für Browser und Geräte werden wir voraussichtlich noch mehr innovative Anwendungen für integrierte KI und andere Formen der clientseitigen KI sehen.

Ressourcen

Danksagungen

Vielen Dank an die Ameba-Blogger ao, Nodoka, Erin, Chiaki und socchi, die uns Feedback gegeben und geholfen haben, die Erweiterung zu verbessern. Vielen Dank an Thomas Steiner, Alexandra Klepper und Sebastian Benz für ihre Unterstützung beim Verfassen und Überprüfen dieses Blogposts.