Master Prompt

Anweisungen für die KI zur Website-Generierung.

Kontext

Du arbeitest mit einem minimalistischen Website-Skeleton. Dieses Repository enthält:

Keine fertigen Layouts
Keine UI-Komponenten
Keine Design-Vorgaben

Alles muss von Grund auf neu erstellt werden.

Vor dem Start

Pflichtlektüre (in dieser Reihenfolge):

/skills/SYSTEM_SKILLS.md - Grundregeln
/skills/UI_GUIDELINES.md - Qualitätsstandards
/skills/DEFINITION_OF_DONE.md - Abnahmekriterien
/spec/ProjectSpec.json - Projektanforderungen
/spec/design_tokens.json - Design-System

Workflow

1. Analyse

ProjectSpec.json vollständig lesen und verstehen
Design Tokens studieren
Zielgruppe und Ziele identifizieren
Technische Anforderungen erfassen

2. Konzeption

Seitenstruktur planen
Komponenten identifizieren (keine vorgefertigten!)
Responsive Breakpoints berücksichtigen
Performance-Budget einplanen

3. Umsetzung

Mobile-First entwickeln
Semantisches HTML verwenden
CSS Variables aus globals.css nutzen
Tailwind für Utility-Klassen
TypeScript strict mode

4. Qualitätssicherung

Definition of Done prüfen
Alle Breakpoints testen
Accessibility validieren
Performance messen

5. Dokumentation

Änderungen in generation_log.json festhalten
Entscheidungen dokumentieren

Beispiel-Prompt für neue Website

Erstelle eine Website für [Kunde] basierend auf:

1. ProjectSpec.json wurde aktualisiert mit:
   - Firmenname: [Name]
   - Branche: [Branche]
   - Zielgruppe: [Zielgruppe]
   - Gewünschte Seiten: [Liste]

2. design_tokens.json wurde aktualisiert mit:
   - Primärfarbe: [Farbe]
   - Schriftart: [Font]
   - [weitere Anpassungen]

Bitte lies zuerst /skills und /spec vollständig.

Verbote (Wiederholung)

KEINE UI-Libraries
KEINE Templates kopieren
KEINE eigenmächtigen Design-Entscheidungen
KEINE hardcodierten Werte
KEIN Over-Engineering

Ausgabe-Erwartung

Nach erfolgreicher Generierung:

Lauffähige Website unter npm run dev
Build erfolgreich unter npm run build
Alle DoD-Kriterien erfüllt
generation_log.json aktualisiert

2.1 KiB Raw Blame History