jp-skill-image

Was macht jp-skill-image?

Konvertiert eine natürlichsprachliche Anfrage in ein mit Cloudflare Workers AI (@cf/black-forest-labs/flux-1-schnell) generiertes Bild. Der vollständige Ablauf: Der Benutzer beschreibt, was er möchte, Claude optimiert den Prompt, das Skript ruft die Cloudflare-API auf und das Bild wird lokal als JPG gespeichert.

Wann dieser Skill angewendet wird

Der Benutzer möchte ein Bild basierend auf einer Beschreibung generieren – „Erstelle ein Logo für ein Café“, „Mach ein Thumbnail für mein KI-Video“, „Ein Bild einer Cyberpunk-Katze“. Claude ist dafür verantwortlich, eine vage Anfrage in einen hochwertigen Prompt zu übersetzen, bevor die Generierung gestartet wird.

Nicht anwendbar bei: Bearbeiten eines vorhandenen Bildes, Vektorgrafiken/SVG oder Video.

Schritt 0 – IMMER zuerst die .env-Datei prüfen

Überprüfe vor dem Ausführen des Skripts, ob die Anmeldeinformationen verfügbar sind. Das Skript sucht in dieser Reihenfolge: echte Umgebungsvariablen → .env im aktuellen Verzeichnis oder in einem übergeordneten Verzeichnis → ~/.claude/skills/jp-skill-image/.env (globaler Fallback).

python3 -c "import sys; sys.path.insert(0, '$HOME/.claude/skills/jp-skill-image'); from generate import load_credentials; print('OK' if all(load_credentials()) else 'FEHLT')"

Wenn eine Variable fehlt (neuer Benutzer / frisch geklontes Projekt), versuche NICHT, das Bild zu generieren – weise den Benutzer stattdessen in 3 kurzen Schritten an, wie er die Variablen erhält:

1. CF_ACCOUNT_ID: Cloudflare Dashboard → beliebige Domain/Projekt → Workers & Pages → Overview (erscheint rechts), oder direkt unter https://dash.cloudflare.com/profile/account-id … falls es dort nicht angezeigt wird, verwende die ID, die in der Dashboard-URL oder im Abschnitt Manage Account der linken Seitenleiste (nicht „My Profile“) zu sehen ist.
2. CF_API_TOKEN: https://dash.cloudflare.com/profile/api-tokens → Create Token → Custom Token → Berechtigung Account.Workers AI Scripts: Edit → Account Resources: dein Konto → Create.
3. Erstelle die .env-Datei – entweder im Projektstammverzeichnis oder unter ~/.claude/skills/jp-skill-image/.env, damit sie von jedem Ordner aus funktioniert – mit folgendem Inhalt:

   CF_ACCOUNT_ID=xxxxx
   CF_API_TOKEN=xxxxx
   

Wenn das Projekt einen Unternehmens-Proxy für den Internetzugang verwendet (überprüfe, ob HTTPS_PROXY in .npmrc existiert oder ob API-Anfragen externer Dienste wegen Timeouts fehlschlagen), füge ebenfalls Folgendes hinzu:

HTTPS_PROXY=<unternehmens-proxy>

Sobald bestätigt ist, dass die Variablen vorhanden sind, fahre normal fort.

So wird es ausgeführt

Von einem beliebigen Verzeichnis aus (das Bild wird relativ zum aktuellen Verzeichnis gespeichert):

python3 ~/.claude/skills/jp-skill-image/generate.py "<optimierter Prompt>" -o <dateiname>.jpg --steps <N>

• "<optimierter Prompt>" – der Prompt, den du schreibst (siehe unten), nicht die Rohworte des Benutzers.
• -o / --output – Speicherort (Standard: out.jpg). Verwende einen kurzen, aussagekräftigen Namen, z. B. coffee-logo.jpg.
• --steps – Diffusionsschritte (Standard: 4). flux-schnell ist für wenige Schritte optimiert, aber für die BESTE Qualität verwende 8, es sei denn, der Benutzer wünscht Geschwindigkeit. Verwende niemals weniger als 4.

Das Skript gibt bei Erfolg Gespeichert <datei> ... aus, andernfalls eine lesbare Fehlermeldung (beinhaltet den Fall einer JSON-Antwort mit Base64-Bild, der intern behandelt wird).

Claudes eigentliche Aufgabe: Einen Prompt von höchster Qualität schreiben

Der Wert dieses Skills liegt darin, dass Claude die Absicht des Benutzers in einen lebendigen, spezifischen und technisch korrekten Prompt erweitert, bevor das Skript aufgerufen wird. Gib die Anfrage des Benutzers niemals unverändert weiter – bearbeite sie immer zuerst.

Ein hochwertiger Prompt für Flux sollte in dieser Reihenfolge Folgendes enthalten:

1. Hauptmotiv – was sich in der Szene befindet, konkret und eindeutig.
2. Stil/Medium – realistisches Foto, 3D-Render, flache Vektorgrafik, Aquarell, isometrisch, Pixel-Art usw.
3. Komposition und Bildausschnitt – Nahaufnahme, Totale, zentriert, Drittelregel, Kamerawinkel.
4. Beleuchtung und Atmosphäre – goldene Stunde, Neonlicht, weiches Studiolicht, dramatische Schatten, Gegenlicht.
5. Farbe und Detailgrad – spezifische Palette, Hintergrund, Texturen, Detailgrad („highly detailed“, „clean minimal“).
6. Technische Qualität (bei realistischen Fotos/Rendern) – Begriffe wie „cinematic“, „8k“, „sharp focus“, „professional photography“ helfen Flux, sich Premium-Ergebnissen anzunähern.

Beispiel für eine Transformation:

• Benutzer: „ein Logo für ein Café“
• Prompt, den du weitergibst: „minimalist logo of a steaming coffee cup, flat vector illustration, warm brown and cream palette, centered on a clean off-white background, simple bold shapes, modern branding, professional design“

Harte Regeln:

• Prompt immer auf Englisch (Flux reagiert besser).
• 1–2 Sätze, dicht an Informationen, ohne Füllwörter.
• Bitte niemals um lesbaren Text/Wörter innerhalb des Bildes – Flux kann diese nicht gut rendern.
• Wenn der Benutzer nicht genügend Details angibt, fülle die Lücken mit den besten kreativen Entscheidungen (frage nur nach, wenn das Motiv wirklich mehrdeutig ist).
• Verwende standardmäßig --steps 8, um die Qualität zu maximieren; reduziere sie nur auf 4, wenn der Benutzer explizit Geschwindigkeit wünscht.

Nach der Generierung

1. Bestätige, dass die Datei gespeichert wurde (das Skript gibt den Pfad aus).
2. Teile dem Benutzer den Dateinamen und den exakt verwendeten Prompt mit, damit er Anpassungen vornehmen und die Generierung wiederholen kann.
3. Wenn der Benutzer Variationen wünscht, führe das Skript mit einem geänderten Prompt und einem neuen -o erneut aus.

Technische Voraussetzungen

• CF_ACCOUNT_ID und CF_API_TOKEN müssen über eine der drei Quellen aus Schritt 0 verfügbar sein.
• Python 3.8+. Keine externen Abhängigkeiten – das Skript verwendet nur die Standardbibliothek (urllib), daher ist weder pip install noch eine virtuelle Umgebung erforderlich.
• Das Skript dekodiert die Base64-Antwort der Cloudflare-API und speichert sie als binäre JPG-Datei – die API-Antwort ist nicht direkt das Bild.