TK100X
designsystem

Designsystem

Kanonische UI-Quelle für Cockpit-Muster, Branding und tenant-persistente Design-Konfiguration.

Tenant Design-Konfiguration

agents4you

Tenant: lädtAnsehen

Farben, Logo und Brand-Basics werden in der Tenant-Datenbank gespeichert. Standard ist Lesen; agents4you Admins bearbeiten explizit und speichern pro Cockpit.

Live Vorschau
a4
agents4you
Geschäftsführungs-Cockpit
Primary Area
Cockpit Übersicht
Firmenname
agents4you
Tagline
Geschäftsführungs-Cockpit
Logo-Kürzel
a4
Admin/User Label
Andrea
Farben
Primärfarbe
#1e4b8a
Primär weich
#e0e7ff
Akzent
#c44a0c
Hintergrund
#ffffff
Kartenfläche
#ffffff
Text
#ffffff
Muted Text
#ffffff
Linien
#ffffff
Regel: Diese Ansicht ist read-only. Änderungen laufen über Bearbeiten und werden anschließend in cockpit_runtime_config.theme_json gespeichert.

PDF-Design Einstellungen

Dokumenten-Generator

Diese Einstellungen gelten cockpitweit für alle PDFs: Protokolle, Mängelberichte, Nachträge und spätere Dokumenttypen. Die Inhalte kommen aus dem jeweiligen Board, das Design kommt zentral von hier.

Global pro Cockpit
Logo & Kopfbereich
Logo: Das Firmenlogo aus dem zentralen Branding wird rechts in der Kopfzeile platziert. Du steuerst Anzeige, vertikale Position und Größe.
Schrift & Inhaltsdesign
Fußzeile & Seitenlayout
Live-Vorschau
Template für alle Cockpits
agents4you Geschäftsführungs-Cockpit
Baustellenprotokoll
Baustellenbegehung Einfamilienhaus Maier
Baustelle
Musterbaustelle
Datum
07.05.2026
Inhalt & Feststellungen

Beispieltext aus dem Cockpit-Feld. Farben, Größen, Logo und Layout kommen zentral aus dem PDF Design.

Dieses Dokument wurde im Business Cockpit erstellt.

Cockpit-Wechsel & zentrale Themes

Cockpit Switcher

Links oben wird zuerst das aktive Cockpit angezeigt. Im Dropdown gibt es zwei klar getrennte Bereiche: bestehendes Cockpit wählen und neues Cockpit anlegen. User- und Branding-Settings liegen unter Konfiguration.

Aktives Cockpit
TK
TK100X
cockpit_tk100x · Theme v1.0.0
Anlegen & Theme Governance
  • Anlegen läuft über ein klares Formular: Kunde, Branche, Vorlage, Theme.
  • Themes gehören zur Cockpit-Instanz, nicht zum Browser.
  • Bearbeitung erfolgt zentral durch agents4you.
  • Theme-Daten werden versioniert: Farben, Logo-Kürzel, Name, Tagline.
  • Final: HQ Registry/API als Single Source of Truth.

URL-Struktur

URLZweckBereichStatus
/Tagesbriefing, Aufgabenfokus, E-Mails, Entscheidungen und Tagesplan.Übersichtaktiv
/projekteMonatsbasierter Projektplan mit Status, Fristen, Blockaden und zugehörigen Aufgaben.Projekteaktiv
/routinenWiederkehrende Arbeit, Monitore, pausierte Abläufe und auditfähige Aktionen.Routinenaktiv
/aufgabenOperative Aufgabensteuerung mit Kanban, Liste, Zeitleiste und Projektfiltern.Aufgabenaktiv
/notizenPersönliche Notizen, Ideen und Checklisten je Kunden-Cockpit.Aufgabenaktiv
/wissenWissensdatenbank mit Ordnerstruktur, Suche, Quellen und Nutzungsaktionen.Wissenaktiv
/medienMediendatenbank für Logos, Banner, Social Posts, Präsentationen und Brand Assets.Wissenaktiv
/digitale-mitarbeiterRoster, Auslastung und Ergebnisse digitaler Mitarbeiter.Digitale Mitarbeiteraktiv
/entscheidungenMensch-in-der-Schleife-Queue für Freigaben und Abwägungen.Entscheidungenaktiv
/konfigurationArbeitsbereich, Sicherheit und Systemkonfiguration.Einstellungenaktiv
/integrationenAnbieterstatus, Berechtigungen und Abgleich-Health.Einstellungenaktiv
/designsystemKanonische UI-Dokumentation, Branding und Wiederverwendungsregeln.Einstellungenaktiv

Markenprinzipien

Unsicherheit in der Führung reduzieren
Menschliche Freigabe für verantwortliche Entscheidungen
Dichte, ruhige Oberflächen mit Quellenbezug

Design-Tokens

Primär
Akzent
Gut
Warnung
Gefahr
Fläche

Welog Logistics Components

Flotte aktiv
42/48
87% verfügbar
Touren heute
126
18 kritisch
Zustellungen
94.8%
+2.1% vs. Vortag
Lagerauslastung
73%
Slot B4 knapp
Control Tower
Exception Feed
Tour WL-184 verspätet
ETA +24 min · Kunde Müller & Partner · Fahrer Rückmeldung offen
Rampe 3 blockiert
Warehouse Graz · Slot 14:30 verschieben · Alternative Rampe 5 frei
Fahrzeug V-22 wieder verfügbar
Werkstatt-Check abgeschlossen · zurück in Disposition
In ZustellungETA 14:42
Graz → Linz
Fahrzeug
V-18
Auslastung
82%
WartetETA 16:10
Wien Hub → Salzburg
Fahrzeug
V-07
Auslastung
64%
KritischETA +31 min
Klagenfurt → Graz
Fahrzeug
V-22
Auslastung
91%

Popup & Dialog Best Practices

Confirm Dialog

Keine nativen Browser-Popups. Bestätigungen laufen über den Cockpit-Dialog mit Blur-Backdrop, klarer Headline, Kontexttext und explizitem CTA.

Projekt löschen?
Das Projekt wird gelöscht. Zugehörige Tasks werden ebenfalls entfernt.
Dialog-Regeln
  • Native confirm, alert und prompt sind verboten.
  • Destruktive Aktionen nutzen Ghost-Button mit rotem Text plus neutralen Abbrechen-Button.
  • Dialoge müssen Kontext nennen: Objektname, Auswirkung, Cascade-Hinweis.
  • Primary bleibt für positive Create-Flows; Delete bleibt auch im Dialog Ghost/Danger.

CRUD Best Practices

Bearbeiten

Bearbeiten nutzt immer ghost, weil es eine sichere, reversible UI-Aktion ist. Primär bleibt für Neu-anlegen/Erstellen reserviert.

Löschen

Löschen ist sichtbar, aber nicht dominant: ghost + danger text, immer mit Confirm. Keine roten Primärflächen in Listen.

Kanban Drag & Drop

Task Board Element
Geplant
TK100X
Content-Freigabe vorbereiten
In Arbeit
TK100X
Logo-Varianten prüfen
Erledigt
TK100X
Kickoff-Protokoll speichern
DnD-Regeln
  • Karten sind per Drag & Drop zwischen Status-Spalten verschiebbar.
  • Drop-Ziel bekommt farbigen Rahmen und subtilen Inset-Glow.
  • Statuswechsel wird optimistisch gespeichert und bei API-Fehler zurückgerollt.
  • Karte bleibt klickbar: Klick öffnet Detail-Drawer, Drag verändert Status.

Primitive

Schaltflächen, Kennzeichnungen, Status

NeutralQuelleKritischGefährdetIm Plan

Tabellen

Standard: Tabellenheader sind echte Sortier-Buttons mit Icon, aktivem Zustand und Richtungswechsel. Kein Fake-Icon ohne Klickfunktion.
Munich-Re-Angebot finalisierenIn ArbeitKritischAva + Lukas
WELoG Checkliste prüfenGeplantHochPhil
Kundenfeedback einarbeitenWartetMittelTom

Fachkarten

Verhandlungsnotizen Munich Re

InternKundennotiz

Entscheider, kommerzielle Einwände und akzeptable Zugeständnisse für das Verlängerungsangebot.

CRMGroßkundenVertriebMunich-Re-Abschluss
Stand: 28. Apr. 2026Interne Quelle

Gmail

Verbunden

E-Mail · Nur-Lesen-Sync läuft stabil.

Nur Lesen
Letzter Abgleich: 2026-04-28T08:58:00+02:00

Rabatt-Leitplanke für Munich Re freigeben

87% VertrauenMunich-Re-Abschluss

Ava hat eine Angebotsüberarbeitung vorbereitet. Der Abschluss bleibt oberhalb von 9% Rabatt attraktiv, die angefragten Konditionen deuten jedoch auf 12%.

28. Apr.
Empfehlung

Harte 9%-Leitplanke freigeben und statt tieferem Rabatt ein Leistungsguthaben anbieten.

Optionen
9%-Leitplanke freigeben12% Rabatt freigebenLeistungsumfang neu verhandeln lassen
Quellen
Verhandlungsnotizen Munich Re Großkunden-SaaS-Rabattbenchmark DACH

Zustände

Laden

Dimensionen stabil halten, während Integrationsdaten ankommen.

Fehler

Den fehlerhaften Anbieter und die nächste Wiederherstellungsaktion benennen.

Leer

Immer die beste nächste Aktion zeigen, nie eine Sackgasse.