Blog
AI/Voice
22. Februar 20269 min

KI-Bildgenerierung in einer Produktivitäts-App

Benutzern ermöglichen, Bilder für ihre Aufgaben direkt aus der App per Sprache zu generieren. "Erstelle ein Bild für meine Aufgabe" und schon erscheint eine passende Illustration. Hinter dieser Einfachheit verbirgt sich eine technische Pipeline mit zwei KI-Bildanbietern, einem automatisierten Prompt-Engineering-System, vier visuellen Stilen, einem automatischen Fallback und einer Kostenverwaltung pro Abonnementplan.

Die KI-Bilderzeugung in einer Produktivitäts-App ist kein Gimmick. Es ist eine Antwort auf eine Beobachtung: Aufgaben mit einem visuellen Element sind einprägsamer, ansprechender und leichter in einem Feed zu finden. Und wenn der Benutzer dieses visuelle Element mit einem Satz erhalten kann, ohne seinen Sprach-Workflow zu verlassen, ist die Akzeptanz natürlich.

Schlüsselpunkte
  • Zwei integrierte KI-Bildanbieter: Gemini 2.5 Flash Image für Qualität und Runware HiDream-I1-Fast für Wirtschaftlichkeit (~0,003 Euro/Bild).
  • Das konversationelle LLM generiert automatisch einen optimierten Prompt, indem es Titel, Beschreibung und Tags der Aufgabe analysiert.
  • Vier vordefinierte Stile (flach, minimalistisch, realistisch, Aquarell) ändern den an das Modell gesendeten Prompt.
  • Automatischer Gemini-zu-Runware-Fallback mit Wiederholung und exponentiellem Backoff, vom Admin über das Dashboard gesteuert.
Geteilter Bildschirm, der zwei nebeneinander liegende KI-generierte Bilder mit unterschiedlichen visuellen Stilen, fotorealistisch und Aquarell, über einem Smartphone schwebend zeigt

Warum zwei KI-Bildanbieter integrieren?

Ein einziger Anbieter ist ein Single Point of Failure. Wenn die API ausfällt, wenn die Quoten überschritten werden, wenn die Qualität nachlässt: Der Benutzer hat keine Bilder mehr. Zwei Anbieter bedeuten Resilienz und Flexibilität.

Gemini 2.5 Flash Image (über OpenRouter) ist der Standardanbieter. Die Qualität ist ausgezeichnet, die Geschwindigkeit korrekt (2-4 Sekunden pro Bild). Es ist das beste Qualität/Geschwindigkeit-Verhältnis, das ich getestet habe. Das Modell versteht komplexe Prompts mit mehreren Themen, spezifischen künstlerischen Stilen und detaillierten Kompositionen gut.

Runware HiDream-I1-Fast ist die wirtschaftliche Alternative. Mit etwa 0,003 Euro pro Bild ist es je nach Prompt 5 bis 10 Mal billiger als Gemini. Die Qualität ist bei komplexen Prompts etwas geringer, aber für Aufgabenillustrationen völlig ausreichend. Und die Geschwindigkeit ist vergleichbar.

Der Admin wechselt zwischen den beiden über das Administrations-Dashboard. Es ist ein Toggle in der Tabelle app_config von Supabase. Warum ein Admin-Toggle und keine Benutzerwahl? Weil die Kosten vom Dienst getragen werden, nicht vom Benutzer. Es liegt an mir zu entscheiden, welcher Anbieter das Verhältnis von Qualität zu Kosten basierend auf dem Nutzungsvolumen optimiert.

Wie generiert das LLM den perfekten Prompt?

Einen Benutzer zu bitten, einen guten Bild-Prompt zu schreiben, ist unrealistisch. Bildgenerierungsmodelle reagieren empfindlich auf die Formulierung. "Eine Katze" liefert ein generisches Ergebnis. "Eine Hauskatze mit kurzem Haar, die auf einem Fensterbrett sitzt, goldenes Sonnenlicht, geringe Tiefenschärfe, fotorealistisch, warme Töne" liefert ein professionelles Bild.

Der Unterschied zwischen den beiden? Prompt Engineering. Und genau das ist die Aufgabe des konversationellen LLM von TAMSIV.

Wenn der Benutzer ein Bild anfordert, analysiert das LLM drei Kontextquellen:

  1. Der Titel der Aufgabe: "Kundenpräsentation Q2 vorbereiten" → das LLM versteht, dass ein professionelles visuelles Element benötigt wird.
  2. Die Beschreibung: "Verkaufszahlen und Wachstumsgrafik einbeziehen" → das LLM fügt dem Prompt Elemente der Datenvisualisierung hinzu.
  3. Die Tags/Ordner: Wenn die Aufgabe im Ordner "Marketing" ist, orientiert das LLM den Stil in Richtung Branding.

Der Prompt wird immer auf Englisch generiert, auch wenn der Benutzer Französisch spricht. Warum? Weil Bildmodelle hauptsächlich mit englischsprachigen Daten trainiert werden. Ein Prompt auf Englisch liefert systematisch bessere Ergebnisse. Das ist die gleiche Beobachtung, die ich beim i18n-System in 6 Sprachen gemacht hatte: Die interne Arbeitssprache ist nicht unbedingt die Sprache des Benutzers.

Das LLM fügt auch automatisch technische Modifikatoren hinzu: Auflösung, Beleuchtung, Komposition. Diese Modifikatoren sind für den aktiven Anbieter kalibriert. Gemini und Runware interpretieren Prompts nicht auf die gleiche Weise, daher passt das LLM seine Formulierung an. Gemäß den Best Practices von OpenAI zum Prompting von Bildern sind Stil- und Kompositionsmodifikatoren die Faktoren, die die Qualität des Ergebnisses am stärksten beeinflussen.

Welche vier visuellen Stile sind verfügbar?

Flussdiagramm, das die Pipeline der KI-Bildgenerierung zeigt: Spracheingabe zu LLM-Verarbeitung zu Bildanbieter zu Cloud-Speicher, miteinander verbundene leuchtende Knoten

Jeder Stil ändert den an das Modell gesendeten Prompt, indem er spezifische Suffixe und Modifikatoren hinzufügt:

Flacher Stil (Vektorillustrationen)

Fügt hinzu: "flat vector illustration, clean lines, solid colors, minimal shading, modern graphic design style". Ideal für professionelle Aufgaben und Präsentationen. Das Ergebnis ist sauber und druckbar.

Minimalistischer Stil

Fügt hinzu: "minimalist, simple composition, lots of white space, single focal point, clean aesthetic". Perfekt für persönliche Aufgaben. Das Ergebnis ist schlicht und beruhigend.

Realistischer Stil

Fügt hinzu: "photorealistic, high detail, natural lighting, shallow depth of field, 4K quality". Das Ergebnis, das einem Foto am nächsten kommt. Ideal, wenn du ein konkretes Bild von dem haben möchtest, was du dir vorstellst.

Aquarell-Stil

Fügt hinzu: "watercolor painting, soft edges, flowing colors, artistic, hand-painted look". Das kreativste Ergebnis. Ideal für künstlerische Projekte oder kreative Aufgaben.

Die Wahl des Stils ist optional. Wenn der Benutzer nichts angibt, wählt das LLM den am besten geeigneten Stil für den Kontext der Aufgabe. Eine Aufgabe "Einkäufe vorbereiten" wird im minimalistischen Stil sein. Eine Aufgabe "Logo für das neue Produkt entwerfen" wird im flachen Stil sein. Es ist eine kontextbezogene, keine zufällige Entscheidung. Die gleiche Philosophie wie bei der Sprachpersonalisierung: Die KI passt sich an, ohne dass man sie darum bitten muss.

Wie funktioniert die technische End-to-End-Pipeline?

Die vollständige Pipeline, von der Benutzeranfrage bis zur Bildanzeige, durchläuft 6 Schritte mit potenziellen Fehlerpunkten bei jedem Übergang:

  1. Benutzeranfrage → STT-Transkription → Text über WebSocket an das Backend gesendet.
  2. LLM-Analyse → das konversationelle LLM erkennt die Absicht, ein Bild zu generieren, und ruft das Funktionswerkzeug create_task mit einem Flag generate_image: true auf.
  3. Prompt Engineering → das Backend übergibt den Aufgabenkontext an das LLM, das einen optimierten Prompt generiert.
  4. Anbieteraufruf → das Backend sendet den Prompt an den konfigurierten Anbieter (Gemini oder Runware).
  5. Speicher-Upload → das empfangene Bild (base64 oder URL) wird in den dedizierten Supabase Storage-Bucket hochgeladen. Ein Eintrag wird in privat.task_attachments mit type: 'ai_generated', storage_path und Metadaten erstellt.
  6. Anzeige → das Frontend empfängt die Bestätigung über WebSocket, generiert eine signierte URL und zeigt das Bild in der Aufgabenkarte an.

Jeder Schritt kann fehlschlagen. STT kann falsch transkribieren. Das LLM kann die Absicht nicht erkennen. Der Anbieter kann ein Timeout haben. Der Upload kann fehlschlagen. Die Strategie: Wiederholung mit exponentiellem Backoff bei jedem Schritt und automatischer Fallback zwischen Anbietern, wenn der Hauptanbieter dreimal hintereinander fehlschlägt.

Der Gemini-zu-Runware-Fallback (oder umgekehrt) ist automatisch und für den Benutzer transparent. Er sieht nicht, dass der Anbieter gewechselt hat. Er sieht nur sein Bild erscheinen, vielleicht mit 2 Sekunden mehr. Das ist die gleiche Philosophie der Resilienz wie im nativen STT-System vs. Deepgram: immer einen Plan B haben.

Wie werden die Kosten pro Abonnementplan kontrolliert?

Administrations-Dashboard mit Kostenauswertungsdiagrammen für die KI-Bildgenerierung, dunkles Thema mit blauen und grünen Farben

Die KI-Bildgenerierung hat direkte Kosten pro Bild. Selbst bei 0,003 Euro pro Bild mit Runware, wenn 10.000 Benutzer 3 Bilder pro Tag generieren, sind das 900 Euro pro Monat. Es braucht Schutzmaßnahmen.

Das Limit-System pro Plan verwendet RevenueCat und Abonnementpläne:

  • Kostenloser Plan: kein Zugriff auf die Bildgenerierung. Dies ist eine Premium-Funktion, die ein Upgrade rechtfertigt.
  • Pro-Plan: tägliches Kontingent von N Bildern pro Tag (konfigurierbar auf Admin-Seite).
  • Team-Plan: höheres tägliches Kontingent, das unter den Gruppenmitgliedern geteilt wird.

Der Zähler wird auf der Backend-Seite verwaltet, nicht auf der Frontend-Seite (um Betrug zu vermeiden). Jede Generierung erhöht einen Zähler in der DB mit einem täglichen Reset über einen Cron-Job. Wenn das Kontingent erreicht ist, gibt das Backend einen expliziten Fehler zurück und das Frontend zeigt eine klare Meldung an: "Bilder-Kontingent für heute erreicht. Versuche es morgen erneut oder wechsle zum Team-Plan."

Das Admin-Dashboard zeigt Echtzeit-Verbrauchsstatistiken an: Anzahl der pro Tag generierten Bilder, durchschnittliche Kosten pro Bild, Gemini/Runware-Verhältnis, Fehlerrate pro Anbieter. Diese Metriken sind entscheidend, um Quoten anzupassen und den optimalen Anbieter auszuwählen. Ich hatte diese Art von Überwachung bereits im Admin-Dashboard-Analytics implementiert.

Warum lieben Benutzer diese Funktion?

Das häufigste Feedback der Tester: "Ich habe nicht das Gefühl, KI zu verwenden, es ist einfach natürlich." Das ist das beste Kompliment überhaupt. Die KI ist unsichtbar. Der Benutzer sagt "erstelle eine Aufgabe für das Samstags-Barbecue mit einem Bild" und erhält eine Aufgabe mit einer Barbecue-Illustration. Keine Modellauswahl. Keine Parametereinstellung. Kein Prompt zum Schreiben.

Eine Aufgabe mit einem Bild ist sofort ansprechender als eine reine Textaufgabe. Im Feed mit Gamification ziehen illustrierte Aufgaben die Aufmerksamkeit auf sich. Es ist ein gut dokumentiertes Designprinzip: Inhalte mit Bildern erzeugen laut Social Media Examiner 2 bis 3 Mal mehr Engagement als reine Textinhalte.

Und es ist auch ein Differenzierungsfaktor. Keine Aufgabenverwaltungs-App bietet eine integrierte KI-Bildgenerierung im Sprachfluss an. Das ist ein konkreter Wettbewerbsvorteil gegenüber Alternativen wie Todoist oder TickTick, die ich im Vergleichsartikel verglichen hatte.

Wie sieht die Zukunft der Bildgenerierung in TAMSIV aus?

Das aktuelle System ist eine solide Basis. Aber mehrere Entwicklungen sind geplant. Zuerst die Erweiterung auf Memos: Die Tabelle privat.memo_attachments existiert bereits mit der gleichen Struktur wie privat.task_attachments, wie im Artikel über Anhänge detailliert beschrieben.

Als Nächstes die Bildbearbeitung: die Möglichkeit, "Hintergrund blau ändern" oder "Text hinzufügen" zu einem bestehenden Bild zu sagen. Die APIs von Gemini und Runware unterstützen bereits Image-to-Image. Und die kollaborative Generierung: In einer Gruppe generiert ein Mitglied ein Bild und die anderen sehen es in Echtzeit über den Realtime-Kanal.

Das Ziel bleibt dasselbe: KI unsichtbar machen. Je leistungsfähiger die Technologie ist, desto einfacher muss sie zu bedienen sein.

Häufig gestellte Fragen

Welche Bildformate werden generiert?

Die Bilder werden im JPEG-Format mit einer Qualität von 95 % generiert. Die Standardauflösung beträgt 1024x1024 Pixel. Die Bilder sind für die mobile Anzeige optimiert, aber von ausreichender Qualität für die Desktop-Nutzung über das Web-Dashboard.

Kann ein Bild neu generiert werden, wenn das Ergebnis nicht passt?

Ja. Der Benutzer kann jederzeit eine neue Generierung anfordern. Das alte Bild bleibt im Speicher und das neue ersetzt es in der Anzeige. Das tägliche Kontingent wird bei jeder Generierung dekrementiert.

Wird das generierte Bild dauerhaft gespeichert?

Ja. Das Bild wird in Supabase Storage hochgeladen und über privat.task_attachments mit der Aufgabe verknüpft. Es bleibt verfügbar, solange die Aufgabe existiert. Das Löschen der Aufgabe führt zur kaskadierenden Löschung des Bildes.

Ist der vom LLM generierte Prompt für den Benutzer sichtbar?

Nein, standardmäßig nicht. Der Prompt ist technisch und auf Englisch, was für die meisten Benutzer nicht nützlich wäre. Der Prompt wird jedoch auf der Backend-Seite für Debugging und kontinuierliche Systemverbesserung protokolliert.

Funktioniert die Bildgenerierung offline?

Nein. Die Generierung erfordert einen API-Aufruf an den Bildanbieter (Gemini oder Runware) und einen Upload an Supabase Storage. Eine Internetverbindung ist unerlässlich. Die App zeigt eine klare Fehlermeldung an, wenn keine Verbindung besteht.