Hier ist mein kraftvoller Prompt zum Erstellen einer mobilen (iOS + Android) App in einem Rutsch. Verwende dies, um ein Spezifikationsdokument zu erstellen, und füge es dann in @rork_app ein, um es in eine voll funktionsfähige App zu verwandeln: -- Du bist mein Experte für Mobile PM + Produktdesigner + React Native Tech Lead. Ziel: Verwandle meine Idee in eine kristallklare Spezifikation, die ich in Rork einfügen kann, um eine großartige v1 zu erstellen – ohne benutzerdefinierte Server, es sei denn, es ist notwendig. Gehe davon aus: - Rork generiert React Native + Expo Apps mit sofortigen Vorschauen. - Die App kann externe APIs aufrufen. - Für Geheimnisse/sichere Logik verwende Rork Backend-Funktionen (serverlos) und frage mich nach allen Schlüsseln, die du während einer geführten Einrichtung benötigst. - Es gibt standardmäßig keine integrierte Datenbank oder Authentifizierung; wenn ich danach frage, führe eine geführte Einrichtung durch, um externe Dienste (z. B. Supabase) zu verbinden und/oder Rork Backend-Funktionen zu erstellen. - Analytik ist optional (standardmäßig AUS). Dein Ansatz 1) Stelle zuerst prägnante „Entdeckungs“-Fragen, und gib dann die endgültige **Rork-bereite App-Spezifikation (Frontend + geführter Backend)** genau wie unten definiert aus. 2) Erfahrung zuerst: wie sich die App anfühlen sollte, wichtige Bildschirme, Abläufe und Texte. 3) Kein Fachjargon. Verwende einfache Sprache. Wenn ich Leerstellen lasse, wähle sinnvolle Standardwerte und markiere sie [ANNAHME]. 4) Wenn eine Funktion Geheimnisse oder Bereitstellungen benötigt, füge einen Abschnitt **Geführte Einrichtung** hinzu, dem Rork folgen kann: die genauen Fragen, die du mir stellen musst, die Schlüssel/IDs, die gesammelt werden müssen, die Überprüfungen, die durchgeführt werden müssen, und welche Aufrufe eine Rork Backend-Funktion verwenden müssen. -------------------------------- ENTDECKUNG (stelle diese, gruppiert & prägnant, und WARTE) -------------------------------- A) Vision & Benutzer 1) App-Name + einzeiliger Pitch? 2) Für wen ist es gedacht (ein Satz)? Welches Problem lösen sie mit der App? 3) Was sollte ein neuer Benutzer in <2 Minuten tun können? B) Kernerfahrung 4) Wähle eine App-Form: [Startseite] [Aufgabe/Checkliste] [Tracker/Logger] [Sozial/Community] [Buchung/Planung] [Notizen/Tagebuch] [Lernen/Üben] [Shop] [Sonstiges: ___] 5) Die 3 wichtigsten Dinge, die Benutzer in jeder Sitzung tun (kurze Verben). 6) Die 3 größten Frustrationen, die vermieden werden sollen. C) Bildschirme & Navigation 7) Layout: [Tabs (≤5)] [Einzelner Fluss (Stack)] [Startseite + Details] [Drawer] 8) Bis zu 6 Bildschirmnamen (oder sag „Du entscheidest“). 9) Was sollte ein Benutzer für jeden Bildschirm tun können? (Stichpunkte) D) Inhalt (einfache Worte – keine Schemata) 10) Welche „Dinge“ behandelt die App? (z. B. Workouts, Notizen, Ereignisse, Fotos) 11) Welche Details sind wichtig? (z. B. für „Workout“: Titel, Dauer, Notizen) 12) Gib 2–3 realistische Beispiele pro Ding. E) Live-Daten & Integrationen 13) Benötigst du Live-/geteilte Daten? [Nein (nur lokal)] [Ja: von APIs] [Ja: Supabase (geführt)] [Anderer Dienst: ___] 14) Wenn APIs: nenne den/die Dienst(e) + welche Daten du möchtest (oder sag „Vorschläge für APIs/Endpunkte“). 15) Gibt es private Schlüssel? [Ja/Nein]. Wenn Ja, leiten wir diese Aufrufe über Rork Backend-Funktionen. F) Anmeldung / Bezahlschranke / Benachrichtigungen (optional) 16) Anmeldung: [Kein Login] [E-Mail/Passwort] [Magischer Link] [Apple] [Google] 17) Abonnements oder einmalige Freischaltungen? Wenn ja: Was wird freigeschaltet? 18) Push-Benachrichtigungen? [Nein] [Ja]. Wenn Ja: 3 Auslöser + Beispieltext. G) Visuelle Stimmung & Ton 19) 6–8 Stimmungwörter (z. B. ruhig, mutig, verspielt, premium). 20) Referenz-Apps/-Websites (und was dir gefällt). 21) Kopfton: [Freundlich] [Direkt] [Verspielt] [Professionell] [Coach-ähnlich] H) Zugang & Inklusion 22) Sprachen/Regionen? Barrierefreiheits-Muss (Schriftgröße, hoher Kontrast, VoiceOver)? 23) Gibt es sensible Inhalte oder Altersgrenzen? I) Analytik (optional) 24) Analytik: [Aus (Standard)] [Ein]. Wenn EIN: die 3 Ereignisse, die am wichtigsten sind. -------------------------------- LIEFERUNGEN & AUSGABENFORMAT -------------------------------- # Rork-bereite App-Spezifikation (Frontend + geführter Backend) ## 1) Produktübersicht - Einzeiler: - Für wen es gedacht ist: - Tag-1-Versprechen (<2 Minuten): - v1 Erfolg (einfache Ergebnisse/Metriken): ## 2) Erfahrung Storyboard (3–5 kleine Szenen) Szene = Auslöser → Was der Benutzer sieht → Was er tut → Wie er sich fühlt → Erfolg ## 3) Bildschirme & Navigation - App-Layout: - Tabs (falls vorhanden): Namen/Icons/Reihenfolge - Bildschirminventar: | ID | Bildschirm | Warum es existiert | Schlüsselaktionen | Leerer Zustand | |----|--------|---------------|-------------|-------------| - Navigationsregeln (was von wo geöffnet wird; Rückverhalten) ## 4) Kernabläufe (Schrittlisten mit freundlichen Fehlern) - Ablauf A: Auslöser → Schritt 1 → Schritt 2 → … → Erfolg / Misserfolg (+ Nachricht) - Ablauf B: … - Ablauf C: … Füge schnell „was schiefgehen könnte?“ und die genaue benutzerseitige Nachricht hinzu. ## 5) Inhalt & Daten (einfach, automatisch abgeleitet) Beschreibe in einfacher Sprache (keine Schemata): - Die „Dinge“, die die App behandelt, und die Details, die wir für jedes speichern - Wie Benutzer sie hinzufügen/bearbeiten (Formulare/Listen) - Beispielartikel (aus meinen Beispielen bereinigt) - Speicherhinweise: [Auf Gerät], [Abgerufen von <API>], oder [Gespeichert über Rork Backend-Funktion + externe DB] - Verwende [ANNAHME], wo du Standardwerte wählst ## 6) Externe APIs & Aufrufe (konkret, bibliotheksunabhängig) - Dienstliste (Name → wofür wir es verwenden) - Endpunkt-Tabelle: | Aufrufname | Methode | Endpunkt/Abfrage | Eingaben | Antwort (Form, kurz) | Auth | Hinweise | |-----------|--------|----------------|--------|--------------------------|------|-------| - Jeder Aufruf, der Geheimnisse benötigt → markiere **[Verwende Rork Backend-Funktion]** mit einem einzeiligen Grund (Schlüssel verbergen, Ratenlimit, transformieren). - Gib 2–3 Beispielanfragen/-antworten für die wichtigsten Aufrufe an. ## 7) Visuelles System (Tokens aus der Stimmung) - Farben (HEX): Primär, Sekundär, Hintergrund, Oberfläche, Text (primär/sekundär), Erfolg, Warnung, Fehler - Schriftgröße: H1/H2/H3, Körper, Bildunterschrift (Familien + px) - Form & Abstand: Radius + Abstandsschritte (z. B. 4/8/12/16/24) - Bewegung: Dauer (z. B. 120/200/320ms) + Easing - Vorschlag für ein Icon-Set ## 8) Kopie & Zustände - Überschriften, Schaltflächen, Hilfstexte für jeden Bildschirm - Leere Zustände (was Benutzer ohne Daten sehen) - Fehlermeldungen (einfach, freundlich, handlungsorientiert) ## 9) Optionale UX (nur wenn gewählt) - **Anmeldung**: Bildschirme + Kopie. Kennzeichne **[Geführte Einrichtung erforderlich]** und füge das Skript unten hinzu, damit Rork mich fragt, was es benötigt. - **Bezahlschranke (Abonnements/einmalig)**: Bezahlschranken-Kopie + was freigeschaltet wird. Kennzeichne **[Geführte Einrichtung erforderlich]** (+ Skript). - **Benachrichtigungen**: Auslöser, Beispiel-Push-Kopie, Deep Links. - **Analytik**: Ereignisnamen + wann sie ausgelöst werden (wenn EIN). ## 10) Barrierefreiheit & Inklusion - Schriftgrößenskalierung, Kontrastziel (≥4.5:1), Trefferziele (≥44×44), Bildschirmleser-Labels - Gibt es Einschränkungen für Inhalte oder Altersgrenzen? ## 11) Store-Bereitschaft - App-Name, Untertitel, 3–5 Schlüsselwort-Themen - Kurze Beschreibung (≤80 Zeichen) + vollständige Beschreibung - Screenshot-Plan (welche Bildschirme + Bildunterschriften) - Datenschutz „Nährwertkennzeichnung“ Hinweise (welche Daten, warum) - Support-URL & Kontakt-E-Mail - **Veröffentlichungsnotizen**: Verwende Rorks integrierte **App Store**-Veröffentlichung; **Google Play** erfordert Export zu Expo EAS. [Info] [ANNAHME], wo ich nichts angegeben habe. ## 12) Geführte Einrichtung – Skripte, die Rork mit mir ausführen soll (Nur Abschnitte einfügen, die für das, was ich gewählt habe, relevant sind.) ### 12A) Supabase (DB + Auth) – falls angefordert - **Zweck**: Verwende Supabase für Cloud-Daten und/oder Authentifizierung, ohne Geheimnisse offenzulegen. - **Rork muss mich FRAGEN** (eins nach dem anderen): 1) „Füge deine Supabase-Projekt-URL ein“ 2) „Füge deinen **anon/public** Schlüssel (client-sicher) ein.“ 3) „Füge deinen **Service-Rollen** Schlüssel (server-only) ein. Dieser wird nur in einer **Rork Backend-Funktion** gespeichert, um ihn zu schützen.“ 4) „Möchtest du E-Mail/Passwort oder Magic Link Authentifizierung?“ 5) „Liste die ‚Dinge‘ auf, die du in der Cloud haben möchtest (z. B. Workouts, Notizen). Bestätige für jedes die einfachen Felder, die du gespeichert haben möchtest.“ - **Rork muss TUN**: - Erstelle **Rork Backend-Funktionen** für alle Aufrufe, die Geheimnisse erfordern (Lese-/Schreibzugriffe mit Service-Rolle; Authentifizierungstoken-Austausch). - Konfiguriere den Client, um den **anon-Schlüssel** für öffentliche Lesezugriffe zu verwenden, wenn es sicher ist; verwende die Backend-Funktion für Schreib- oder geschützte Lesezugriffe. - Generiere minimale Tabellen basierend auf meinen „Dingen & Details“ (Namen, Felder, Typen) und einem Migrationsplan. Wenn unsicher, schlage einen Standard vor und markiere ihn [ANNAHME]. - Überprüfe die Einrichtung: führe einen Gesundheitscheck-Aufruf durch und bestätige Erfolg/Misserfolg mit einer freundlichen Nachricht. - **Hinweise**: Wenn soziale Anmeldungen (Apple/Google) angefordert werden, informiere mich, dass ich nach dem Export einen benutzerdefinierten Expo-Entwicklungsbuild benötige; halte die UX-Bildschirme an Ort und Stelle und markiere sie als **[Erfordert Export + EAS]**. ### 12B) E-Mail-Anmeldung oder Magic Link – falls angefordert - **FRAGE**: „Möchtest du E-Mail/Passwort oder Magic Link? Welchen Absendernamen/-E-Mail sollten die Benutzer sehen?“ - **TUN**: - Scaffold-Frontend-Bildschirme (Anmelden, Registrieren, Passwort vergessen / Magic Link). - Wenn Supabase verwendet wird: mit Supabase Auth über Backend-Funktion oder Client-SDK verbinden, wo es sicher ist; andernfalls als **[Erfordert Export + EAS]** kennzeichnen. - Bereitstellung von Text und Fehlermeldungen; bestätige eine Test-Rundreise mit mir. ### 12C) Abonnements / Käufe – falls angefordert - **FRAGE**: „Was wird mit Pro freigeschaltet? Preis? Kostenlose Testversion?“ - **TUN**: - Erstelle die Bezahlschranke und die UX zur Verwaltung des Abonnements. - Markiere die Integration als **[Erfordert Export + EAS]** und schlage RevenueCat oder ähnliches vor. Halte die UI mit einem Mock-Zustand und einem Button „Käufe wiederherstellen“ live. ### 12D) Push-Benachrichtigungen – falls angefordert - **FRAGE**: „Liste 2–3 Auslöser für Push-Benachrichtigungen; gibt es ruhige Stunden?“ - **TUN**: - Implementiere jetzt lokale In-App-Benachrichtigungen; markiere Remote-Push als **[Erfordert Export + EAS]** und schlage die FCM-Einrichtung nach dem Export vor. ## 13) Rork-Bauanleitungen (paste-bereit) === BEGIN RORK PROMPT === Baue eine plattformübergreifende React Native-App mit Expo, die der oben genannten „Rork-bereiten App-Spezifikation (Frontend + geführter Backend)“ folgt. Einschränkungen - Erstelle KEINEN benutzerdefinierten Server. Für jeden Aufruf, der Geheimnisse oder Schreibzugriff benötigt, erstelle **Rork Backend-Funktionen** und frage mich während der **Geführten Einrichtung** nach den erforderlichen Schlüsseln. Rork Backend-Funktionen werden von TRPC unterstützt. - Lokale Daten verwenden die Speicherung auf dem Gerät; entfernte Daten verwenden nur die ausdrücklich aufgeführten externen APIs oder Supabase (wenn gewählt). - Implementiere Bildschirme, Navigation, Kernabläufe, visuelle Tokens und Kopie genau wie angegeben. - Implementiere freundliche leere/lade/Fehlerzustände. - Wenn Anmeldung/Bezahlschranke/Benachrichtigungen/Analytik NICHT gewählt werden, lasse sie weg. - Bereite eine **App-Vorschau** und einen **App Store-bereiten** Veröffentlichungsplan vor. Beachte, dass **Google Play** Export + Expo EAS erfordert. - Wenn etwas unklar ist, wähle einen sinnvollen Standard und markiere ihn in Kommentaren als [ANNAHME]. === END RORK PROMPT === ## 14) Ideen für die nächste Iteration - 3 schnelle Gewinne für Klarheit/Geschwindigkeit - 3 Ideen zur Steigerung der Aktivierung/Bindung