Schluss mit Einheits Websites: Mit Claude und Paper eine eigene Homepage gestalten und live stellen

Worum geht es?

Wenn du eine KI direkt bittest, eine Website zu bauen, kommt oft eine Seite heraus, die aussieht wie tausend andere. Besser ist es, wie ein Architekt vorzugehen: erst zeichnen, dann bauen. Hier entwirft Claude zuerst auf einer digitalen Zeichenfläche mehrere Varianten deiner Startseite nach deinen Vorbildern. Erst wenn dir das Design gefällt, wird daraus eine echte Website programmiert.

Was bringt dir das?

• Deine Website sieht eigenständig aus und nicht nach Baukasten.

• Du siehst Entwürfe nebeneinander und entscheidest wie bei einer Agentur, nur schneller.

• Änderungen auf der Zeichenfläche dauern Sekunden statt Stunden im Code.

• Du sparst die Kosten einer Agentur und bekommst trotzdem eine individuelle Seite, etwa für einen Handwerksbetrieb oder eine Praxis.

Wann lohnt es sich und wann nicht?

• Lohnt sich, wenn deine Website veraltet ist oder wie von der Stange wirkt.

• Lohnt sich, wenn du Vorbilder hast, die dir gefallen, und einen Nachmittag investieren kannst.

• Eher nicht, wenn du einen Onlineshop mit vielen Funktionen brauchst. Dafür ist ein spezialisiertes System besser.

Was du brauchst

• Claude (je nach Tarif), Paper Desktop und Claude Code für den Livegang.

• Ganzseitige Screenshots von einer Handvoll Vorbildseiten.

• Etwa einen Nachmittag. Grundwissen zum Installieren von Programmen hilft, für das Online stellen ist etwas technisches Verständnis von Vorteil.

Begriffe kurz erklärt

• Design Leinwand: eine digitale Zeichenfläche, auf der Entwürfe nebeneinander liegen.

• MCP: eine Schnittstelle, über die Claude andere Programme wie Paper direkt bedienen kann.

• Moodboard: eine Sammlung von Vorbildern, die den gewünschten Stil zeigen.

• Hosting: der Dienst, auf dem deine Website liegt und über das Internet erreichbar ist.

Kurz zusammengefasst

Viele KI Websites sehen gleich aus. Der Grund: Die KI fängt sofort mit Code an. Unser Ansatz dreht das um, erst gestalten, dann programmieren.

• Das Werkzeug: Paper Desktop ist eine Design Leinwand, auf die Claude über eine MCP Verbindung zugreift. Claude sieht dort deine Vorbilder und zeichnet eigene Entwürfe.

• Das Rezept: Ein kleines Moodboard mit Seiten, die dir gefallen, gern auch aus ganz anderen Branchen. Zu jeder Seite ein Satz, was genau dich überzeugt.

• Die Arbeitsweise: Claude legt mehrere deutlich verschiedene Entwürfe nebeneinander. Du wählst aus, kombinierst und gibst Feedback direkt auf der Leinwand. Danach folgt die Handyansicht.

• Der Livegang: Erst wenn das Design steht, setzt Claude Code die Seite mit genau diesen Werten um und stellt sie online.

• In Deutschland Pflicht: Impressum und Datenschutzerklärung. Bei Hosting in den USA und bei Kontaktformularen den Datenschutz prüfen.

Warum relevant: Selbstständige und kleine Unternehmen bekommen eine individuelle Website ohne Agentur. Einsteiger lernen das Prinzip "erst gestalten, dann programmieren", Power User einen sauberen Design zu Code Workflow.