Prompt für Leere, Lade- und Fehlerzustände einer App in Codex

Gestalte den leeren, den ladenden und den Fehlerzustand eines App-Screens als getrennte Dateien, mit derselben Navigation und demselben Kopfbereich wie normal.

Gestalte für den Screen [Bibliothek] drei weitere Zustände als separate Dateien: leer (ein neuer Nutzer ohne Bücher, mit einem klaren nächsten Schritt), lädt (Skeleton-Platzhalter, die zum echten Layout passen) und Fehler (offline, mit einem Button zum erneuten Versuchen). Lass Navigation und Kopfbereich genau wie beim normalen Screen.

Funktioniert mit

Codex, ChatGPT

Aus der Sammlung

Mobile Apps

Über diesen Prompt

Codex gestaltet drei zusätzliche Versionen eines Screens: leer, für einen neuen Nutzer, der noch nichts hat, mit einem klaren nächsten Schritt; lädt, mit Skeleton-Platzhaltern in der Form des echten Layouts; und Fehler, für den Fall, dass das Gerät offline ist, mit einem Button zum erneuten Versuchen. Navigation und Kopfbereich bleiben identisch zum normalen Screen, nur der Inhaltsbereich ändert sich.

Richte die Klammer auf jeden Screen, dessen Daten fehlen können; ein Feed, ein Posteingang oder ein Screen mit Suchergebnissen braucht dieselben drei Zustände. Entscheide den nächsten Schritt des leeren Zustands, bevor du den Prompt ausführst, etwa ein erstes Buch hinzufügen oder eine Leseliste importieren, und schreib ihn hinein, damit Codex keinen erfindet.

Diese Zustände tauchen meist erst in der Entwicklung auf, wo ein Entwickler sie improvisieren muss. Wenn du sie jetzt aus dem fertigen Listenscreen gestaltest, passt das Skeleton zu den echten Zeilen, und die Fehlermeldung behält den Ton der App. Gib sie zusammen mit dem Hauptscreen weiter, damit alle vier im selben Durchgang gebaut werden.

Weitere Prompts aus dieser Sammlung

• Prompt für den Dark Mode einer App in CodexErstelle Dark-Mode-Versionen von App-Screens mit getöntem Hintergrund, gedämpften Akzenten, Textkontrast nach WCAG AA und einer Liste der geänderten Farben.
• Prompt für die Android-Anpassung mit Material 3 in CodexPasse einen iOS-Screen mit Material 3 an Android an: Top App Bar, Navigationsleiste und FAB, bei gleichen Markenfarben und Schriften.
• Prompt für App-Mockups zu SwiftUI-Code in CodexLass Codex die abgenommenen HTML-Screens in deiner SwiftUI-App umsetzen, mit passendem Layout und Abständen, deinen Theme-Farben und Dynamic Type.
• Prompt für App-Briefing und Screen-Liste in CodexBeschreibe Nutzer, Kernablauf und Plattform deiner App und lass Codex alle Screens der ersten Version gruppiert auflisten, mit dem Zweck jedes Screens.
• Prompt für den Onboarding-Flow einer App in CodexGestalte drei verbundene Onboarding-Screens in 390×844, Willkommen, Tagesziel und erster Startscreen, in einem gemeinsamen Stil mit CSS-Illustrationen.
• Prompt für den Startscreen einer mobilen App in CodexGestalte einen Startscreen für wiederkehrende Nutzer um das eine Element, das du als wichtigstes nennst, mit Tab-Leiste und echten Zahlen.