Wie ich in 2 Stunden mit Claude Code und Veo eine 3D-Scroll-Website erstellt habe
Ein Reddit-Nutzer u/Tough-Survey-2155 hat einen Workflow geteilt, um in etwa 2 Stunden eine 3D-Scroll-Website von Grund auf zu erstellen. Die Methode verwendet Claude Code für die Hauptarbeit, mit einer benutzerdefinierten Video-zu-Website-Fähigkeit (Credit an Nate Herk) und Veo für die Videogenerierung.
Workflow
- Erstelle eine Video-zu-Website-Fähigkeit – diese dient als Grundlage, um Bewegung in scrollgesteuerte Interaktionen zu übersetzen.
- Extrahiere das erste und letzte Bild aus dem Quellvideo und verwende dann Veo, um daraus ein neues Video zu erstellen. Der Videoprompt wurde mit ChatGPT generiert.
- Anweisen von Claude Code, die Website mit dem Video-Asset zu erstellen. Der Autor berichtet, dass der Rest nach dem Einfügen des Videos ein unkompliziertes Prompting war.
- Design-Anpassungen – einige manuelle Anpassungen waren nach der Generierung notwendig.
Ergebnisse & Links
- Live-Website: royal-pop-website.vercel.app
- Vollständiger Quellcode: github.com/hamzafarooq/claude-code-starter
Das Repository enthält Claude-Code-Starter-Vorlagen, die für ähnliche Projekte wiederverwendet werden können. Der Autor merkt an, dass der gesamte Prozess nur 2 Stunden dauerte, was dies zu einer praktischen Referenz für Entwickler macht, die schnell scrollgesteuerte 3D-Seiten mit KI-Unterstützung prototypisieren möchten.
📖 Lies die vollständige Quelle: r/ClaudeAI
👀 Siehe auch
NerfGuard: Ein Klassifikator, der Codierungsanfragen an günstigere Modelle weiterleitet und die Kosten um das Dreifache senkt
NerfGuard verwendet einen schnellen Klassifizierer, um Anfragen von Codierungsagenten an das günstigste Modell und die erforderliche Reasoning-Tiefe weiterzuleiten, was eine dreifache Nutzung bei gleichen Kosten ermöglicht. Inklusive Token-Optimierungen.
TeenyApp lässt Claude Full-Stack-Websites aus einem einzigen Chat-Link erstellen und bereitstellen
TeenyApp bietet eine Live-Subdomain und ein Agent-Token, das Claude per HTTP nutzen kann, um Code zu erstellen, Migrationen durchzuführen, Authentifizierung einzurichten und direkt auf eine echte URL zu deployen – ohne den Chat zu verlassen.
Memtrace: Beständiger, zeitbewusster Codebase-Speicher für Claude Code-Agenten
Memtrace liefert stets aktuelle Snapshots und bi-temporales Replay für Claude Code Agents. Es nutzt Tree-sitter AST-Parsing und hybrides Retrieval (BM25 + Jina-code-Embeddings) ohne LLM-Inferenzkosten während der Indexierung.
ClawPort: Open-Source-Orchestrierung für KI-Agenten-Workflows mit Self-Healing-Cron
ClawPort ist eine Open-Source-Orchestrierungsschicht für KI-Agenten-Workflows, die Cron-Pipelines automatisch konfiguriert, bei Fehlern selbstheilend arbeitet und es ermöglicht, Agenten direkt zu testen, bevor sie nach Zeitplan ausgeführt werden.