Mein KI-Workflow: Webprojekt in 5-10 Stunden launchen

Früher habe ich Wochen für ein neues Webprojekt gebraucht. Heute launche ich in 5-10 Stunden – dank eines durchdachten KI-Workflows.

Hier ist mein kompletter Prozess, den ich bei jedem neuen Projekt anwende.

Phase 1: Design (1-2 Stunden)

Option A: Unique Design mit Figma + KI

Wenn das Projekt ein einzigartiges Design braucht:

1. Figma mit KI-Plugins für erste Entwürfe
2. Layout-Varianten generieren lassen
3. Feinschliff manuell

Option B: shadcn/ui (schneller)

Für die meisten Projekte reicht ein solides Component-System:

npx shadcn@latest init
npx shadcn@latest add button card form

Meine Faustregel: Unique Design nur bei Marken-Websites. Für MVPs, Tools und Blogs → shadcn/ui.

Phase 2: Tech-Stack Entscheidung (5 Minuten)

Je nach Anforderung:

Die Entscheidung fällt schnell – ich kenne die Stärken jedes Stacks nach 20+ Jahren.

Phase 3: Lokale Entwicklungsumgebung (15 Minuten)

DDEV Setup

mkdir projekt-name && cd projekt-name
ddev config --project-type=drupal11 --docroot=web
ddev start
ddev composer create drupal/recommended-project
ddev drush site:install -y

Für Astro/Next.js:

ddev config --project-type=php --webserver-type=nginx
ddev start
npm create astro@latest .

DDEV ist mein Standard für jedes Projekt. Konsistente Umgebung, funktioniert immer.

Phase 4: GitHub + Deployment (20 Minuten)

Repository einrichten

git init
git add .
git commit -m "Initial commit"
gh repo create projekt-name --private --push

GitHub Actions für automatisches Deployment

# .github/workflows/deploy.yml
name: Deploy

on:
  push:
    branches: [main]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - name: Setup Node
        uses: actions/setup-node@v4
        with:
          node-version: '20'

      - name: Build
        run: |
          npm ci
          npm run build

      - name: Deploy via SSH
        uses: appleboy/ssh-action@v1
        with:
          host: ${{ secrets.SSH_HOST }}
          username: ${{ secrets.SSH_USER }}
          key: ${{ secrets.SSH_KEY }}
          script: |
            cd /var/www/projekt
            git pull
            npm ci --production
            npm run build

SSH-Keys einmal einrichten → jeder Push deployed automatisch.

Phase 5: Claude Code Magic (2-4 Stunden)

Hier passiert die eigentliche Arbeit – und hier spart KI am meisten Zeit.

Figma MCP für Design-Umsetzung

# In Claude Code
/mcp figma

Claude Code liest das Figma-Design direkt aus und generiert Tailwind CSS. Kein manuelles Pixel-Pushing mehr.

Mein Prompt-Pattern

Erstelle [Komponente] basierend auf dem Figma-Design.
- Tailwind CSS
- Responsive (Mobile First)
- Accessibility beachten
- Keine Inline-Styles

Test-Driven Development

Wichtig: Ohne Test wird kein Feature implementiert.

Schreibe zuerst einen Test für [Feature].
Dann implementiere das Feature so, dass der Test passt.

Claude Code schreibt bessere Tests als ich – und vergisst keine Edge Cases.

Phase 6: Datenmodell & Import (1-2 Stunden)

Schema definieren

Erstelle ein Datenmodell für [Projektbeschreibung].
- Entitäten und Beziehungen
- Validierungsregeln
- Migrations-Dateien

Daten importieren

So viel wie möglich automatisieren:

• CSV/JSON Imports
• API-Migrations
• Web Scraping (wenn legal)

Bei Drupal nutze ich das Migrate API. Claude Code generiert die Migration Plugins.

Phase 7: SEO Setup (30 Minuten)

Checkliste, die Claude Code abarbeitet:

• Meta-Tags (Title, Description, OG)
• Strukturierte Daten (JSON-LD)
• Sitemap.xml generieren
• robots.txt
• Canonical URLs
• Alt-Texte für Bilder
• Performance-Optimierung (Core Web Vitals)

Search Console & Bing

# Sitemap einreichen
curl "https://www.google.com/ping?sitemap=https://example.com/sitemap.xml"
curl "https://www.bing.com/ping?sitemap=https://example.com/sitemap.xml"

Phase 8: Content-Generierung (1 Stunde Setup)

Blog-Posts mit OpenAI Batch API

Für Content-lastige Projekte plane ich 10-20 Artikel im Voraus:

# Vereinfachtes Beispiel
import openai

articles = [
    {"title": "Thema 1", "keywords": ["..."], "pubDate": "2025-01-15"},
    {"title": "Thema 2", "keywords": ["..."], "pubDate": "2025-01-22"},
    # ...
]

for article in articles:
    response = openai.chat.completions.create(
        model="gpt-4",
        messages=[
            {"role": "system", "content": "SEO-optimierter Blog-Autor..."},
            {"role": "user", "content": f"Schreibe Artikel über {article['title']}"}
        ]
    )
    save_as_markdown(response, article['pubDate'])

Die Batch API ist 90% günstiger als normale API-Calls. Perfekt für Bulk-Content.

Wichtig: Alle Artikel mit pubDate in der Zukunft. Sie erscheinen automatisch zum geplanten Datum.

Phase 9: Launch & erste Links (30 Minuten)

Sofort-Maßnahmen nach Launch

1. WhatsApp Status – erreicht mein Netzwerk sofort
2. Twitter/X Post – mit relevanten Hashtags
3. LinkedIn – für B2B-Projekte
4. Pressemeldung – bei größeren Launches (openPR, etc.)

Dann: Nächstes Projekt starten

Das Schöne an diesem Workflow: Er ist reproduzierbar. Projekt 2 geht noch schneller als Projekt 1.

Kosten-Kalkulation

Für ein fertiges, deployed, SEO-optimiertes Webprojekt mit Content.

Vergleich: Eine Agentur nimmt dafür 5.000-15.000 EUR. Und braucht 4-8 Wochen.

Fazit

Dieser Workflow funktioniert, weil:

1. Klare Entscheidungen – kein Overthinking beim Tech-Stack
2. Automatisierung – GitHub Actions, DDEV, Batch APIs
3. KI als Multiplikator – Claude Code für Code, OpenAI für Content
4. Test-Driven – weniger Bugs, schnellerer Launch

Das Wichtigste: Nicht perfekt launchen, sondern launchen.

Iteration kommt danach. Aber ohne Launch gibt es nichts zu iterieren.

Interesse an einem Projekt mit diesem Workflow? Schreiben Sie mir eine E-Mail an mail@stevenschulz.net oder rufen Sie an: 040 37420859 – ich setze auch Ihr Projekt in Rekordzeit um.