Eine App erstellen können Sie auch ohne eine Zeile Code: Sie beschreiben einer KI, was die App tun soll, prüfen das Ergebnis in einer Live-Vorschau und verbessern es mit kurzen Nachrichten, bis alles stimmt. Danach stellen Sie die App online und teilen den Link. Programmierkenntnisse brauchen Sie nicht, wohl aber eine genaue Vorstellung von Ihren Abläufen. Diese Anleitung zeigt den Weg an einem konkreten Beispiel, einem Terminplaner für einen Hundesalon, gebaut mit VibeDream.
Web-App oder native App?
Eine Web-App ist eine Anwendung, die im Browser läuft: Sie öffnen sie über eine Adresse, melden sich bei Bedarf an und arbeiten damit wie mit einer installierten App, nur ohne Download. Bekannte Beispiele sind Webmailer oder Buchungsportale. Technisch besteht sie aus einem Frontend, das Sie sehen, und einem Backend auf dem Server, das Daten speichert. Wer eine Web-App erstellen will, musste dafür früher beides programmieren. Mit KI beschreiben Sie stattdessen, was passieren soll, und die KI schreibt beide Teile.
Der Unterschied zur nativen App: Diese laden Nutzer aus dem App Store oder von Google Play. VibeDream erstellt Web-Apps und Browserspiele, keine nativen Apps für die Stores.
- Web-App: sofort per Link teilbar, keine Prüfung durch den Store, Änderungen gehen mit Update it sofort an alle.
- Native App: Zugriff auf mehr Gerätefunktionen und ein Symbol aus dem Store, aber Entwicklerkonten, Prüfprozesse und meist deutlich mehr Aufwand.
Für Buchungen, Formulare, interne Tools oder Kundenportale reicht eine Web-App fast immer, und Ihre Kunden müssen nichts installieren.
Was Sie brauchen, bevor Sie starten
Beantworten Sie fünf Fragen in einer kurzen Notiz, bevor Sie den Builder öffnen. Für den Hundesalon sieht das so aus:
- Wer nutzt die App? Hundehalterinnen und Hundehalter am Handy, dazu das Team im Salon.
- Welche eine Aufgabe erledigt sie? Termine buchen, ohne dass jemand anrufen muss.
- Welche Bildschirme gibt es? Leistungen, Termin wählen, Bestätigung und eine geschützte Übersicht für das Team.
- Welche Daten werden gespeichert? Name, Telefonnummer, Name und Rasse des Hundes, Leistung, Datum und Uhrzeit.
- Welche Regeln gelten? Termine dauern 30 Minuten, keine Buchung am Wochenende, ein Slot kann nur einmal vergeben werden.
Schritt für Schritt eine App mit KI erstellen
Machen Sie aus der Notiz eine einzige Nachricht. Bei VibeDream klicken Sie auf New Project, wählen Direct Prompt und fügen den Text ein, oder Sie sprechen ihn über das Mikrofon ein. Die Oberfläche ist derzeit auf Englisch, Ihre Prompts dürfen aber deutsch sein.
Erstelle eine Web-App zur Terminbuchung für den Hundesalon „Pfotenglück“.
Bildschirme: Leistungen (Baden und Föhnen, Scheren, Krallen schneiden, je 30 Minuten), Termin wählen (Kalender mit freien Zeiten von Montag bis Freitag, 8 bis 18 Uhr), Bestätigung und eine passwortgeschützte Teamübersicht unter /team.
Gespeichert werden Name, Telefonnummer, Name und Rasse des Hundes, Leistung, Datum und Uhrzeit.
Ein Zeitfenster darf nur einmal gebucht werden.
Optik: ruhig, hell, viel Weißraum, große Buttons, zuerst fürs Handy.
Alle Texte auf Deutsch, Anrede mit „Sie“.Die Vorschau erscheint neben dem Chat und baut sich auf, während die KI arbeitet. Testen Sie danach mit Fällen, deren Ergebnis Sie kennen: Buchen Sie Dienstag 9:00 Uhr, und versuchen Sie dann, denselben Termin noch einmal zu buchen. Lässt die App das zu, haben Sie einen Fehler gefunden und damit Ihre erste Korrektur.
Schicken Sie Korrekturen einzeln und prüfen Sie jede, bevor die nächste kommt:
- „Ein Zeitfenster lässt sich doppelt buchen. Wenn Dienstag 9:00 schon vergeben ist, soll es grau und nicht anklickbar sein.“
- „Am Wochenende sollen gar keine Zeiten erscheinen.“
- „Auf dem Handy soll der Button Termin buchen unten fest am Bildschirmrand stehen.“
- „Zeige in der Bestätigung Datum und Uhrzeit im deutschen Format, also 14.11.2026, 9:00 Uhr.“
Erscheint eine Fehlermeldung, kopieren Sie sie in den Chat und schreiben dazu, wann sie auftritt. Mehr Beispiele für gute Folgeprompts finden Sie in der englischen Anleitung How to build an app with AI. Wer lieber mit einem fertigen Grundgerüst beginnt, nimmt die Vorlage Blank Starter mit React-Frontend und FastAPI-Backend.
Daten speichern und Login einrichten
Jede VibeDream-App hat ein FastAPI-Backend, in dem die Daten liegen. Laden Sie die Seite nach einer Testbuchung neu und prüfen Sie, ob der Termin noch da ist. Ein Login für das Team bauen Sie per Nachricht ein, etwa: „Das Team meldet sich mit E-Mail und Passwort an, bevor es /team sieht.“ Die KI schreibt das direkt in Ihre App. Sie können auch unter dem Chat auf Add login oder Add database tippen. VibeDream richtet dann die Anmeldung mit E-Mail und Passwort und das Speichern der Daten ein, ohne Schlüssel zum Kopieren.
Geheime Schlüssel, zum Beispiel für einen E-Mail-Dienst, gehören nicht in den Chat. Tragen Sie sie im Settings-Tab ein. Die englische Seite API-Keys und Umgebungsvariablen erklärt, welche Werte auf dem Server bleiben. Da Ihre App Namen und Telefonnummern erfasst, gehören außerdem eine Datenschutzerklärung und ein Impressum dazu.
Online stellen mit eigener Domain
Klicken Sie auf Put it online, wählen Sie einen Namen, und die App ist nach etwa 1 bis 3 Minuten unter einer Adresse wie pfotenglueck.vibedreams.ai mit HTTPS erreichbar. Die Live-Version ändert sich erst, wenn Sie auf Update it klicken. So können Sie in der Vorschau weiter ausprobieren, ohne dass Ihre Kundschaft davon etwas merkt.
Für eine eigene Domain wie termine.pfotenglueck.de legen Sie bei Ihrem Domainanbieter einen TXT- und einen CNAME-Eintrag an. Das HTTPS-Zertifikat wird automatisch ausgestellt. Die englische Anleitung zur Veröffentlichung zeigt jeden Schritt. Den Code können Sie jederzeit als ZIP exportieren oder mit Ihrem GitHub-Repository synchronisieren.
Was kostet es, eine App mit KI zu erstellen?
Bei VibeDream zahlen Sie einen Monatstarif mit Credits. All Access Mini kostet 49 US-Dollar im Monat mit 60 Credits und bis zu 3 aktiven Projekten. All Access kostet 97 US-Dollar im Monat mit 150 Credits und bis zu 5 aktiven Projekten. Credits werden pro Nachricht verbraucht, größere Änderungen kosten mehr. Jede Veröffentlichung oder Aktualisierung kostet 5 Credits, das Hosting ist inklusive. Aktuelle Preise finden Sie auf der Preisseite.
Wenn Sie erst verstehen möchten, wie diese Arbeitsweise grundsätzlich funktioniert, lesen Sie zuerst Vibe Coding: Bedeutung, Beispiele und Einstieg.