Vibe-Coding für Laien

Eines der zentralen Versprechen, mit dem KI-Produkte nunmehr seit Jahren beworben werden, ist die «Demokratisierung» von Dingen. Wissen, Grafikdesign, Videoerstellung und allen voran: Coding. Software-Entwicklung soll also komplett in natürlicher Sprache möglich sein, auch Vibe-Coding genannt.

Nvidia-CEO Jensen Huang liess sich schon 2024 zur Aussage hinreissen, dass Kinder heute gar nicht mehr lernen sollten zu programmieren. Jüngst doppelte er nochmal nach und träumte davon, dass bei Nvidia künftig kein Engineers noch wird programmieren müssen.


Gewisse Zweifel an Huangs Optimismus sind für den Moment aber wohl noch berechtigt. Testen kann man die angebliche Demokratisierung des Software-Entwickelns aber schon selbst, was wir auf den nächsten Seiten wagen. Wichtig anzumerken: Wir haben den Versuch gewagt, ohne über ernstzunehmende Coding-Erfahrung zu verfügen.

Schweizer Vibe-Coding-Tool

Als Tool haben wir uns Caffeine.ai ausgesucht. Dies hat zwei Gründe: Erstens kommt das Tool aus der Schweiz, als Schweizer Publikation interessiert uns das naheliegenderweise. Und zweitens ist Caffeine erst gegen Ende 2025 live gegangen, ist also frisch auf dem Markt.

Hinter Caffeine.ai steht die Dfinity Foundation. Hierbei handelt es sich um eine Nonprofit-Organisation mit Hauptsitz in der Schweiz, die sich im Bereich Blockchain und Web3 bewegt und auch das sogenannte Internet Computer Protocol (ICP) entwickelt hat, das Caffeine zugrunde liegt. Mehr dazu findet sich in der Box auf der rechten Seite.

Voraussetzungen und Ziele

Für den Nutzer gestaltet sich Caffeine.ai wie die etablierten KI-Chatbots: Es gibt ein Chat-Fenster mit Eingabefeld und eine Seitenleiste mit allen gestarteten Chats respektive Projekten. Daneben können verschiedene weitere Fenster aufgeklappt werden, mit denen etwa der Code oder die Vorschau der entwickelten Web-App eingesehen werden können.

Als Testprojekt planen wir, eine Kiosk-Web-App für private Events zu bauen. Diese besteht aus drei zentralen Elementen: Dem Kiosk selbst, in dem Nutzer den Bezug von Snacks und Getränken dokumentieren können, einem Kiosk-Management, in dem Produkte hinzugefügt und entfernt werden können und einer einfachen Nutzerverwaltung.

Weiter soll das System den Umsatz pro Nutzer sowie den Gesamtumsatz in Echtzeit tracken und als CSV-Datei exportieren können, um den Event abrechnen zu können.

Versuch 1: Das totale Scheitern

Um uns mit Caffeine vertraut zu machen, bauen wir erst einmal eine sehr einfache Vereins-Website mit einer Milestone-Timeline und einer Bildergalerie.

Kurz zusammengefasst: Wir scheitern recht kläglich. Als wir etwa Bilder für unsere Milestone-Timeline hochladen wollen, baut uns die KI kurzerhand einen Bild-Upload-Manager in die Page. Nach einer Weile wird uns bewusst, dass wir hier keine Website bauen, sondern einen Website-Builder à la Wordpress. Wie man bei Caffeine korrekt Bilder hochlädt, wissen wir bis heute nicht.


Trotz wenig Erfolg nehmen wir für unser eigentliches Projekt ein paar Learnings mit: Erstens müssen wir sehr genaue Anweisungen geben, damit der Interpretationsspielraum in Prompts klein bleibt. Zweitens: Die KI stellt nach dem Bearbeiten oft Fragen wie «soll ich nun dieses oder jenes für dich machen?». Auf diese direkt zu antworten, etwa einfach «ja» zu schreiben, führt meist zu schlechten Ergebnissen. Drittens tendiert auch die Caffeine-AI dazu, zu halluzinieren. So wurde uns mehr als einmal im Test ein Menüpunkt oder eine Massnahme empfohlen, die es schlicht nicht gab. Und viertens dauert jede kleine Änderung etwa gleich lange, wie der erste Build (drei bis fünf Minuten) und braucht meist auch gleich viele Credits. Viel zu Prompten frisst also Zeit und Geld.

Versuch 2: Luft nach oben

Wir starten einen ersten Anlauf für unseren Kiosk. In einem kurzen Prompt erklären wir Caffeine das Vorhaben, nach etwa fünf Minuten steht ein erster Draft unseres Kiosks. Dieser ist durchaus beein­druckend. In Iterationen versuchen wir im Anschluss, weitere Features wie eine einfache Nutzer-Registrierung und ein rudimentäres Nutzerprofil mit dem Umsatztotal zu bauen.

Hierbei scheitern wir dann aber erneut recht schnell. Die KI versteht Befehle teilweise falsch und beim Versuch, einen Rollback auf eine vorherige Version zu machen, wird nicht alles zurückgespielt. Der erste Versuch endet damit einmal mehr, bevor wir ans Ziel gelangen.


Aber wir lernen weiter dazu: Noch genauer Prompten, im Prinzip nie auf die Fragen der KI eingehen. Und weniger, dafür genauere Prompts machen.

Die meisten unserer Learnings wären mit einem sauberen Einsteiger-Tutorial übrigens zu umschiffen gewesen. Ein solches findet sich aber nirgends, schade.

Versuch 3: So geht das!

Im dritten Versuch arbeiten wir konsequent mit unseren Learnings im Hinterkopf. Wir starten mit einem klar strukturierten initialen Riesen-Prompt (1400 Zeichen), ähnlich einer geordneten Powerpoint-Präsentation: Zusammenfassung des Ziels, darunter die drei Bereiche aufgeschlüsselt (Kiosk, Inventar- und User-Management) mit den jeweils drei bis vier wichtigsten Features.

Der erste Draft zeigt, dass wir auf dem richtigen Weg sind, das Ergebnis ist dieses Mal nicht nur beeindruckend, sondern schon fast nutzbar. Wir sind bereits weiter, als wir beim vorherigen Versuch jemals gekommen sind.


Unsere folgenden Iterationen strukturieren wir dieses Mal streng nach einem festen Schema: Wir sagen der KI erst, woran wir arbeiten wollen und beschreiben die Änderung dann mit möglichst wenig Interpretationsfreiraum. Als Beispiel: «Änderung am User-Management: Ermögliche die Erstellung lokaler Benutzerkonten. Ein Benutzer muss sich selbst registrieren und dann Artikel im Kiosk kaufen können.»

Nun läuft es rund. Zwar schraubt die KI ­weiterhin knapp fünf Minuten an jeder kleinen Änderung, die Ergebnisse überzeugen aber. So bauen und testen wir in ungefähr zwei Stunden ein Drop-­down-­Menü für den Kiosk, mit dem Nutzer ihr Profil auswählen können, bebildern die Produkte im Shop mit Emojis und bauen einen Zähler für gekaufte Produkte sowie ein Kostentotal für jeden User. Auch gibt’s nun einen Button, um aus Versehen angeklickte Produkte wieder zu entfernen. Dazu kommt eine kleine Admin-Übersicht zum Umsatz und ein CSV-Export für die Abrechnung.

Das alles klappt ohne nennenswerte Probleme oder Missverständnisse. Die wiederkehrenden Fragen der KI, was sie alles beitragen könnte, ignorieren wir dabei ganz einfach.

Ernüchterung beim Redesign

Mit den nun bestehenden Grundfunktionen machen wir uns noch an ein kleines Redesign der etwas sehr generischen Oberfläche unseres Kiosks. Wir schlagen also ein neues Farbschema und kleine Design-Änderungen vor. Die Umsetzung ist ernüchternd, abgesehen von leichten (und nicht einmal vollständigen) farblichen Änderungen geht nichts.

Und so gehen wir, entgegen unseren genannten Learning-Prinzipien, dann doch noch auf einen Vorschlag der KI ein, die uns vier Redesign-Optionen präsentiert. Eine davon ist etwa ein «Luxus-Theme – Kontrast zwischen Schwarz und Gold oder Creme und Bronze, mit eleganten Schaltflächen und Serifenschriften für einen hochwertigen Veranstaltungsstil.» Klingt gut, bitte umsetzen!


Das Ergebnis: Exakt die gleichen Buttons, exakt das gleiche Layout, nur eben in Dunkelgrau-Gelb und mit Serifen-Schrift. Neben dem Header «Event Kiosk» prangt nun ein Kronen-Icon à la Wingdings. Wie edel, Danke.

Deployment: Fehlanzeige

Der letzte Schritt in der bisher erfolgreichen Entwicklung unserer kleinen Web-App ist das Deployment. Zwar scheint das Deployment über den «Publish»-Button im KI-Chat zu funktionieren, wir schaffen es aber bis zum Schluss nicht, Zugang zur App zu erhalten. Da das an unserem Test-Account liegen könnte, erstellen wir einen frischen Account – eine sogenannte «Internet Identity» (siehe Box) – mit der Idee, diesen als Admin hinzuzufügen, um so Zugang zur App zu erhalten.


Auch das gelingt nicht. Aus einem unerfindlichen Grund gibt es zwei unterschiedliche Login-Portale für den Internet-Identity-Account. Bei einem davon ist die von der KI geforderte ID nicht zu finden, beim anderen funktioniert zum Zeitpunkt des Tests die Login-Maske in mehreren Browsern nicht.

Wir sind Vibe-Coder. Aber…

Zusammenfassend stellen wir fest: Vibe-­Coding ohne Vorbildung funktioniert grundsätzlich. Aber wir wären weiterhin keine Konkurrenz für (Junior-)Web-Devs. Für unseren Kiosk oder ein Online-Familien-Fotoalbum sollte es reichen, für den professionellen Einsatz sehen wir aber zu viele Hindernisse.

Die Zeit für kleine Korrekturen ist beispielsweise nicht vertretbar. Um die Preise in Franken statt Rappen anzuzeigen, arbeitete die KI wie immer mehrere Minuten. Ein Dev hätte an der entsprechenden Stelle rasch durch 100 geteilt, was maximal 30 Sekunden gefressen hätte.


Auch ist es laut der KI mittlerweile möglich, den Code zu exportieren. Dass Caffeine aber in einer eigenen Programmiersprache namens Motoko schreibt, erschwert manuelle Änderungen sogar mit Coding-Erfahrung.

Der Claim von Dfinity, mit Caffeine nette Privatprojekte zu bauen, ist aus unserer Sicht absolut haltbar. Die Behauptung, dass Unternehmen damit ihr neues CRM-Modul oder andere geschäftskritische Anwendungen bauen könnten, halten wir hingegen für äusserst gewagt. Alle diese Einschätzungen teilt auch ein erfahrener Web-Dev, dem wir das Tool zeigen und unsere Ergebnisse vorlegen.

Das Pricing gestaltet sich wie folgt und scheint angemessen: Caffeine.ai gibt’s in drei Ausführungen für 16 (Starter), 30 (Plus) und 100 Dollar (Pro) monatlich. Dazu kommt eine eingeschränkte kostenlose Basic-Version sowie Enterprise-­Abos auf Anfrage. Für kleine Projekte reicht das Basic- oder Starter-Abo, die grösseren Abos bieten derweil deutlich mehr Credits, Custom Domains fürs Deployment und weitere Funktionen wie etwa E-Mail-Versand.