Erstellung von Inhalten mittels generativer KI

Vorstellung des Liferay OpenAI Content Wizards

Wir leben in einer aufregenden Zeit, in der die künstliche Intelligenz schon viele Aufgaben erleichtert. So können Sie mittels generativer KI auch die Content-Erstellung erheblich vereinfachen. Ob Blog-Artikel, Produkt-Datensätze, FAQ- oder Foreneinträge – vieles ist mittlerweile unkompliziert durch Knopfdruck zu generieren und erleichtert ebenso den Alltag von Redakteuren wie Entwicklern.

In diesem Beitrag wollen wir aufzeigen, wie man den Liferay OpenAI Content Wizard im Handumdrehen in Projekte einbindet und damit verschiedenste Arten von Inhalten generiert – schnell, unkompliziert und ohne großen Aufwand. Der Liferay OpenAI Content Wizard, der über die headless-API in das System integriert wird, ist kostenlos als Download auf GitLab verfügbar.

So richten Sie den Open AI Content Wizard ein

Das Setup ist denkbar einfach:

Schritt 1: Node.js Installation

Sollte Node.js nochnicht installiert sein, so können Sie dies hier (https://nodejs.org/en/) tun.

Schritt 2: GitLab Repository klonen

https://github.com/weskempa-liferay/liferay-openai-demo-wizard

Schritt 3: In den Projekt-Ordner wechseln

cd liferay-openai-demo-wizard

Schritt 4: Requirements installieren

npm install

Schritt 5: Kopie der Umgebungsvariablen erstellen

cp .env.example .env

Schritt 6: Konfiguration vornehmen

API-Schlüssel zur .env-Datei hinzufügen und Server-Informationen eintragen

Schritt 7: Anwendung ausführen

npm run dev

Schritt 8: Deployment

Wenn der OpenAI Content Wizard lokal läuft, können Sie die erforderlichen Umgebungsvariablen setzen und Liferay anbinden.

OPENAI_API_KEY= <API-Schlüssel> LIFERAY_PATH= <Server-URL, HTTP: oder HTTPS: z.B. http://localhost:8080, http://127.0.0.1:8080 oder https://webserver-lctexample-prd.lfr.cloud> LIFERAY_ADMIN_EMAIL_ADDRESS= <Admin-Email> LIFERAY_ADMIN_PASSWORD= <Admin-Passwort>

Sobald der Liferay OpenAI Content Wizard eingerichtet ist, sollte das Ganze auf dem Bildschirm so aussehen. Nun können Sie zwischen 16 verschiedenen Tasks, die mit Hilfe von OpenAI automatisiert wurden, wählen.

Die Macht der Künstlichen Intelligenz

Bevor wir uns die drei spannendsten Anwendungsfälle etwas genauer ansehen, wollen wir noch einmal von unseren persönlichen Erfahrungen mit generativer KI berichten und aufzeigen was künstliche Intelligenz alles leisten kann. Immer noch denken viele, dass mit künstlicher Intelligenz vor allem Blog-Artikel schnell generiert werden können. Dabei ist das Anwendungsgebiet so viel größer. Bei der Entwicklung unseres Portals JobMatchers haben wir die Erfahrung gemacht, dass sich mithilfe von generativer KI Inhalte und Daten, die für eine spezielle Ansicht optimiert sind, auch leicht restrukturieren oder in eine andere Form bringen lassen, die für eine andere Ansicht wiederum besser geeignet ist.

Ebenso können mit generativer künstlicher Intelligenz Inhalte für verschiedene Zielgruppen aufbereitet werden. Dies machen wir uns aktuell bspw. zunutze in Projekten, die darauf abzielen, die Barrierefreiheit von Webseiten zu verbessern. Hier herrscht aktuell ein großer Zeitdruck: Auch wenn noch nicht alle Unternehmen die neue Gesetzgebung im Blick haben, ist Barrierefreiheit mit dem Inkrafttreten des Barrierefreiheitstärkungsgesetzes ab dem 28. Juni 2025 verpflichtend zu garantieren. So können die Texte einer Webseite, die für ein nicht beeinträchtigtes Publikum gedacht sind, durch den Einsatz von generativer künstlicher Intelligenz problemlos umformuliert werden, d.h. in eine leichte Sprache “übersetzt" werden, die für Menschen mit kognitiven Einschränkungen wesentlich leichter zugänglich ist. Gerade bei großen Webprojekten mit mehreren Tausend Seiten ist dies sehr hilfreich und wäre redaktionell nur sehr aufwändig zu erreichen. Genauso einfach können aber Inhalte auch klassisch in eine andere Sprache übersetzt werden. So kann die generative KI ebenfalls bei der Internationalisierung behilflich sein.

Doch was genau kann der Liferay OpenAI Content Wizard? Wir wollen nun drei Beispiele geben, wie das Tool die alltägliche Arbeit erleichtern kann.

Beispiel 1: Produktdaten generieren mittels künstlicher Intelligenz

Oft benötigen wir zur Entwicklung eines Onlineshops einen Produktdatensatz für Testzwecke und nicht immer sind Bestanddaten gegeben. Bei Startups fehlt dieser meist komplett und bei Unternehmen mit einem bestehenden Onlineshop sind die entsprechenden Daten nicht immer rechtzeitig für uns als Entwickler verfügbar oder für Testzwecke manchmal schlicht zu umfangreich. Mit Hilfe des Content Wizard und eines simplen OpenAI-Prompts kann ein solcher Datensatz mit allen gewünschten Produktdetails und Bildern im JSON-Format spontan erstellt werden. Hierzu müssen Sie die Produktwelt spezifizieren (Commerce Theme), ein paar Beispielbegriffe (Vocabulary Name) zur Feinabstimmung vorgeben, die Anzahl der Produktkategorien und Produkte pro Kategorie festlegen und zur Generierung der Produktbilder das AI-Modell (DALL·E-2 oder DALL·E-3) und den Stil (Image Style) bestimmen.

Bei Eingabe von "Portable Consumer Electronics" und "Tablet, Smartphone, Headphones" wird u.a. das folgende JSON zurück geliefert:

[ 
      {
        "productName": "Tablet Pro Ultra",
        "price": "€899.99",
        "shortDescription": "The Tablet Pro Ultra is the pinnacle of portable technology, blending sleek design with uncompromising performance. Engineered for those who demand the best, it sets a new standard for tablets."
      },
      {
        "productName": "Tablet XT400",
        "price": "€149.99",
        "shortDescription": "The Tablet XT400 is a sleek and powerful device designed to enhance your mobile computing experience. With its lightweight and compact design, it's the perfect companion for professionals, students, and digital enthusiasts alike."
      },
      {
        "productName": "Flip Pad Mini",
        "price": "€459.99",
        "shortDescription": "The Flip Pad Mini is the ultimate companion for those seeking convenience and functionality in a compact package. Designed to fit seamlessly into your lifestyle, this sleek and stylish device offers a range of features to enhance your productivity and entertainment on the go."
      }
]

Natürlich sind alle Produktdaten frei erfunden, aber das ist nicht schlimm, denn diese sollen nur für Testzwecken herhalten. Es ist entscheidend, dass die zurückgegebene JSON-Struktur jedes Mal dieselbe ist, um die Daten ordnungsgemäß speichern zu können und etwaige Entwicklungsfehler zu erkennen. Um sicherzustellen, dass das zurückgegebene Ergebnis genau die richtige JSON-Struktur hat, bietet OpenAI "function calling" an. Bei einem API-Aufruf können Sie die Funktionen beschreiben und das Modell selbst entscheiden lassen, ob ein JSON-Objekt mit Argumenten zur Ausführung einer oder mehrerer Funktionen ausgegeben werden soll. Dabei ruft die Chat Completions API nicht die Funktion direkt auf; stattdessen generiert das Modell ein JSON, das dazu verwendet werden kann, um die Funktion im eigenen Code aufzurufen.

In unserem Fall mussten wir das Schema definieren, um zu beschreiben, was zurückgegeben werden muss. Im Folgenden finden Sie ein Beispiel für ein Produktschema, das in diesem Fall verwendet wird:

const productSchema = {
  "parameters": {
    "products": {
      "description": "An array of products within the suggested category",
      "items": {
        "properties": {
          "price": {
            "description": "Cost of this product in EUR",
            "type": "string"
          },
          "productName": {
            "description": "The name of a product that exists in the given category",
            "type": "string"
          },
          "shortDescription": {
            "description": "A short description of this product",
            "type": "string"
          }
        },
        "type": "object"
      },
      "required": [
        "productName",
        "shortDescription",
        "price"
      ],
      "type": "array"
    }
  },
  "type": "object"
}

Sobald die Daten von OpenAI zurückgegeben werden, können wir diese per API in Liferay hinterlegen. So sind Beispielprodukte schnell erstellt und wir sparen eine Menge Zeit. Das manuelle Einpflegen von Beispieldaten ist ungleich aufwändiger, vor allem wenn man auch die Produktbilder heraussuchen muss. An eine generative künstliche Intelligenz kann man diese Aufgabe hingegen abgeben und der Prozess der Beispieldatengenerierung dauert dann nur etwas länger, ca. 10 Sekunden pro Bild.

Übrigens: Wer Bilder unabhängig von einem Produkt und dessen Eigenschaften erstellen will, z.B. zur Illustration eines Blogposts, kann dies auch unabhängig davon tun. Der Liferay OpenAI Content Wizard bietet hierzu eine "Images only"-Funktion.

Beispiel 2: Bildgenerierung mittels künstlicher Intelligenz

Eine wirklich tolle Sache ist es, Bilder auf Basis einer Beschreibung zu generieren. Vorbei sind die Zeiten, in denen man lange nach einem passenden Foto für einen Blogbeitrag suchen und mitunter eine teure Lizenz erwerben musste. Nun ist das spontane erstellen von Bildern genauso simpel, wie die Verwendung von OpenAI zur Textgenerierung – liefern Sie einfach eine Beschreibung dessen, was Sie sehen möchten und wählen Sie den Bildgenerator aus, der verwendet werden soll. Von OpenAI werden aktuell zwei Modelle bereitgestellt. DALL·E-3 ist mit 0,04 Cent pro generiertem Bild etwas teurer, während DALL·E-2 mit 0,02 Cent zu Buche schlägt. Die Kosten halten sich also auf jeden Fall in Grenzen.

Bei der Verwendung von DALL·E-3 ist zu erkennen, dass sich die Darstellung von Personen erheblich verbessert hat. Komisch ineinander verwachsene Extremitäten oder bspw. Hände mit einer falschen Anzahl von Fingern treten wesentlich seltener auf und so ist bei genauerem Hinsehen nicht mehr sofort erkennbar, ob es sich um ein KI-generiertes Bild handelt. Bei der zusätzlichen Anwendung von bestimmten Filtern kann man kleinere Fehler noch besser verschleiern und zudem eine gewisse Kontinuität, d.h. eine einheitliche Bildsprache, gewährleisten. Die Möglichkeiten sind hier nahezu unbegrenzt. Als besonders geeignet erscheinen Zusätze wie "Vektorgrafik", "Fotorealismus", "Flat Design", "Pixelkunst" oder "Digitaler Impressionismus".

Beispiel 3: Objekte und Schemata erstellen mittels KI

Hinter dem Menüpunkt Objects verbirgt sich ein Low-Code-Ansatz zum Generieren von beliebigen Datenstrukturen. Auch dabei kann OpenAI helfen.

Über die Benutzeroberfläche kann der erwünschte Datensatz je nach Bedarf spezifiziert werden. Der Nutzer beschreibt mit Worten zunächst (1) die Rolle, die OpenAI einnehmen soll z.B. "ein Assistent, der dafür verantwortlich ist eine Liste mit Daten zusammenzustellen" und definiert dann, (2) was genau gesucht wird im Feld "specific request to OpenAI". Z.B. eine Liste mit 30 klassischen Sportwagen, die schneller als 200 Km/h fahren können. Anschließend sind (3) der Liferay API-Endpunkt festzulegen, über den der Datensatz zu befüllen ist sowie (4) die Listenfelder und deren Format zu bestimmen, z.B. Hochgeschwindigkeit, PS und Gewicht. Alles ist ziemlich selbsterklärend.