Alle Beiträge

Vom Screenshot zur fertigen Website – warum Vibe-Coding auch dem Kunden nützt

4 Min. Lesezeit

Vibe-Coding Website

Vom Screenshot zur fertigen Website – warum Vibe-Coding auch dem Kunden nützt

Über „Vibe-Coding“ wird derzeit viel geredet, und meistens geht es dabei um den Entwickler: Wie schnell er heute Code zusammenstellt, wie viele Werkzeuge ihm Arbeit abnehmen, wie sich der Beruf verändert. Mir fehlt in dieser Diskussion fast immer eine Seite – die des Kunden. Denn wenn moderne, KI-gestützte Werkzeuge tatsächlich so viel Zeit sparen, dann stellt sich eine einfache Frage: Wer bekommt diese Zeit eigentlich gutgeschrieben?

Ein kleines Projekt der letzten Wochen ist für mich ein gutes Beispiel dafür, wie die Antwort aussehen kann.

Der Ausgangspunkt: ein einziger Screenshot

Am Anfang stand nicht mehr als ein PNG. Ein Screenshot einer Website, der grob zeigte, in welche Richtung es gehen sollte – keine Designdateien, keine Vorlagen, kein strukturiertes Material. Nur ein Bild.

Früher hätte genau hier die mühsame Arbeit begonnen: Layout nachbauen, Abstände schätzen, Farben pipettieren, Schriften suchen, jedes Element von Hand wieder zusammensetzen. Stunden, bevor überhaupt die erste Zeile sinnvoller Code entsteht.

Diesmal bin ich anders vorgegangen.

Schritt eins: aus dem Bild ein bearbeitbares Design

Aus dem Screenshot habe ich zunächst mit Hilfe KI-gestützter Werkzeuge ein sauberes Design in Canva erzeugt – und zwar nicht als flaches Bild, sondern in einzelnen, getrennten Ebenen. Das ist der entscheidende Unterschied: Statt einer starren Grafik hatte ich auf einmal ein editierbares Layout, bei dem sich Texte, Flächen und Bildbereiche unabhängig voneinander anfassen, verschieben und anpassen lassen.

Damit war aus einem reinen Abbild eine echte Arbeitsgrundlage geworden. Genau das, was man braucht, um anschließend strukturiert weiterzuarbeiten.

Schritt zwei: aus dem Design eine echte Website

Im zweiten Schritt habe ich dieses Design – wieder KI-unterstützt – in eine klassische, schlanke Website überführt. Bewusst klassisch: sauberes HTML und CSS, kein überladenes System, kein unnötiger technischer Ballast. Eine Seite, die schnell lädt, wartbar bleibt und genau das tut, was sie soll.

Das Ergebnis ist online unter salon.jacomeit.de zu sehen: die Website eines Friseursalons, übersichtlich, modern und auf das Wesentliche reduziert.

„Vibe-Coding“ heißt für mich dabei nicht, blind zu übernehmen, was die Werkzeuge ausspucken. Es heißt, im Dialog mit ihnen zu arbeiten, schnell Varianten zu erzeugen, Vorschläge zu bewerten und an den richtigen Stellen einzugreifen. Die Erfahrung entscheidet weiterhin – nur der Weg dorthin ist deutlich kürzer geworden.

Die Rechnung, die den Unterschied macht

Jetzt zum eigentlichen Punkt. Der gesamte Prozess – inklusive der Zeit, die die Werkzeuge selbst zum Verarbeiten brauchten, und inklusive der vom Kunden gewünschten Anpassungen – hat rund acht Stunden gedauert.

Aktiv beteiligt war ich davon aber nur etwa fünf Stunden. Die übrige Zeit lief im Hintergrund. Und genau diese fünf Stunden sind es, die ich dem Kunden berechnet hätte. Damit hätte das gesamte Projekt nicht einmal 500 Euro gekostet.

Eine vollständige, individuell gestaltete Website für einen lokalen Betrieb – für unter 500 Euro. Das war vor wenigen Jahren in dieser Form schlicht nicht realistisch.

Wem die Zeitersparnis gehört

Hier liegt für mich der eigentliche Kern. Die gewonnene Effizienz lässt sich auf zwei Arten verbuchen.

Variante eins: Man arbeitet wie gewohnt weiter, rechnet die „gefühlte“ alte Bearbeitungszeit ab und steckt die Differenz ein. Der Kunde merkt nichts, der Entwickler verdient mehr pro Stunde.

Variante zwei: Man gibt die Ersparnis weiter. Man berechnet die Zeit, die man tatsächlich aktiv investiert hat – und macht so professionelle Webentwicklung auf einmal für eine Kundengruppe bezahlbar, für die sie bisher zu teuer war.

Ich halte die zweite Variante nicht nur für die fairere, sondern langfristig auch für die klügere. Gerade kleine Betriebe – der Friseursalon um die Ecke, das Handwerksunternehmen, die lokale Praxis – haben oft keinen vierstelligen Betrag für ihren Webauftritt übrig. Wenn moderne Werkzeuge diese Schwelle senken, profitieren am Ende beide Seiten: Der Kunde bekommt einen professionellen Auftritt zu einem realistischen Preis, und der Entwickler erschließt sich einen Markt, der vorher praktisch verschlossen war.

Mein Fazit

Vibe-Coding ist kein Selbstzweck und kein Ersatz für solide Arbeit. Es ist ein Hebel. Was man mit diesem Hebel anstellt, ist eine Frage der Haltung. Wer seriös arbeitet und die Effizienzgewinne ehrlich weitergibt, macht Qualität für mehr Menschen zugänglich – und genau das ist für mich der spannendste Teil dieser Entwicklung.

Aus einem einzigen Screenshot wurde in fünf abrechenbaren Stunden eine fertige Website. Nicht, weil ich Abstriche gemacht hätte, sondern weil die Werkzeuge die mühsamen Teile übernommen haben. Diesen Vorteil an den Kunden weiterzugeben, ist für mich keine Großzügigkeit, sondern einfach gutes Geschäft.

Passend dazu

Teilen: LinkedIn X