Vision Features Szenarien UI Ablauf Architektur Tech Stack Datenmodell API Security Deployment
powered by KUROsphere

Data Onboarding
für WESEO

Szenario-gesteuertes Kunden-Onboarding, das Daten intelligent erfasst, KI-gestützt vorab recherchiert und das gesamte Setup in Minuten statt Wochen erledigt.

6
Szenarien
10
Sektionen
80+
Datenfelder
<5 min
mit KI
Das Problem

Warum Data Onboarding?

Das Onboarding neuer Kunden war bisher ein manueller Prozess: E-Mails, Excel-Listen, fehlende Zugänge, unvollständige Daten. Data Onboarding löst das mit einem intelligenten, szenario-basierten System.

Vorher: Chaos

Kundendaten verstreut in E-Mails, PDFs und Tabellen. Zugänge fehlen, wichtige Infos gehen verloren. Onboarding dauert Wochen.

Nachher: Data Onboarding

Ein Link, ein Formular, alles an einem Ort. KI füllt vor, Szenarien steuern die Tiefe, Autosave sichert den Fortschritt.

Ergebnis

Vollständige Kundendaten in Minuten statt Wochen. Keine verlorenen E-Mails, keine doppelten Rückfragen. Sofort arbeitsfähig.

Funktionsumfang

Alle Features im Überblick

Von KI-gestützter Recherche bis zur automatischen Zugangsverwaltung — alles was ein professionelles Agentur-Onboarding braucht.

🔬

KI-Recherche

Perplexity AI analysiert die Firmenwebsite und befüllt Felder automatisch: Firmendaten, Wettbewerber, Keywords, Social-Media-Profile.

🎯

Szenario-System

6 vordefinierte Szenarien steuern, welche Felder sichtbar und welche Pflicht sind. Essenziell + Empfohlen = maximale Flexibilität.

🗣

Website Crawl

Automatische Erkennung von CMS, Hosting, Analytics-Pixels (GA4, GTM, Meta, TikTok), Social Links und Schema.org-Daten.

💬

KI-Chatbot

Ein integrierter OpenAI-Chatbot hilft dem Kunden bei Fragen zu einzelnen Feldern — kontextbezogen zur aktuellen Sektion.

👤

Admin Dashboard

Übersicht aller Kunden, Fortschritt, Status, Kommentare, Activity Log. Alles in Echtzeit für das Agency-Team.

🔒

Zugangsverwaltung

Email-Pool für GA4, GSC, GTM etc. Kunden können Zugänge direkt vergeben oder Login-Daten hinterlegen. AES-256 verschlüsselt.

💾

Autosave & Fortschritt

Jede Änderung wird automatisch nach 3 Sekunden gespeichert. Kunden können jederzeit pausieren und später fortfahren.

📄

PDF Export & Webhooks

Export aller Onboarding-Daten als PDF. Webhook-Integration für externe Tools (HMAC-signiert).

🌐

Multi-Tenancy

Jede Agentur hat eigene Kunden, Branding, Farben, E-Mail-Pool und User. Skalierbar für mehrere Agenturen.

Szenario-System

Intelligente Steuerung der Datenerfassung

Jedes Szenario definiert exakt, welche Sektionen und Felder sichtbar sind. Admin wählt pro Kunde Essenziell, Empfohlen oder Aus — ein 3-State-Toggle.

👁

Sichtbarkeit

Überblick über den Ist-Zustand — Firmendaten, Online-Präsenz, keine Zugänge nötig
#Firma #Markt #Website #Analytics #Social
📈

Website Performance & Analyse

Analytics-Zugänge für Datenauswertung — GA4, Search Console, Tag Manager
#Firma #Markt #Website #Analytics ★ #Recht

Performance Ads

Werbekonten & Tracking — Google Ads, Meta Ads, Conversion-Pixel
#Firma #Markt #Analytics #Ads ★ #Social #Recht
📣

Social Media

Alle Social-Kanäle mit Zugängen, Design-Assets für Content-Erstellung
#Firma #Design #Markt #Social ★ #Ads
🖥

Technischer Deepdive

Voller technischer Zugang — CMS, Hosting, FTP/SSH, CDN, Branchensoftware
#Firma ★ #Design ★ #Markt ★ #Website ★ #Branche ★ #Analytics ★ #Ads ★ #E-Mail ★ #Recht ★
🧬

DNA

Komplettaufnahme — alle Sektionen und Felder, voller Überblick
#Alles ★

Szenario-Matrix: Sektionen × Szenarien

Sektion Sichtbarkeit Performance Ads Social Tech DNA
FirmenprofilTeilweiseTeilweiseTeilweiseTeilweiseAlle ★Alle ★
Corporate DesignTeilweiseAlle ★Alle ★
Markt & UmfeldAlle ★Alle ★Alle ★Alle ★Alle ★Alle ★
Website & TechnikTeilweiseTeilweiseTeilweiseAlle ★Alle ★
BranchensoftwareAlle ★Alle ★
Analytics & TrackingGSC URLAlle ★GA4 + GTMAlle ★Alle ★
Ads & WerbungAlle ★Meta + TikTokAlle ★Alle ★
Social MediaURLs onlyFB + TikTok + LIAlle ★Alle ★
E-Mail MarketingAlle ★Alle ★
Recht & DSGVOCookieCookieAlle ★Alle ★
User Interface

Modernes, szenario-gesteuertes UI

Das UI passt sich dynamisch an die gewählten Szenarien an. Nicht benötigte Sektionen und Felder werden automatisch ausgeblendet.

Onboarding Wizard — Welcome Screen

app.weseo.at/onboarding/abc123xyz
Willkommen,
Muster GmbH
Folgende Schritte haben wir vorbereitet.
Sie können jederzeit pausieren und später fortfahren.
📝 58 Felder ⏱ mit KI-Unterstützung nur einige Minuten 💾 Autosave aktiv
Essenziell

Sichtbarkeit · 20 Felder

Empfohlen

Performance · 38 Felder

#Firma #Design #Markt #Website #Analytics #Social
Onboarding starten →

Admin Dashboard

app.weseo.at/admin
📈 Dashboard
👥 Kunden
📧 E-Mail Pool
📄 Aktivität
⚙ Einstellungen
24
Gesamt
8
Aktiv
12
Fertig
4
Entwurf
Letzte Kunden
Muster GmbH
Sichtbarkeit Performance
65%
Hotel Alpin
DNA
100%
TechStart AG
Ads Social
30%
Ablauf

Der Onboarding-Prozess

Von der Kundenerstellung bis zur vollständigen Datenerfassung — ein durchgängiger, automatisierter Ablauf.

1. Kunde anlegen

Admin erstellt Kunden im Dashboard, wählt Szenarien (Essenziell/Empfohlen) und optional eine Branchenvorlage. Ein individueller Onboarding-Link wird generiert.

  • Szenario-Auswahl
  • 3-State-Toggle
  • Branchen-Templates
  • Token-basierter Link

2. KI-Recherche

Vor dem Versand kann die KI automatisch die Website des Kunden analysieren: CMS-Erkennung, Social-Profile, Analytics-Pixel, Keywords und Firmendaten werden vorausgefüllt.

  • Perplexity AI
  • Website Crawl
  • Pixel-Detection
  • Auto-Fill

3. Kunde füllt aus

Der Kunde öffnet den Link, sieht den Welcome Screen mit seinen Szenarien und füllt Sektion für Sektion aus. Autosave sichert alle 3 Sekunden. KI-Chatbot hilft bei Fragen.

  • Multi-Step Wizard
  • Autosave (3s)
  • KI-Chatbot
  • Fortschritts-Tracking

4. Zugänge vergeben

Für Analytics, Ads und Social Media: Der Kunde kann entweder die Agentur-E-Mail einladen oder Login-Daten direkt hinterlegen (AES-256 verschlüsselt).

  • Email-Pool
  • AES-256-GCM
  • Guided Wizard
  • Copy-to-Clipboard

5. Abschluss

Sobald alle Pflichtfelder ausgefüllt sind, kann der Kunde das Onboarding abschließen. Confetti-Animation, Webhook an externe Tools, Admin wird benachrichtigt.

  • Pflicht-Validierung
  • Webhooks (HMAC)
  • PDF Export
  • Benachrichtigungen
Architektur

Systemarchitektur

Eine moderne, containerisierte Full-Stack-Architektur mit klarer Trennung von Concerns und Production-Ready Deployment.

Client
🌐 Browser
📱 Mobile
Reverse Proxy
🔒 Caddy (HTTPS / Auto-SSL)
Application
Next.js 15 (App Router)
🔨 API Routes
🚀 SSR + RSC
🤖 Middleware (Auth)
ORM
📚 Prisma 6
🔐 AES-256-GCM Encryption
📋 Zod Validation
Database
🗃 SQLite (Dev)
🐘 PostgreSQL 16 (Prod)
External APIs
🤖 Perplexity AI
💬 OpenAI (Chat)
📧 Nodemailer (SMTP)
Technologien

Tech Stack

Moderner, bewährter Stack für maximale Entwicklungsgeschwindigkeit und Stabilität.

Next.js 15
App Router, RSC, SSR
🔵
TypeScript 5
Strikte Typisierung
🎨
Tailwind CSS 4
Utility-first Styling
💎
Prisma 6
Type-safe ORM
🐘
PostgreSQL 16
Production DB
🗃
SQLite
Local Development
🐋
Docker
Container Runtime
🔒
Caddy
HTTPS, Auto-SSL
🤖
Perplexity AI
Company Research
💬
OpenAI
Chat Assistant
🔓
jose (JWT)
Authentication
📋
Zod
Schema Validation
🎯
Radix UI
Accessible Primitives
Framer Motion
Animations
📧
Nodemailer
E-Mail Versand
🎉
canvas-confetti
Completion FX
Datenmodell

Prisma Schema

10 Modelle decken den kompletten Datenbereich ab — von Agenturen über Kunden bis hin zu Kommentaren und verschlüsselten Zugangsdaten.

Agency

  • name, slug String
  • primaryColor, accentColor String?
  • logoUrl, language String?
  • webhookUrl, webhookSecret String?
  • emailFrom, maxCustomers Int

AgencyUser

  • email, passwordHash String
  • name, role String
  • isActive Boolean
  • agencyId → Agency

Customer

  • name, slug, token String
  • status Enum (draft|active|completed|archived)
  • template, services String
  • scenarios Json
  • companyProfile, websiteTech, ... Json

AgencyEmail

  • email, service String
  • maxSlots Int
  • isActive Boolean
  • note String?

Comment

  • section, field String
  • content String
  • author, authorRole String
  • customerId → Customer

Activity

  • action, section, field String
  • oldValue, newValue String?
  • actor, actorRole String
  • customerId → Customer

FileUpload

  • section, field String
  • filename, path String
  • mimeType, size String / Int
  • status String

Notification

  • type String
  • title, message String
  • read Boolean
  • agencyId → Agency
REST API

API-Endpunkte

Vollständige REST-API mit JWT-Authentifizierung, Rate Limiting und Zod-Validierung.

Method Endpunkt Beschreibung Auth
POST /api/auth Login (JWT + Session Cookie) 🔓 Public
DEL /api/auth Logout 🔒 Auth
POST /api/auth/forgot-password Passwort-Reset anfordern 🔓 Public
GET /api/customers Kundenliste (agency-scoped) 🔒 Auth
POST /api/customers Kunde erstellen + Onboarding-Token 🔒 Auth
GET /api/customers/[id] Kundendetails 🔒 Auth
PATCH /api/customers/[id] Kunde aktualisieren 🔒 Auth
GET /api/onboarding/[token] Onboarding-Daten laden 🔓 Token
PATCH /api/onboarding/[token] Sektion speichern (Autosave) 🔓 Token
POST /api/research KI-Recherche (Perplexity) 🔒 Auth
POST /api/chat KI-Chatbot (OpenAI) 🔓 Token
POST /api/crawl Website-Crawl & Pixel-Detection 🔒 Auth
GET /api/agency/settings Agentur-Einstellungen 🔒 Auth
GET /api/notifications/in-app In-App-Benachrichtigungen 🔒 Auth
POST /api/export/pdf PDF-Export 🔒 Auth
GET /api/health Health Check 🔓 Public
Sicherheit

Security & Datenschutz

Enterprise-Grade Sicherheit mit verschlüsselten Zugangsdaten, Rate Limiting und Multi-Layer Authentication.

🔓 JWT Authentication

HS256-signierte Tokens mit 7 Tagen Ablauf. HttpOnly/Secure Session-Cookies. Middleware schützt alle nicht-öffentlichen Routen.

🔐 AES-256-GCM

Sensible Zugangsdaten (FTP-Passwörter, SSH-Keys, API-Tokens) werden serverseitig mit AES-256-GCM verschlüsselt gespeichert.

🛠 bcrypt Hashing

Alle Benutzerpasswörter werden mit bcrypt gehasht. Salt-Rounds gewährleisten Schutz gegen Rainbow-Table-Angriffe.

🚪 Rate Limiting

Token-Bucket-basiertes Rate Limiting: Auth 10/15min, Upload 20/min, Onboarding 100/min. In-Memory-Store pro Instanz.

📋 Zod Validation

Alle API-Eingaben werden serverseitig mit Zod-Schemas validiert. Fehlerhafte oder manipulierte Daten werden abgewiesen.

📨 Webhook HMAC

Ausgehende Webhooks werden mit HMAC-SHA256 signiert. Empfänger können die Integrität der Payload verifizieren.

Infrastruktur

Deployment & Hosting

Containerisiertes Deployment auf Hetzner Cloud mit Docker Compose, Caddy für automatisches HTTPS und PostgreSQL als Produktions-DB.

🐋 Docker Compose

3 Services: app (Next.js Standalone), db (PostgreSQL 16), caddy (Reverse Proxy). Multi-Stage Build für minimale Image-Größe.

🔒 Caddy

Automatisches HTTPS via Let's Encrypt. Zero-Config SSL-Zertifikat-Management. Reverse Proxy auf den Next.js-Container.

🖥 Hetzner Cloud

Ubuntu 24.04 VPS mit 8 GB RAM. SSH-Zugang, Docker vorinstalliert. Standort: Helsinki (eu-central).

🐘 PostgreSQL 16

Production-Datenbank im Docker-Container. Persistent Volume für Datensicherheit. Prisma führt Migrationen beim Start aus.

🚀 CI/CD Pipeline

Lokale Entwicklung mit SQLite. Push auf den Server via SCP. Docker Build + Restart auf dem Server. Health Check verifies Uptime.

🌐 DNS & Domain

A-Record auf die Server-IP. Caddy erledigt den Rest: automatische Zertifikate, HTTP→HTTPS Redirect, OCSP Stapling.

Docker Compose Architektur

# docker-compose.prod.yml services: db: image: postgres:16-alpine volumes: pgdata:/var/lib/postgresql/data environment: POSTGRES_DB, POSTGRES_USER, POSTGRES_PASSWORD app: build: . depends_on: db environment: DATABASE_URL, JWT_SECRET, ENCRYPTION_KEY, ... healthcheck: GET /api/health caddy: image: caddy:2-alpine ports: 80:80, 443:443 volumes: ./Caddyfile, caddy_data, caddy_config
Konfiguration

Environment Variables

Alle sensitiven Daten werden über Umgebungsvariablen konfiguriert. Zod-validiert beim Start.

# Core DATABASE_URL="postgresql://user:pass@db:5432/kurosphere" JWT_SECRET="min. 32 Zeichen" ENCRYPTION_KEY="64-Hex-Zeichen (32 Bytes)" NEXT_PUBLIC_BASE_URL="https://app.domain.at" # AI PERPLEXITY_API_KEY="pplx-..." OPENAI_API_KEY="sk-..." # E-Mail SMTP_HOST="smtp.provider.com" SMTP_PORT="587" SMTP_USER="noreply@domain.at" SMTP_PASS="..."
Internationalisierung

Mehrsprachigkeit

Die Plattform unterstützt 3 Sprachen mit vollständigen Übersetzungen für alle Labels, Hilfstexte und UI-Elemente.

🇩🇪

Deutsch

Standardsprache. Alle Texte, Hilfetexte, Validierungen und UI-Elemente.

🇬🇧

English

Full translation. All labels, help texts, validation messages and UI elements.

🇮🇹

Italiano

Traduzione completa. Tutti i testi, messaggi e elementi dell'interfaccia.

Ausblick

Nächste Schritte

Die Plattform ist Production-Ready. Geplante Erweiterungen:

🔗 CRM-Integration

Direkte Anbindung an gängige CRM-Systeme (HubSpot, Pipedrive) via Webhooks oder native API.

📊 Reporting Dashboard

Erweiterte Auswertungen: Durchlaufzeiten, Completion-Rates, Szenario-Vergleiche.

👥 Team-Rollen

Granulare Berechtigungen: Viewer, Editor, Admin. Kundengruppen-Zuordnung.

🤖 KI-Erweiterungen

Automatische Wettbewerbsanalyse, Keyword-Clustering, Sentiment-Analyse der Online-Präsenz.