imagegen-frontend-mobile

Sag das, um den Skill zu aktivieren

---
name: imagegen-frontend-mobile
description: Erzeugt per Bildgenerierung realistische Mobile-App-Screens (iOS/Android) als Mockups für Pitches und Produkt-Previews.
---

Dieser Skill produziert glaubwürdige App-Screens per Bildgenerierung, ohne dass Code oder ein Designtool nötig ist.

## Wann dieser Skill aktiviert wird
- Jemand bittet um iOS- oder Android-Screens für eine App-Idee, etwa "Erzeuge Screens für unsere Service-App".
- Ein Onboarding-Flow oder Pitch-Deck braucht Mockups, bevor Design-Budget investiert wird.
- Stakeholder sollen eine Produktidee anhand glaubwürdiger Screens bewerten.

## Workflow
1. Briefing klären: Plattform, Anzahl Screens, Flow (z. B. Onboarding in 3 bis 4 Schritten), Markenfarben als Hex-Werte, Light oder Dark Mode. Fehlendes erfragen statt raten.
2. Style-Spec als Textblock festhalten: Primär- und Akzentfarbe, Hintergrund, Eckenradius, Schriftcharakter, Icon-Stil. Der Block wandert unverändert in jeden Prompt, sonst driften die Screens auseinander.
3. Pro Screen einen Prompt nach festem Schema bauen: Gerät und OS, Screen-Typ, UI-Elemente von oben nach unten (Statusleiste, Header, Inhalt, Tab-Bar), dann Style-Spec, dann Qualitätsanker wie "clean high fidelity UI design".
4. Sichtbaren Text radikal kürzen: nur Headline plus 1-2 Labels vorgeben, denn Bildmodelle verstümmeln längere Texte. Fließtext als "placeholder text lines" beschreiben.
5. Im Hochformat generieren (9:16 oder 2:3), ein Screen pro Bild, keine Collagen anfordern.
6. Jedes Ergebnis prüfen: Buchstabensalat, kaputte Icons, doppelte Statusleisten, falsche Plattform-Muster. Fehlversuche mit präzisiertem Prompt neu generieren, maximal 2-3 Iterationen pro Screen.
7. Konsistenz über alle Screens vergleichen: Farben, Eckenradius, Tab-Bar. Ausreißer neu generieren.
8. Dateien nach Flow-Reihenfolge benennen (01-onboarding-welcome.png) und mit Prompt-Log übergeben.

## Output-Format
- Ein PNG pro Screen im Hochformat, nummeriert nach Flow-Reihenfolge.
- Style-Spec und finale Prompts als Textdatei, damit weitere Screens nachziehbar sind.
- Optional eine Übersichtsmontage aller Screens für Deck oder Preview.

## Qualitätsregeln
- Kein unleserlicher oder erfundener Text in Headlines; jedes Bild wird darauf gesichtet.
- Plattform-Konventionen stimmen: iOS mit Tab-Bar unten und Chevron-Back, Android mit Material-Mustern. Nie mischen.
- Maximal eine Akzentfarbe, identisch über alle Screens.
- Tab-Bar mit höchstens 5 Einträgen, Touch-Elemente sichtbar fingertauglich.
- Keine echten Logos oder Marken Dritter im Screen.
- Genau eine vollständige Statusleiste pro Screen.

Skill teilen