Verfeinerung und Bereitstellung von Ergebnissen

Claude Code kann anhand einer Designvorlage eine beeindruckende Website generieren, aber das erste Ergebnis entspricht möglicherweise nicht vollständig dem angestrebten Geschäftsziel. In diesem Beispiel hat Claude den visuellen Stil, einschließlich Schriftarten, Farben, interaktiver Karten, Kundenbewertungen, Formular und Footer, korrekt nachgebildet. Allerdings wurde eine Website für eine Zahnarztpraxis erstellt, anstatt für eine Webagentur, die Websites für Zahnärzte entwickelt.

Dies geschah, weil die ursprüngliche Anfrage nicht genügend Kontext bot. Anstatt von vorne zu beginnen, kann das bestehende Design durch einen iterativen Arbeitsablauf verfeinert werden. Claude wurde gebeten, das Layout beizubehalten, aber den Inhalt für Outbound, eine Webagentur für Zahnarztpraxen in Austin, neu zu verfassen. Die Hauptaufforderung zur Aktion wurde in einen kostenlosen Website-Audit geändert.

Verfeinerung der Website mit Spracheingabe

Lange Projektanweisungen müssen nicht immer manuell eingetippt werden. Mit der Mikrofonfunktion von Claude können Änderungen natürlich beschrieben werden, darunter:

• Was das Unternehmen macht
• Wer die Zielgruppe ist
• Welche Inhalte geändert werden müssen
• Welche Teile des bestehenden Designs erhalten bleiben sollen
• Was die Hauptaufforderung zur Aktion sein soll

Claude kann anschließend Rückfragen stellen, wenn wichtige Informationen fehlen, und die Website basierend auf den Antworten aktualisieren.

Verbindung von Claude mit Vercel

Sobald die Website fertig ist, muss sie auf einer Hosting-Plattform bereitgestellt werden. Anstatt Git, GitHub und die Bereitstellungseinstellungen manuell zu konfigurieren, kann Claude Code direkt über einen MCP-Connector eine Verbindung zu Vercel herstellen.

So verbinden Sie Vercel:

1. Klicken Sie auf das Plus-Symbol neben dem Claude-Chat-Eingabefeld.
2. Öffnen Sie Connectors und wählen Sie Manage connectors.
3. Klicken Sie auf Browse connectors.
4. Suchen Sie nach Vercel und klicken Sie auf Connect.
5. Autorisieren Sie Claude, auf das entsprechende Vercel-Team und die Projekte zuzugreifen.

Nach erfolgreicher Verbindung kann Claude das Projekt bereitstellen, die Bereitstellung überwachen, Fehler identifizieren und die URL der Live-Website zurückgeben.

Überprüfung von Bereitstellungsproblemen

Die erste Bereitstellung kann fehlschlagen, wenn Claude das Projekt noch in einer anderen Sitzung bearbeitet oder wenn die aktuellen Dateien nicht mit den beim Build verwendeten Dateien übereinstimmen. Claude kann die fehlgeschlagene Bereitstellung überprüfen, auf den Abschluss der Website-Änderungen warten, das Projekt neu erstellen und es erneut bereitstellen.

Vor der Veröffentlichung kann Claude auch unfertige Elemente identifizieren, wie zum Beispiel:

• Ein Formular, das nicht mit einem Backend verbunden ist
• Platzhalterinhalte
• Eine fehlende benutzerdefinierte Domain
• Eine unvollständige Datenschutzerklärung

Diese Punkte sollten vor dem Start einer Produktionswebsite überprüft werden. Eine temporäre Version kann jedoch weiterhin zu Test- oder Demonstrationszwecken bereitgestellt werden.

Von der Designvorlage zur Live-Website

Nach erfolgreicher Bereitstellung stellt Vercel eine öffentliche URL bereit, die auf Desktop- oder Mobilgeräten geöffnet werden kann. Die resultierende Website ist responsiv und kann später mit einer benutzerdefinierten Domain verbunden werden.

Dieser Arbeitsablauf zeigt, dass Claude Code weit mehr leisten kann als nur Code zu schreiben. Es kann Inhalte verfeinern, Projektdateien anpassen, externe Dienste anbinden, Build-Fehler beheben und eine funktionierende Website durch Anweisungen in natürlicher Sprache bereitstellen.

Der anfängliche Fehler verdeutlicht zudem eine wichtige Erkenntnis: Claude arbeitet am effektivsten, wenn von Anfang an klarer Projektkontext bereitgestellt wird. Die Definition von Unternehmen, Zielgruppe, Zielen und gewünschtem Ergebnis hilft, das Projekt auf Kurs zu halten und unnötige Überarbeitungen zu vermeiden.