Vom Code-Legastheniker zum „Web-Designer“: Meine ersten Tage mit Claude

Darum geht es in diesem Artikel
// KI-Zusammenfassung mit
Artikel anhören
1.0×
1.0

Manchmal muss man sich von alten Gewohnheiten trennen, um Platz für Neues zu schaffen. In meiner Welt war ChatGPT lange das Maß aller Dinge. Wir hatten eine gute Zeit, aber in letzter Zeit fühlt es sich nicht mehr so professionell an. Also habe ich den Schritt gewagt und bin, neben Gemini, fest im Lager von Claude gelandet. Nicht, weil ich ein Technik-Evangelist bin, sondern weil mich der konkrete Nutzen interessiert.

Ich bin Grafiker, Werber und schreibe für mein Leben gern. Ich bin kein Programmierer. Wenn ich HTML sehe, verstehe ich die Struktur. Bei CSS wird es schon dünner und JavaScript ist für mich eine Fremdsprache, die ich zwar im Vorbeigehen höre, aber beim besten Willen nicht sprechen kann. Bisher war ich bei Anpassungen an meiner Webseite immer auf fertige Plugins oder die Hilfe von Profis angewiesen. Das hat sich in den letzten Tagen radikal geändert. Hier ist mein Bericht über meine ersten Gehversuche mit Claude und warum dieser Wechsel für mich eine echte Zäsur darstellt.

Warum der Wechsel? Es geht um das Werkzeug, nicht um den Hype

Bevor wir zu den Projekten kommen, ein Wort zur Einordnung. Ich feiere technologische Entwicklungen nicht um ihrer selbst willen. Ein Tool ist für mich ein Werkzeug, das einen Zweck erfüllen muss. ChatGPT lieferte mir oft soliden Text, aber wenn es an komplexe, zusammenhängende Logik ging, fühlte es sich oft so an, als würde ich gegen eine Wand reden.

Claude hingegen hat eine Art zu „denken“, die mir als Anwender entgegenkommt. Es geht hier nicht um revolutionäre Versprechen, sondern um die schlichte Tatsache, dass die Ergebnisse für meine spezifischen Probleme besser passen. Fortschritt entsteht für mich durch das Verständnis, wie ich ein Problem lösen kann, und nicht durch den blinden Einsatz der neuesten Beta-Version.

Projekt 1: Wenn der Button animiert sein soll

Mein erstes Projekt war eigentlich eine Kleinigkeit. Ich wollte moderne, animierte Buttons für meine Webseite. Nichts Wildes, aber eben auch nicht dieser Standard-Look, den man auf jeder zweiten WordPress-Seite sieht. Ich wollte Interaktion, ein gewisses haptisches Feedback im digitalen Raum.

Ich bat Claude um Vorschläge. Die erste Antwort war kurz: „In Arbeit.“ Das ist eine dieser menschlichen Nuancen, die ich mag. Kein künstlicher Optimismus, kein „Ich erstelle dir jetzt den weltbesten Button“. Kurz darauf präsentierte mir Claude sechs verschiedene Entwürfe in einer Preview-Umgebung.

Die Qual der Wahl und die schnelle Korrektur

Einer der Entwürfe gefiel mir sofort: Ein minimalistisches Design mit einem eleganten Effekt beim Drüberfahren (Hover-State). Aber die Farben passten nicht zu meinem Branding und der Idle-Zustand war mir etwas zu unruhig.

Ich schrieb also: „Nimm Entwurf drei, ändere die Primärfarbe auf mein Cyan, mach den Rand etwas dünner und mach die Animation im Ruhezustand dezenter.“

Keine Minute später war der Code fertig. Und jetzt kam die eigentliche Hürde für mich: Wie binde ich das in WordPress mit Elementor ein? Theoretisch wusste ich es. Praktisch hatte ich aber wenig Ahnung, wo genau das CSS hingehört, damit der Button so funktioniert, wie er soll.

Die Anleitung für Nicht-Techniker

Claude erklärte mir den Prozess in Sekunden. Schritt für Schritt: „Geh dort hin, kopiere diesen Teil hier rein, und für das Design kopierst du den Code dort rein.“ Ich befolgte die Anweisungen, drückte auf Speichern und siehe da: Es funktionierte.

Der Vergleich zu meinen früheren Versuchen: Mit ChatGPT hatte ich das schon einmal probiert. Das Ergebnis war oft fehlerhafter Code oder Animationen, die nicht sauber liefen. Gemini lieferte zwar funktionierenden Code, aber das ästhetische Gespür fehlte völlig. Der Button sah aus wie aus dem Jahr 2005. Claude scheint hier ein besseres Verständnis für modernes Webdesign zu haben.

Die Buttons findest du auf der Startseite meines Blogs.

Projekt 2: Die Suche nach dem kleinen Helfer

Nach dem Erfolg mit den Buttons wurde ich mutig. Die Standardsuche auf meiner Webseite hat mich schon lange genervt. Ein einfaches Feld, ein Suchen-Button, fertig. Langweilig und wenig benutzerfreundlich. Ich wollte etwas Interaktives. Die Idee: Ein kleiner Roboter am rechten unteren Bildschirmrand. Er sollte funktionieren wie ein Chatbot, aber im Kern einfach eine intelligente Suche für meine Blogbeiträge und Seiten sein.

Das ist ein komplexeres Unterfangen. Da geht es um Layout, um JavaScript-Logik, um die Einbindung in die bestehende Struktur und um die Optik. Also, Claude: „Wie machen wir das?“

Iteration statt Instanz-Erfolg

Claude arbeitete etwa fünf Minuten. Ich konnte förmlich sehen, wie der Code Block für Block entstand. Als die Vorschau aufging, war ich beeindruckt, aber noch lange nicht zufrieden. Es war ein guter Rohbau, aber die Details fehlten.

Ich wollte:

  • Eine ordentliche Paginierung, falls zu viele Treffer kommen.
  • Ein spezielles Layout für die Suchergebnisse.
  • Meine spezifischen Markenschriften.
  • Eine Darstellung, die zu meinem Stil passt.

Ich gab diese Wünsche ein. Claude antwortete mit einem sachlichen: „Das ist eine gute Idee, lass uns das Layout anpassen.“ Hier wird nichts beschönigt oder als „bahnbrechend“ verkauft. Es ist ein Arbeitsprozess.

Der Weg in die Live-Umgebung

Wieder arbeitete Claude einige Minuten. Das Resultat war genau das, was ich mir vorgestellt hatte. Ein kleiner, dezenter Bot, der sich auf Klick öffnet und eine saubere Suchmaske in Form eines Chatfensters präsentiert.

Die Integration war diesmal kniffliger, weil der Bot auf jeder Unterseite erscheinen sollte. Claude gab mir den Hinweis, wo ich den Code in meinem Theme einbinden soll. Das klang kompliziert, war aber dank der präzisen Anleitung in fünf Minuten erledigt. In weniger als einer halben Stunde war ein Feature live, für das ich früher wahrscheinlich einen Freelancer gesucht und drei Tage gewartet hätte.

Projekt 3: Wenn die i-Punkte das Tanzen lernen

Ich wollte zum Abschluss noch eine kleine visuelle Finesse: Mein Logo im Header sollte dezent animiert werden. Kein Effekt-Gewitter, sondern nur ein rhythmisches Hüpfen der i-Punkte über dem Schriftzug „digitalhandwerk“. Mein erster Versuch mit Gemini war, gelinde gesagt, ein technischer Offenbarungseid: Die Farben waren plötzlich völlig falsch und die Animation sah eher nach einem Grafikfehler als nach Absicht aus. Nach 30 Minuten habe ich entnervt das Handtuch geworfen.

Dann der Umzug zu Claude: Ich habe das SVG hochgeladen, meinen Wunsch geäußert und genau drei Minuten später die fertige Datei erhalten. Es hat auf Anhieb perfekt funktioniert, ohne Farbdrehungen und ohne Logikfehler. Jetzt hüpfen die Punkte in meinem Header genau so, wie ich mir das vorgestellt habe. Für mich bestätigt das wieder einmal: Technologie ist ein Werkzeug, das funktionieren muss, damit wir uns auf die eigentliche Arbeit konzentrieren können. Relevanz entsteht hier nicht durch die bloße Spielerei, sondern durch die Effizienz, mit der ein konkreter Nutzen erzielt wird.

Was bedeutet das für Unternehmer?

Wenn wir über generative KI sprechen, verfallen wir oft in Extreme. Entweder wird sie als das Ende der Arbeit beschworen oder als Spielerei abgetan. Mein Test mit Claude zeigt eine dritte Perspektive: Die KI als Befähiger für Aufgaben, die man bisher delegieren musste.

Für kleine und mittlere Unternehmen oder Selbstständige bedeutet das eine enorme Geschwindigkeitssteigerung. Relevanz entsteht hier durch den konkreten Nutzen: Ich kann meine digitale Präsenz verbessern, ohne tiefes technisches Wissen zu besitzen, solange ich verstehe, wie ich das Werkzeug führen muss.

Die Risiken der Vereinfachung

Aber Vorsicht: Nur weil Claude mir den Code schreibt, heißt das nicht, dass ich jetzt ein Full-Stack-Entwickler bin. Ich bewege mich auf dünnem Eis, wenn etwas mal nicht funktioniert. Die Unsicherheit bleibt ein ständiger Begleiter. Wenn der Code meine Seite verlangsamt oder Sicherheitslücken reißt, bin ich verantwortlich.

Deshalb ist es wichtig, die KI nicht blind einzusetzen. Man muss verstehen, was man da tut, zumindest im Ansatz. Die Verantwortung für das Ergebnis liegt immer beim Menschen, nicht beim Tool.

Mein vorläufiges Urteil

Die ersten Tage mit Claude waren phantastisch. Nicht, weil das Tool „magisch“ ist, sondern weil die Interaktion effizient ist. Die Fähigkeit von Claude, visuelle Previews zu erstellen und komplexe Anweisungen in funktionalen Code zu übersetzen, übertrifft meine bisherigen Erfahrungen mit ChatGPT bei weitem.

ChatGPT wirkt im direkten Vergleich oft etwas müde und repetitiv. Gemini ist technisch stark, aber in der kreativen Umsetzung für mich oft zu hölzern. Claude trifft für mich derzeit den „Sweet Spot“ aus technischer Kompetenz und menschlicher Verständlichkeit.

Ich werde weiter testen. Es macht Riesenspaß, und das Erfolgserlebnis, wenn ein selbst „erstelltes“ Feature plötzlich live geht, ist unbezahlbar. Aber ich bleibe kritisch. Ein Tool ist nur so gut wie die Strategie dahinter. Wer nur spielt, verschwendet Zeit. Wer versteht und anwendet, schafft Wert.

Der kleine Such-Bot rechts unten auf meiner Seite ist erst der Anfang. Schau ihn dir mal an. Er beißt nicht, er sucht nur.

// story.share

LinkedIn
Threads
Pinterest
Facebook
WhatsApp
E-Mail

// about.me

Alex Januschewsky, Prompt Rocker, im Kaffeehaus
// let's talk

Lass uns reden.

Erstgespräch kostenlos. Immer.

Du weißt noch nicht genau, wo du anfangen sollst? Gut. Genau dafür ist das Erstgespräch da. Wir klären in 30 Minuten, ob und wie KI in deinem Betrieb wirklich Sinn macht.

Kein Pitch. Keine Agenda. Nur ein ehrliches Gespräch zwischen zwei Menschen, die wissen wollen, ob es passt.

Derzeit verfügbar für neue Projekte in Österreich & DACH
// channel.subscribe

KI-News. Direkt. Kein Algorithmus dazwischen.

Was gerade wirklich in der KI passiert, bekommst du nicht im Feed, sondern im KI-Kompass. Ich kuratiere, teste, filtere. Du bekommst nur das, was es wert ist, gelesen zu werden.

Kein Spam Jederzeit kündbar Kostenlos
Jetzt KI-Kompass folgen
Dir gefällt digitalhandwerk?

Ich stecke sehr viel Zeit, Geld und Herzblut in meine Webseite. Wenn dir mein Blog weiterhilft, freue ich mich riesig über eine kurze Bewertung auf Google. Es dauert nur eine Minute und hilft mir sehr, mehr Menschen zu erreichen!

Jetzt auf Google bewerten

Hinterlasse einen Kommentar

This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

The reCAPTCHA verification period has expired. Please reload the page.

digitalhandwerk durchsuchen
digitalhandwerk
// prompt rocker_search.exe