EcomStudio Pro — AI Image Generation für E-Commerce

tl;dr

• EcomStudio Pro ist eine Plattform, die aus wenigen Referenzfotos automatisch komplette E-Commerce-Bildsets erzeugt — Cutouts, Infografiken und Lifestyle-Aufnahmen.
• Das Projekt begann als browser-zentrierter Prototyp (React + OpenRouter direkt aus dem Frontend) und wuchs zu einer vollständigen SaaS-Architektur mit FastAPI-Backend, PostgreSQL und Docker-Deployment.
• Kerninnovation ist das Slot-System: Statt Prompt-Engineering definieren Nutzer über benannte Bild-Slots („Cutout”, „Lifestyle mit Person”), was generiert werden soll. Die KI-Kommunikation läuft unsichtbar im Hintergrund.
• Jede Generation ist vollständig reproduzierbar und auditierbar — alle Parameter, Prompts und Kosten werden gespeichert.
• Das Produkt ist als White-Label-Lösung konzipiert: Jeder Kunde bekommt eine eigene, isolierte Instanz inklusive Branding-Anpassung.

Kurzbeschreibung

EcomStudio Pro adressiert ein klassisches E-Commerce-Problem: Die Produktion von Produktbildern ist teuer, zeitaufwändig und inkonsistent — besonders wenn Bilder für verschiedene Marktplätze, Kampagnen und Formate benötigt werden. Die Plattform löst das, indem sie aus 1–3 Referenzfotos in einem Durchlauf sieben professionelle Bilder generiert: zwei Cutouts (freigestellte Produkte), zwei Infografiken (mit Produktmerkmalen) und drei Lifestyle-Aufnahmen (inszenierte Umgebungen). Das System ist dabei so konzipiert, dass kein Prompt-Wissen nötig ist — die Steuerung erfolgt über konfigurierbare Slots und Variablen, die auch Nicht-Techniker bedienen können.

Ausgangspunkt / Problemstellung

E-Commerce-Teams stehen vor einer strukturellen Herausforderung: Ein einzelnes Produkt wird auf Amazon, im eigenen Onlineshop, in Newsletter-Kampagnen und auf Social Media benötigt — jedes Mal in einem anderen Format. Cutouts für Marktplätze, Infografiken für Detailseiten, Lifestyle-Bilder für Kampagnen. Die manuelle Produktion ist teuer (Fotograf, Studio, Setaufbau), langsam (Tage bis Wochen pro Produkt) und kaum skalierbar.

Gleichzeitig halten KI-Bildgeneratoren Einzug, aber die Bedienung ist komplex: Prompt-Engineering erfordert Erfahrung, Ergebnisse sind oft nicht reproduzierbar, und es fehlt eine strukturierte Verwaltung der erzeugten Assets. Bestehende Lösungen sind entweder zu unflexibel (starre Vorlagen) oder zu technisch (erfordern API-Kenntnisse).

Ausgangspunkt des Projekts war die Frage: Wie bringt man KI-Bildgenerierung in die Hände von E-Commerce-Operateuren, die weder prompten noch programmieren können oder wollen?

Idee

Die Idee ist radikal einfach: Statt den Nutzer mit Prompt-Feldern und Modell-Parametern zu konfrontieren, definiert man Bild-Slots — benannte, typisierte Vorlagen für bestimmte Bildkategorien. Ein Cutout-Slot weiß, dass er ein freigestelltes Produkt auf transparentem Hintergrund liefern soll. Ein Lifestyle-Slot kennt die gewünschte Umgebung und Perspektive. Der Nutzer wählt einfach aus, welche Slots er belegen möchte, lädt seine Referenzfotos hoch und startet die Generation.

Die Übersetzung von Slot-Auswahl in KI-Prompts passiert automatisch im Hintergrund. Der Nutzer bekommt nur das Ergebnis — sieben fertige Bilder. Wer möchte, kann über Variablen („Winkel”, „Umgebung”, „Person ja/nein”) Feinjustierungen vornehmen, ohne je einen Prompt zu schreiben.

Welche Hypothese steckt dahinter?

Die zentrale Hypothese ist: E-Commerce-Teams zahlen lieber für verlässliche, reproduzierbare Ergebnisse als für flexible, aber unberechenbare KI-Tools. Ein System mit 7 fixen Bildern, starken Defaults und klarer Kostenprognose ist wertvoller als ein Tool, das alles kann, aber nichts zuverlässig liefert.

Zweitens: Wenn man die KI-Komplexität hinter einem Slot-System versteckt, können auch nicht-technische Nutzer professionelle Ergebnisse erzielen. Die Konfiguration (welche Slots, welche Variablen) wird selbst zum Produkt — sie ist Daten, nicht Code.

Warum das relevant ist

KI-Bildgenerierung im E-Commerce ist kein Hype mehr, sondern operativer Alltag. Aber die bestehenden Ansätze scheitern an drei Punkten:

1. Qualitätskontrolle — Ohne strukturierte Vorlagen entstehen inkonsistente Ergebnisse
2. Reproduzierbarkeit — Ohne gespeicherte Konfiguration kann man ein gutes Ergebnis nicht wiederholen
3. Compliance — KI-generierte Bilder brauchen Metadaten (AI Act, DSA) und Audit-Trails

EcomStudio Pro adressiert alle drei Punkte systematisch. Das macht es nicht nur für einzelne Händler interessant, sondern auch für Agenturen, Marken und Plattform-Betreiber, die Bildgenerierung als Dienstleistung anbieten wollen.

Ansatz

Die Architektur hat zwei Entwicklungsstufen durchlaufen. Die erste Version war ein browser-zentrierter Prototyp — bewusst einfach gehalten, um schnell zu validieren, ob das Slot-Konzept funktioniert.

Die erste Stufe (ecom_genai-image-generation) war eine reine React-SPA mit Firebase. Sie lief vollständig im Browser — die Bildgenerierung erfolgte durch direkte OpenRouter-Aufrufe aus dem Frontend, die Ergebnisse wurden in Firestore gespeichert. Das war bewusst so gewählt: minimale Infrastruktur, maximale Geschwindigkeit in der Validierung. In dieser Version entstanden die Kernkonzepte: Slot-Builder mit Coverage-Checkliste, Referenz-Upload mit Validierung, Job-History mit Rerun-Funktion und ein Kosten-Dashboard als UI-Shell.

Die zweite Stufe (ecom-studio-pro-saas) ist die eigentliche Plattform. Sie trennt Frontend und Backend sauber: Ein Next.js-Frontend kommuniziert mit einer FastAPI, die wiederum auf PostgreSQL, MinIO (S3-kompatibler Speicher) und OpenRouter zugreift. Jeder Kunde bekommt seine eigene, isolierte Instanz per Docker Compose — keine Multi-Tenancy, sondern echte Mandantentrennung.

Bereits implementiert

• Frontend (Next.js 14, TypeScript, Tailwind, shadcn/ui):

  • Authentifizierung (Login/Signup mit JWT, HttpOnly-Cookies, Session-Persistenz)
  • Brand-Einstellungen (Name, Beschreibung, Farben, Logo-Upload, Live-Vorschau)
  • Admin-Konfiguration (API-Provider, Modell-Auswahl, verschlüsselte Key-Eingabe)
  • Referenzbilder-Upload (1–3 Bilder, Validierung ≥1024px, Vorschau)
  • Slot-Manager (CRUD, Aktivieren/Deaktivieren, benutzerdefinierte Slots, Löschen)
  • Variable-Selektion pro Slot (Dropdowns, gruppierte Optionen)
  • Prompt-Textarea (freie Notizen, Vorschau, Speicherung)
  • Generation-Seite mit Slot-Validierung, Fortschrittsanzeige, Abbruch
  • Vorschau-Raster mit Format-/Größenauswahl
  • Kostenanzeige (pro Slot, Gesamtkosten, Währungsauswahl)
  • Verlaufsseite mit Paginierung, Detailansicht, Neugenerierung
  • Audit-Trail-Seite (tabellarisch, filterbar, Export als CSV/JSON)
  • Daten-Privacy-Seite (Übersicht, Einstellungen)
  • Dashboard-Startseite
  • Sonner-Toast-Benachrichtigungen (Erfolg/Fehler)
  • WCAG 2.1 AA Barrierefreiheit (ARIA-Labels, semantische Hierarchie, Touch-Targets)
  • Vollständig responsiv (Mobile/Tablet/Desktop)

• Backend (FastAPI, async SQLAlchemy, PostgreSQL):

  • Auth-Endpunkte (Signup/Login/Logout/Me, JWT, Passwort-Hashing)
  • Brand-Settings CRUD (Name, Beschreibung, Farben, Logo)
  • Admin-Config (API-Provider, Modell, verschlüsselte Key-Speicherung mit Fernet)
  • Referenzbilder-Upload, Validierung, Auflistung
  • Slot-CRUD (Default-Slots via Seeding, benutzerdefiniert, Enable/Disable)
  • Variable-CRUD mit Gruppen, Slot-Zuordnung
  • Generation-Preview-Endpunkt mit Prompt-Injection, Fortschritt, Abbruch
  • Download-Endpunkte (Einzelbild, ZIP)
  • Kosten-Tracking (pro Slot, Gesamt, Währung)
  • History-API (paginiert, Detail, Kosten-Aggregation)
  • Audit-Log (append-only, Aktionen, Vorher/Nachher, JSON-Export)
  • Metadaten-Einbettung (EXIF/PNG AI-Disclosure)
  • Fehlerbehandlung mit Domain-Exceptions und strukturierten Responses
  • Strukturiertes Logging (Loguru, JSON, Request-Kontext)
  • Umfassende Test Suite (pytest, async, Coverage >80%)

• Infrastruktur (Docker Compose):

  • Frontend-Container (Node.js 20 Alpine, Multi-Stage-Build)
  • Backend-Container (Python 3.11+, FastAPI)
  • PostgreSQL-Container pro Instanz
  • MinIO-Container für Bildspeicher
  • Bridge-Netzwerk (ecomstudio-network)

In Entwicklung / geplant

• Team-Zusammenarbeit — Aktuell ist das System auf Einzelbenutzer ausgelegt. Team-Features (gemeinsame Projekte, Rollen) sind für v2 vorgesehen.
• Erweiterte Prompt-Bearbeitung — Derzeit werden Prompts aus Slot + Variablen generiert. Ein grafischer Prompt-Editor für Power-User ist in Planung.
• Brand-Kits — Mehrere Markenprofile pro Instanz verwalten und zwischen ihnen wechseln.
• CI/CD-Pipeline — Automatisierte Tests, Linting und Deployment für beide Container.
• Proxy-Service für OpenRouter — API-Key-Schutz durch zentralen Proxy (Firebase Function oder separater Service), derzeit sind die Keys im Frontend (mit Referer-Restriktion gesichert).

Erkenntnisse

1. Browser-first ist ein gültiger Validierungspfad. Die erste Version mit direkten OpenRouter-Aufrufen aus dem Browser erlaubte es, innerhalb weniger Wochen ein funktionierendes Produkt zu haben. Die API-Key-Exponierung wurde durch Referer-Restriktionen akzeptabel gemanagt. Der Trade-off (Sicherheit gegen Geschwindigkeit) war für die Validierungsphase die richtige Entscheidung.

2. Das Slot-Konzept ist der entscheidende Hebel. Es abstrahiert nicht nur die KI-Komplexität, sondern schafft auch ein konfigurierbares Produkt, bei dem die Konfiguration selbst Wert hat. Slots sind Daten, nicht Code — das ist der Unterschied zu einem starren Template-System.

3. Compliance ist kein Add-on, sondern Architektur. Die Entscheidung, Audit-Logs append-only zu führen, Generation-Metadaten vollständig zu speichern und AI-Disclosure in die Bild-Metadaten einzubetten, war aufwändig, aber richtig. Der EU AI Act und die DSA machen solche Anforderungen zur Pflicht — und Kunden fragen zunehmend danach.

4. Reproduzierbarkeit ist das Killer-Feature für Enterprise. Die Möglichkeit, eine Generation mit genau denselben Parametern, demselben Prompt und denselben Referenzen zu wiederholen, unterscheidet EcomStudio Pro von den meisten KI-Tools am Markt. In der Praxis ist das oft relevanter als die reine Bildqualität.

5. Per-Customer-Isolation vs. Multi-Tenancy. Die Entscheidung für isolierte Instanzen (eigene Datenbank, eigener Speicher, eigener Container) erhöht den Deployment-Aufwand pro Kunde, vereinfacht aber Compliance, Sicherheit und individuelle Anpassung massiv. Der Kompromiss ist akzeptabel, solange die Zahl der Kunden überschaubar bleibt.

Nächste Schritte

1. Backend-Polish abschließen (Phase 15–16) — Fehlerbehandlung, Logging, Testabdeckung
2. Deployment-Automatisierung — CI/CD-Pipeline für Docker-Builds, Migrationen, Rollouts
3. Erste Kunden-Instanz — Vollständiger Onboarding-Prozess mit Branding-Konfiguration und Übergabe
4. Integration Shopify / BigCommerce — Direkte Bild-Übernahme aus und in die Shopsysteme
5. Team-Features — Mehrbenutzerfähigkeit mit Rollen und gemeinsamem Workspace

Persönliche Note

Dieses Projekt ist für mich eine Art „ideales Produkt”: Es löst ein echtes, messbares Problem (teure, langsame Produktfotografie), es kombiniert mehrere meiner Interessensfelder (KI, E-Commerce, Systemarchitektur), und es hat eine klare wirtschaftliche Logik. Die Entwicklung vom schnellen Browser-Prototypen zur vollständigen SaaS-Plattform spiegelt ziemlich gut wider, wie ich Produkte baue: erst Validierung, dann Architektur — nie umgekehrt.

Was mich besonders reizt, ist das Slot-Konzept. Es ist ein Paradebeispiel für Translation — die Fähigkeit, eine komplexe technische Domäne (Prompt-Engineering, KI-Modelle) so zu übersetzen, dass ein Nicht-Techniker sie bedienen kann, ohne auf Kontrolle zu verzichten. Genau diese Art von Übersetzungsarbeit ist das, was ich am liebsten mache.

FAQ

Was genau ist EcomStudio Pro? Eine White-Label-SaaS-Plattform, die aus 1–3 Referenzfotos automatisch 7 E-Commerce-Bilder generiert — Cutouts, Infografiken und Lifestyle-Aufnahmen.

Für wen ist das gedacht? E-Commerce-Teams, Marketingleute und Content-Ersteller, die schnell, kosteneffizient und reproduzierbar Produktbilder brauchen — ohne Prompt-Engineering-Kenntnisse.

Wie unterscheidet es sich von Midjourney oder DALL-E? EcomStudio Pro ist kein generisches KI-Tool, sondern ein spezialisiertes System für E-Commerce-Bildproduktion. Statt Prompten verwendet es Slots und Variablen. Die Ergebnisse sind reproduzierbar, auditierbar und in festen Formaten (7 Bilder, definierte Auflösungen).

Welche Bildformate werden produziert? Pro Job: 2 Cutouts (PNG mit transparentem Hintergrund), 2 Infografiken (PNG), 3 Lifestyle-Aufnahmen (JPG). Alle im 1:1-Format (2000 × 2000 Pixel).

Ist das System auch für Nicht-Techniker bedienbar? Ja, das ist der Kern des Designs. Kein Prompt-Engineering — die Steuerung erfolgt über die Auswahl von Slots und Variablen. Die KI-Kommunikation läuft unsichtbar im Hintergrund.

Wie wird die Datensicherheit gewährleistet? Jeder Kunde bekommt eine eigene, isolierte Instanz mit eigener Datenbank, eigenem Speicher und eigenen Containern. Referenzbilder bleiben bis zur Generation lokal. API-Keys werden verschlüsselt gespeichert (Fernet). Alle Aktionen werden audit-loggt.

Welche Compliance-Anforderungen werden erfüllt? GDPR (Datensouveränität durch Instanz-Isolation), EU AI Act (KI-Metadaten in Bildern, Disclosure), Digital Services Act (vollständige Audit-Trails, Reproduzierbarkeit).

Kann ich mein eigenes KI-Modell verwenden? Ja. Das System unterstützt OpenRouter als Standard, erlaubt aber BYOK (Bring Your Own Key) für eigene Modelle oder API-Keys.

Wie läuft die Bereitstellung ab? Per Docker Compose. Jede Kundeninstanz besteht aus Frontend-, Backend-, PostgreSQL- und MinIO-Container. Die Konfiguration erfolgt über Umgebungsvariablen.

Was kostet eine Generation? Die Kosten variieren je nach KI-Modell. Das System trackt die tatsächlichen Kosten pro Slot und zeigt sie im Dashboard an — inklusive Vergleich mit manuellen Produktionskosten.

Fussnoten

• OpenRouter — Multi-Model API für KI-Modelle
• FastAPI — Modernes Python-Webframework
• Next.js 14 App Router — React-Framework
• MinIO — S3-kompatibler Objektspeicher
• SQLAlchemy 2.x Async — Python-ORM
• Alembic — Datenbank-Migrationen
• shadcn/ui — Radix-UI-basierte Komponenten
• Tailwind CSS v4 — Utility-First CSS
• EU AI Act — Rahmenwerk für Künstliche Intelligenz
• Sonner — Toast-Benachrichtigungen für React
• Quelle: ecom_genai-image-generation — React-Prototyp (Phase 1)
• Quelle: ecom-studio-pro-saas — SaaS-Plattform (Phase 2)
• Zustand — State-Management für React
• TanStack React Query — Server-State-Management
• Pillow — Python-Bildverarbeitung
• Loguru — Python-Logging