Vorlagen

Wie ein neues Projekt startet: Bau-Typ, Starter, Anhänge und der Plan-Schritt.

Der Startbildschirm

Ein neues Projekt beginnt mit einer Frage — *Was willst du bauen?* — und ein paar Schaltern rund ums Prompt-Feld:

• Website oder Web App — der Bau-Typ. Web App braucht den Web App Builder-Plan; der Schalter sagt das und bietet das Upgrade an.
• Starter — ein Klick befüllt den Prompt für eine gängige Form. Für eine Website: Landing Page, Portfolio, Business Website, Blog. Für eine Web App: CRM-System, SaaS-Dashboard, Marktplatz, KI-Chatbot. Zwei davon starten nicht mit Text, sondern mit dem, was du mitbringst: Spreadsheet to App und Video to App.
• Migrate — ein Projekt von einem anderen Builder herüberholen, statt neu anzufangen.
• Anhänge — Bilder, Videos, Dokumente oder Code direkt auf die Karte ziehen. Ein Screenshot, eine Tabelle mit echten Daten oder eine Aufnahme des Tools, das du ablöst, sagt mehr als ein Absatz.
• Premium design — hängt einen kuratierten Design- und Motion-Brief an, für ein gefälligeres erstes Ergebnis.
• Projekttitel — optional; lässt du ihn leer, wird einer aus deinem Prompt abgeleitet.

Dann Plan: der Agent schlägt vor, was er bauen wird, bevor er etwas schreibt. Korrigier es dort, solange es noch billig ist.

Selbst beschreiben

Ein Starter ist nur die erste Zeile. Was du an Detail dazugibst, entscheidet über das Ergebnis — siehe Effektive Prompts und Best Practices.

Design-Inspiration

Referenziere bekannte Seiten oder Stile in deinem Prompt:

• „Preisseite im Stripe-Stil"
• „Dashboard im Notion-Stil"
• „Produkt-Showcase im Apple-Stil"

Die KI versteht diese Referenzen und wendet ähnliche Design-Muster an.

Was die KI generiert

Für jedes Projekt erstellt Airbuild:

• React-Komponenten — modulare, wiederverwendbare UI-Komponenten
• Tailwind-Styling — responsives, modernes CSS
• Dateistruktur — organisierter Projektaufbau
• Routing — Navigation über mehrere Seiten (falls nötig)
• Responsives Design — funktioniert auf Desktop, Tablet und Mobile

Bei einem Web-App-Projekt kommt die Backend-Seite dazu: FastAPI-Endpunkte, ein PostgreSQL-Schema mit Fremdschlüsseln und Constraints, Migrationen und Authentifizierung — dazu Testsuites neben dem Code. Siehe Web App.

Nach der Generierung

Sobald das erste Projekt steht, iterierst du per Chat:

• jeden Aspekt des Designs ändern
• neue Bereiche oder Features hinzufügen
• eigene Marken-Assets hochladen
• Integrationen verbinden (Datenbank, GitHub usw.)