Nachdem wir beim ersten Versuch mit Claude Code einen Blog auf unserer Pipedrive-Website ergänzt hatten, wollten wir wissen: Was passiert, wenn wir Claude Code nicht einfach einen bestehenden Seitentyp kopieren lassen, sondern gleich mehrere komplett neue Seiten bauen lassen?
Diesmal gab es also kein fertiges Layout von unserer anderen Website, das wir übernehmen konnten. Stattdessen hatten wir eine externe Website-Vorlage von unseren Partnern als Orientierung. Die Aufgabe für Claude Code: daraus drei neue Seitentypen für unsere Website entwickeln, eigenes Wording verwenden, übersetzen und in die eigene Unternehmens-CI integrieren.
Diesmal gab es kein fertiges Layout
Beim Blog hatten wir eine ziemlich klare Referenz von unserer anderen Website. Da konnten wir sagen, dass es bereits etwas gibt und die Struktur übernommen werden soll und lediglich der Stil an die neue Seite angepasst werden soll. Wen das interessiert, kann gerne mal in unseren letzten Blogbeitrag reinlesen.
Diesmal war die Ausgangslage eine andere, und zwar hatten wir eine externe Website-Vorlage, deren Inhalte und grundsätzliche Seitenstruktur als Orientierung dienen sollte.
Aber das Design sollte natürlich nicht einfach kopiert werden. Es musste in unsere bestehende Website integriert werden, mit unserem Design, unseren Farben, unseren Komponenten und unserem Wording.
Damit hatte Claude Code deutlich mehr Gestaltungsfreiraum und das merkte man sofort.
Above the fold: eher … interessant
Das erste Ergebnis war grundsätzlich erstaunlich brauchbar.
Aber gerade als Grafikerin sehe ich bei solchen Dingen natürlich sofort auf den ersten Bildschirmbereich – und der war zunächst etwas komisch.
Die Above-the-fold-Darstellung war nicht wirklich so, wie sie sein sollte. Die Headline hat den gesamten Bereich eingenommen und war dennoch angeschnitten. Man hat also auf den ersten Blick nur die Hälfte der Headline gesehen und sonst nichts. Das war etwas wertbefreit.
Auch die Breite der Inhalte passte nicht optimal zu unserer bestehenden Website. Nichts davon war dramatisch oder unfixable, aber es waren genau die Dinge, bei denen man merkt: Claude Code kann eine Seite bauen, aber es kennt nicht automatisch Gestaltungsregeln oder die Logik hinter allem. Und es kennt auch nicht automatisch alle kleinen Designentscheidungen, die wir über die gesamte Website hinweg getroffen haben.
Also wurde nachjustiert, Breiten geändert, Abstände angepasst und so weiter.
Das ist dann weniger „AI baut eine Website", sondern mehr: Ich gebe Feedback, AI setzt es um, ich kontrolliere wieder. Und damit kann ich ziemlich gut leben.
Drei neue Seiten später …
Im Großen und Ganzen war die Umsetzung trotzdem erstaunlich einfach und wir haben drei neue Seiten integriert.
Die grundlegende Struktur stand relativ schnell. Die Inhalte waren eingebaut. Die Seiten passten grundsätzlich in unsere bestehende Website, und nach ein paar Runden Feinjustierung war das Ergebnis absolut brauchbar.
Für mich als Marketingperson ist das eigentlich der wichtigste Punkt: Ich muss nicht unbedingt selbst den Code schreiben können. Ich muss wissen, was die Seite erreichen soll und wie sie sich in unsere Website einfügen muss. Den Rest kann ich mit Claude Code ziemlich gut alleine iterieren.
Aber: das Kontrollieren. Wirklich kontrollieren.
Und hier kommt der Teil, den ich bei solchen Experimenten inzwischen fast wichtiger finde als die eigentliche Geschwindigkeit.
Man muss wirklich alles kontrollieren, was Claude Code macht. Nicht nur: „Sieht die Seite gut aus?" Sondern:
- Stimmen alle Links?
- Sind die richtigen Ansprechpartner angegeben?
- Funktionieren Formulare?
- Passen die Inhalte wirklich zu unserer Website?
- Wurden irgendwo Informationen aus der Vorlage übernommen, die dort gar nicht hingehören?
- Sind Kontaktdaten korrekt?
- Funktionieren Navigation und CTAs?
Denn genau da passieren Dinge, die auf den ersten Blick gar nicht unbedingt auffallen.
Zum Beispiel die Telefonnummer. Beim Kontaktbereich hat Claude Code einfach eine private Telefonnummer einer Person eingetragen, die dafür gar nicht zuständig war. Einfach, weil irgendwo eine Information vorhanden war, die für Claude Code offenbar plausibel genug aussah.
Und genau deshalb würde ich niemals sagen: „Claude Code hat die Seite gebaut, also können wir sie online stellen." Claude Code hat einen sehr großen Teil der Arbeit erledigt, aber jemand muss den Output fachlich, inhaltlich und visuell abnehmen.
Auch die Links waren nicht alle richtig
Ein weiteres Beispiel waren die Links. Ein Teil der Inhalte kam aus der externen Vorlage. Dort gab es beispielsweise Formulare und Verlinkungen, die für deren Website Sinn gemacht haben, für unsere Website natürlich nicht unbedingt sinnvoll. Einige dieser Links wurden trotzdem übernommen.
Claude Code sieht eben nur: Auf der Vorlage gibt es hier einen Link. Es weiß aber nicht automatisch, dass dieser Link zu einem komplett anderen System gehört und für Infralovers irrelevant ist.
Auch hier also: generieren lassen ja, blind übernehmen nein.
Und hier wird der Unterschied zwischen Grafikerin und Marketingperson wieder spannend
Als Grafikerin schaue ich auf Dinge wie Layout, Hierarchie, Seitenverhältnisse, Corporate Design und Elemente.
Aus Marketing-Sicht kommen ganz andere Fragen dazu:
- Ist der CTA sinnvoll?
- Ist der Ansprechpartner korrekt?
- Führt der Link wirklich dorthin, wo er soll?
- Würde ein potenzieller Kunde verstehen, was er hier tun soll?
Und genau diese Kombination ist bei AI-generierten Websites meiner Meinung nach ziemlich wichtig. Denn ein Tool kann Ihnen sehr schnell eine technisch funktionierende Seite produzieren, aber „funktioniert" ist nicht dasselbe wie „ist richtig".
Mein Fazit nach drei neuen Seiten
Nach Blog Nummer eins und jetzt drei komplett neuen Seiten würde ich sagen: Ja, Claude Code spart Zeit in der Entwicklung. Aber es kostet Zeit in der Kontrolle. Klar müsste auch ein manuelles Projekt kontrolliert werden, aber dort ist schon Hirnschmalz in die Entwicklung eingeflossen und man muss nicht jeden einzelnen Punkt mit 100 % Aufmerksamkeit überprüfen, inklusive Texte.
Claude Code ist nicht einfach: „Ich gebe einen Prompt ein und bekomme eine fertige Website." Es ist eher: „Ich gebe eine Richtung vor, bekomme einen ersten Stand, kontrolliere, gebe Feedback, lasse nachbessern und kontrolliere wieder."
Und je besser ich selbst weiß, was ich will, desto besser funktioniert das Ganze.
Das ist für mich wahrscheinlich auch der wichtigste Punkt aus den bisherigen Experimenten. Man muss nicht unbedingt Entwickler sein. Aber man muss seine eigenen Anforderungen kennen und vor allem formulieren können. Aus Grafik-Sicht kenne ich dieses Thema seit Tag 1: Kann sich ein Kunde nicht artikulieren, wird es mit der Umsetzung schwierig. Das ist kein neues Problem, nur fällt es jetzt in wenigen Sekunden auf und nicht nach zig Korrekturschleifen.
Man muss also bereit sein, den Output kritisch zu prüfen – genauso wie die eigenen Prompts. Eventuell hat man selbst einfach nicht exakt genug beschrieben, was man will und worauf auch im Detail noch geachtet werden muss.
Was kommt als Nächstes?
Bisher haben wir Claude Code entweder eine bestehende Struktur gegeben oder ihm relativ viel gestalterischen Spielraum gelassen. Jetzt wollen wir den nächsten Schritt ausprobieren: Was passiert, wenn wir ihm ein bestehendes Figma-Layout geben? Ein konkretes Design, das umgesetzt in unsere bestehende Website integriert werden soll.
Denn dann können wir ziemlich genau vergleichen: Wie gut kann Claude Code ein von uns gestaltetes Layout tatsächlich in funktionierenden Web-Code übersetzen – und vor allem: Wie viel muss ich danach noch selbst korrigieren?
Fortsetzung folgt.
