Vibe Coding zwischen Spielerei und professionellem Werkzeug

Patrick Kocher

3. Aug.

7 Min. Lesezeit

Wie aus einer Idee ein funktionierendes Marketing-Kampagnen-Tool entstand

Vibe Coding verspricht einen einfachen Zugang zur Softwareentwicklung. Eine Idee wird in natürlicher Sprache beschrieben und eine künstliche Intelligenz erstellt daraus eine Anwendung. Was früher spezialisierte Entwickler, höhere Budgets und mehrere Monate Arbeit erforderte, scheint plötzlich auch für Personen ohne vertiefte Programmierkenntnisse möglich zu sein.

Doch wie professionell sind die Ergebnisse tatsächlich

Wir haben diese Frage nicht theoretisch, sondern praktisch untersucht. Innerhalb eines Monats haben wir mit smartcampaign ein eigenes Marketing-Kampagnen-Tool entwickelt und unter smartcampaign.ch als kostenlose Beta-Version veröffentlicht. Für die Umsetzung haben wir Lovable, GitHub, Claude und ein vorgängig erstelltes Miro Board miteinander kombiniert.

Nach rund 50 Arbeitsstunden, einer Investition von rund 500 Franken und einigen nervenaufreibenden Momenten steht heute eine funktionierende Anwendung zur Verfügung.

Unsere wichtigste Erkenntnis lautet jedoch nicht, dass heute jeder problemlos professionelle Software entwickeln kann.

Unsere Erfahrung ist differenzierter.

Mit Vibe Coding erreicht man erstaunlich schnell rund 60 Prozent eines funktionierenden Produkts. Die verbleibenden 40 Prozent entscheiden jedoch darüber, ob aus einer interessanten Spielerei ein verlässliches Werkzeug wird.

Zuerst kam das Miro Board

Bevor wir mit der eigentlichen Entwicklung begonnen haben, haben wir die geplanten Module und Lösungen auf einem Miro Board aufgezeichnet.

Dieser Schritt war für uns zentral. Denn auch wenn KI-Werkzeuge schnell Code erzeugen können, brauchen sie eine klare Grundlage. Ohne eine vorgängige Struktur besteht die Gefahr, dass einzelne Funktionen spontan ergänzt werden, ohne dass daraus eine logisch aufgebaute Gesamtlösung entsteht.

Auf dem Miro Board haben wir deshalb festgehalten, welche Bestandteile smartampaign enthalten soll, wie die verschiedenen Module miteinander verbunden sind und welche Aufgaben die jeweiligen Bereiche übernehmen.

Dabei ging es noch nicht um technische Details. Im Vordergrund standen die fachliche Logik und die Nutzerführung.

Welche Schritte gehören zu einer Marketingkampagne
Welche Informationen müssen Nutzer erfassen
Welche Ergebnisse soll das Tool ausgeben
Welche Einstellungen müssen zentral verwaltet werden können
Welche Funktionen benötigen normale Nutzer und welche Funktionen sind ausschliesslich für die Administration vorgesehen

Diese Vorbereitung hat uns geholfen, das Projekt nicht nur als Sammlung einzelner Funktionen zu betrachten. Wir konnten bereits vor der Entwicklung erkennen, welche Abhängigkeiten zwischen den Modulen bestehen und in welcher Reihenfolge die Umsetzung sinnvoll ist.

Vibe Coding beginnt aus unserer Sicht deshalb nicht mit dem ersten Prompt. Es beginnt mit einer möglichst klaren Vorstellung davon, welches Problem gelöst werden soll und wie die Lösung aufgebaut ist.

Der Start erfolgte im Backend

Bei der eigentlichen Umsetzung haben wir nicht mit der sichtbaren Nutzeroberfläche begonnen. Unser erster Entwicklungsschritt war das Backend und damit der Super User Zugang.

Über diesen Zugang wollten wir smartcampaign warten, Einstellungen verändern und zentrale Inhalte steuern können. Dazu gehören beispielsweise administrative Funktionen, Konfigurationen und Einstellungen, die nicht für alle Nutzer zugänglich sein sollen.

Diese Reihenfolge war bewusst gewählt.

Eine attraktive Benutzeroberfläche ist schnell erstellt. Für ein langfristig nutzbares Werkzeug braucht es jedoch eine Grundlage, über die das System verwaltet werden kann.

Die ersten 60 Prozent entstehen erstaunlich schnell

Der Einstieg mit Lovable war beeindruckend. Bereits nach wenigen Anweisungen entstand eine erste Version der Anwendung. Seiten, Eingabefelder, Navigationselemente und grundlegende Funktionen waren schnell sichtbar.

Dieser Moment vermittelt ein starkes Gefühl von Fortschritt. Innerhalb kurzer Zeit steht etwas auf dem Bildschirm, das bereits wie ein digitales Produkt aussieht.

Genau darin liegt die grosse Stärke von Vibe Coding. Ideen werden unmittelbar erlebbar.

Wir konnten verschiedene Abläufe ausprobieren, Formulierungen verändern und die Struktur der Anwendung laufend anpassen. Statt abstrakt über Funktionen zu sprechen, konnten wir direkt an einer sichtbaren Lösung arbeiten.

Für die frühe Produktentwicklung ist das wertvoll. Ein funktionierender Prototyp hilft dabei, Annahmen zu überprüfen und Anforderungen besser zu verstehen. Oft zeigt sich erst während der Nutzung, welche Funktionen tatsächlich notwendig sind und welche ursprünglich geplanten Elemente keinen Mehrwert schaffen.

Unsere Erfahrung zeigt klar, dass sich eine erste nutzbare Version mit Vibe Coding sehr schnell entwickeln lässt. Doch mit wachsendem Funktionsumfang verändert sich die Aufgabe.

Wenn Änderungen andere Funktionen beschädigen

Eine der grössten Herausforderungen zeigte sich bei der Weiterentwicklung bereits bestehender Funktionen. Wir wollten beispielsweise einen bestimmten Bereich der Anwendung anpassen. Die gewünschte Änderung wurde zwar umgesetzt. Gleichzeitig veränderte Lovable jedoch teilweise andere Elemente, die bereits funktionierten. Gestaltung, Logik oder bestehende Funktionen wurden unbeabsichtigt überschrieben oder verändert. Eine kleine Anpassung konnte dadurch neue Fehler auslösen.

Dies führte zu einer frustrierenden Situation. Statt ausschliesslich an neuen Funktionen zu arbeiten, mussten wir bereits gelöste Probleme erneut korrigieren. Gleichzeitig wurden durch die zusätzlichen Arbeitsschritte weitere Tokens und damit weiteres Guthaben verbraucht.

Wir mussten deshalb lernen, unsere Anweisungen wesentlich präziser zu formulieren.

Eine der wirksamsten Formulierungen war sinngemäss sehr einfach.

Ändere ausschliesslich den beschriebenen Bereich und nimm keine weiteren Änderungen vor.

Diese klare Begrenzung verbesserte die Ergebnisse spürbar. Sie verhinderte nicht jedes Problem, reduzierte aber das Risiko, dass funktionierende Bestandteile unnötig verändert wurden. Damit wurde uns ein grundlegendes Prinzip der Arbeit mit KI-Systemen bewusst.

Ein gutes Ergebnis hängt nicht nur von der Leistungsfähigkeit des Werkzeugs ab. Es hängt auch davon ab, wie klar der Mensch Ziel, Rahmenbedingungen und Grenzen formuliert.

Vibe Coding braucht Führung

Die Bezeichnung Vibe Coding kann den Eindruck vermitteln, dass eine grobe Idee und etwas Intuition ausreichen. Für erste Entwürfe mag dies teilweise stimmen. Bei einer umfangreicheren Anwendung braucht es jedoch Struktur und Führung. Wir mussten festlegen, welche Aufgabe smartampaign lösen soll. Wir mussten entscheiden, welche Nutzer angesprochen werden, wie der Ablauf aufgebaut ist und welche Funktionen für die Beta Version notwendig sind.

Diese Entscheidungen konnte uns die KI nicht abnehmen. Sie konnte Vorschläge machen, Varianten erstellen und Code generieren. Die Verantwortung für das Produkt blieb aber bei uns. Wir mussten beurteilen, ob ein Ergebnis fachlich sinnvoll, verständlich und für die Nutzer relevant war. Gerade für Marketingfachleute liegt darin eine wichtige Erkenntnis.

Vibe Coding ersetzt nicht das Produktmanagement, im Gegenteil. Wer keine klaren Anforderungen formuliert, erhält möglicherweise schnell eine Anwendung, aber nicht zwingend eine sinnvolle Lösung. Die entscheidenden Fragen bleiben menschlich.

Welches Problem lösen wir
Für wen lösen wir es
Wie soll der Nutzer durch die Anwendung geführt werden
Welche Informationen sind notwendig
Welche Einstellungen müssen zentral verwaltet werden
Was gehört in die erste Version und was kann später ergänzt werden

Ohne diese Klarheit kann eine Anwendung technisch eindrucksvoll wirken und trotzdem am tatsächlichen Bedarf vorbeigehen.

GitHub als zusätzliche Sicherheit

Ein entscheidender Schritt war für uns die Verbindung von Lovable mit GitHub.

Damit konnten wir den entwickelten Code zusätzlich sichern und ausserhalb von Lovable prüfen. Für unser Projekt bedeutete dies vor allem mehr Kontrolle. Wir waren nicht mehr ausschliesslich darauf angewiesen, dass innerhalb von Lovable jede Änderung korrekt ausgeführt wurde. Der aktuelle Stand des Codes war zusätzlich in GitHub verfügbar.

Diese Trennung ist aus unserer Sicht wichtig, sobald aus einem Experiment ein ernsthaftes Produkt werden soll.

Eine Anwendung sollte nicht vollständig von einem einzelnen Werkzeug und dessen Benutzeroberfläche abhängig sein. Die Möglichkeit, den Code zu sichern und unabhängig prüfen zu lassen, schafft zusätzliche Sicherheit und eröffnet spätere Entwicklungsmöglichkeiten.

GitHub wurde für uns damit nicht nur zu einem Speicherort, sondern zu einem wichtigen Bestandteil des gesamten Entwicklungsprozesses.

Claude als Prüfinstanz

Im nächsten Schritt kombinierten wir GitHub mit Claude. Wir kopierten den entwickelten Code aus GitHub und liessen ihn durch Claude überprüfen. Dabei ging es nicht darum, sämtliche Verantwortung an ein zweites KI System zu übertragen. Claude diente uns als zusätzliche Prüfinstanz.

Wir liessen uns erklären, wie bestimmte Teile des Codes funktionieren, wo mögliche Fehler liegen und wie einzelne Anforderungen präziser umgesetzt werden könnten.

Anschliessend nutzten wir einen speziell eingerichteten Lovable Vibe Coding Agenten, um aus diesen Erkenntnissen klare Anweisungen für Lovable zu erstellen. Damit entstand ein mehrstufiger Prozess. Lovable entwickelte die Anwendung. GitHub sicherte den Code.

Claude analysierte ausgewählte Bestandteile. Der spezialisierte Agent formulierte daraus möglichst präzise Änderungsanweisungen für Lovable. Dieses Vorgehen war aufwendiger als das einfache Eingeben spontaner Wünsche. Es war aber deutlich kontrollierter.

Unsere praktische Erfahrung zeigt, dass mehr KI nicht automatisch weniger Verantwortung bedeutet. Häufig braucht es sogar einen klareren Prozess, damit mehrere Werkzeuge sinnvoll zusammenspielen.

Wo die letzten 40 Prozent liegen

Die ersten 60 Prozent einer Anwendung bestehen häufig aus sichtbaren Elementen und grundlegenden Funktionen. Die letzten 40 Prozent sind weniger spektakulär, aber für die Qualität entscheidend. Dazu gehören eine nachvollziehbare Nutzerführung, konsistente Eingaben, verständliche Fehlermeldungen, saubere Datenverarbeitung, stabile Funktionen und ein verlässliches Verhalten bei unterschiedlichen Nutzungssituationen.

Auch Zugriffsrechte, Sicherheit, Sicherungen, Wartung und administrative Einstellungen müssen berücksichtigt werden. Gerade unser früher Fokus auf den Super User Zugang hat gezeigt, wie wichtig diese Themen sind. Ein Werkzeug muss nicht nur von den Nutzern bedient werden können. Es muss auch gepflegt, angepasst und weiterentwickelt werden können.

Ein Prototyp muss vor allem zeigen, dass eine Idee grundsätzlich funktioniert.

Ein professionelles Werkzeug muss dagegen auch dann funktionieren, wenn Nutzer anders handeln als erwartet.

Genau hier steigt der Aufwand. Jede neue Funktion kann Abhängigkeiten zu bestehenden Funktionen erzeugen. Eine Veränderung an einer Stelle kann Auswirkungen auf andere Bereiche haben. Fehler treten teilweise erst nach mehreren Arbeitsschritten oder bei bestimmten Eingabekombinationen auf. Vibe Coding beseitigt diese Komplexität nicht. Es macht den Einstieg leichter und beschleunigt viele Aufgaben. Die grundlegenden Herausforderungen der Softwareentwicklung bleiben jedoch bestehen.

Was die Entwicklung tatsächlich gekostet hat

Für die Entwicklung der ersten öffentlich zugänglichen Beta Version von smartampaign haben wir ungefähr 50 Stunden investiert. Die direkten Kosten für die verwendeten Werkzeuge und Tokens lagen bei rund 500 Franken. Diese Zahlen sind keine allgemeingültige Kalkulation. Sie zeigen lediglich unseren konkreten Aufwand für dieses Projekt. Verglichen mit einer vollständig extern entwickelten individuellen Anwendung ist dieser Einsatz überschaubar. Gleichzeitig war das Projekt deutlich anspruchsvoller, als es nach den ersten schnellen Ergebnissen erschien.

Ein Teil der Zeit floss nicht in neue Funktionen, sondern in Fehlersuche, Korrekturen und wiederholte Anpassungen. Einige Schritte waren nervenaufreibend. Andere führten zu überraschend guten Ergebnissen. Unter dem Strich war das Projekt für uns erfolgreich.

Wir konnten eine eigene Idee ohne klassisches Entwicklerteam in eine funktionierende Beta Version überführen und kostenlos veröffentlichen.

Wir haben dabei aber auch gelernt, dass die Kosten nicht nur aus Abonnements und Tokens bestehen. Der eigene Zeitaufwand, die vorgängige Konzeption auf dem Miro Board, die fachliche Logik und die laufende Qualitätskontrolle gehören ebenso zur Investition.

Fazit

Mit Vibe Coding kommt man schnell auf rund 60 Prozent eines überzeugenden Produkts. Diese ersten 60 Prozent können in erstaunlich kurzer Zeit entstehen und vermitteln das Gefühl, dass die Anwendung beinahe fertig ist. Die verbleibenden 40 Prozent sind jedoch anspruchsvoll.

Dort geht es nicht mehr nur um sichtbare Funktionen. Es geht um Stabilität, Qualität, Nutzerführung, Sicherheit, Administration und langfristige Wartbarkeit.

Genau diese Faktoren entscheiden darüber, ob eine Anwendung lediglich in einer Demonstration überzeugt oder im Alltag verlässlich eingesetzt werden kann.

Unsere Entwicklung von smartampaign zeigt, dass auch Marketingfachleute und Unternehmer ohne klassische Entwicklerlaufbahn eigene digitale Werkzeuge realisieren können.

Voraussetzung sind eine klare vorgängige Konzeption, Lernbereitschaft, Geduld und die Bereitschaft, Verantwortung für das Ergebnis zu übernehmen. Das Miro Board gab uns die fachliche Struktur. Der frühe Aufbau des Super User Zugangs schuf die Grundlage für Wartung und Einstellungen. Lovable ermöglichte uns eine schnelle Umsetzung.

GitHub gab uns mehr Kontrolle über den Code. Claude unterstützte uns bei der Prüfung und Verbesserung. Den fachlichen Rahmen, die Prioritäten und die endgültigen Entscheidungen mussten wir jedoch selbst setzen. Unser Fazit fällt deshalb bewusst nüchtern aus.

Vibe Coding ist mehr als eine Spielerei. Es kann die Grundlage für professionelle Werkzeuge schaffen. Professionell werden diese Werkzeuge aber nicht durch die KI allein, sondern durch einen strukturierten Entwicklungsprozess und einen Menschen, der die Richtung vorgibt.