1. Knowledge Base
  2. Bauen mit GAPTEQ
  3. GAPTEQ Assist - Integration von AI-Services im Frontend

Automatisierte Inhaltserstellung mit Quell- und Zielangaben

GAPTEQ Assist erstellt auf Basis von Quellangaben per Knopfdruck den gewünschten Content und übernimmt diesen automatisch in die gewünschten Eingabefelder.

Notiz! Anhand eines Demo Beispiels "Produktverwaltung Möbelhaus Müller" wird beschrieben, wie beliebige Texte/Beschreibungen automatisiert auf Basis spezifischer Quellen (Datenbankinhalte) generiert und in beliebige Formularfelder übernommen werden können.

Ausgangssituation

In dieser GAPTEQ-Applikation eines Möbelhauses werden in einem Formular sämtliche Produktinformationen (Name, Kurzbeschreibung, (ausführliche Produktbeschreibung, Maße, Lieferant, ...) erfasst. Jedes Produkt gehört zu einer Produktkategorie bzw. -gruppe und wird initial mit einem Produktnamen und einer Kurzbeschreibung erfasst.

Ziel

Nun soll mit Hilfe des GAPTEQ Assist auf Basis der initialen Produktinformationen (Produktname und Kurzbeschreibung) per Knopfdruck eine ausführliche Produktbeschreibung erzeugt und direkt in das dafür vorgesehene Formularfeld übernommen werden.

1. AI chat Komponente platzieren & auslösende Event definieren

  • AI chat Komponente auf die Page ziehen (siehe im Screenshot rechts unten).
Durch Klick auf einen Button soll die ausführliche Beschreibung des jeweiligen Produktes generiert werden. (siehe Button: "Produktbeschreibung generieren")
  • Beim "clicked" Event des Buttons - referenziert auf die AI chat Komponente - die Action "ask(question, showQuestion)" hinterlegen.
  • Für den Parameter "question" wird eine String expression mit dem entsprechenden Promt an die KI hinterlegt. ("Erstelle eine werbliche Produktbeschreibung anhand dieser Kurzbeschreibung")

2. Datenquellen für Prompt definieren

  • Da die Produktbeschreibung auf Basis des Produktnamens und der Kurzbeschreibung generiert werden soll, werden durch die "selected.Row"-Befehle auf das Feld "ProductName" und "ShortDescrpiton" die entsprechenden Datenquellen übergeben.

  • Der Parameter "showQuestion" wird mit einem Boolean auf "True" gesetzt.

3. Generierte Antwort in gewünschtes Formularfeld übernehmen

Die generierte Antwort taucht nun (zumindest in diesem Beispiel) im Chatfeld der Komponente AI chat auf.
  • Über das "processAnswer"-Event der Komponente AI chat wird über "Set a value" definiert, in welches konkrete Formularfeld (hier: "form1_Description") die generierte Antwort übernommen werden soll.
  • Durch die Option "Übernehmen ins Formular", welche die AI chat Komponente anzeigt, übernimmt man die generierte Beschreibung schließlich.
  • Falls gewünscht, kann über einen Toast ("navigation.infoToast") noch eine Message bei erfolgreicher Übernahme ausgegeben werden. 

Notiz! Die generierten Beschreibungen sollen nun auch in verschiedenen Sprachen verfügbar sein? → Mehrsprachige Inhalte generieren.