●live showcase · 12 module · alles theme- & akzent-reaktiv
Design-Bibliothek,
in Bewegung.
Keine Theorie — sondern was ein Interface heute leisten kann: Bewegung, Interaktion, Tiefe und generative Grafik. Inhaltlich rund um KI, technisch zum Anfassen. Scroll dich durch.
Generatives neuronales Netz
— Canvas, rAF, akzent-reaktivKennzahlen, die zählen
— Count-up beim SichtbarwerdenGeführte Navigation
— Tabs mit animiertem IndikatorAutonome Agenten übernehmen wiederkehrende Abläufe end-to-end — vom Auslöser bis zur Bestätigung. Sie planen Schritte, rufen Werkzeuge auf und melden Ergebnisse zurück.
- Tool-Calling
- Mehrstufige Planung
- Human-in-the-Loop
Räumliche Tiefe
— 3D-Tilt + Cursor-SpotlightKlassifikation
Dokumente & Tickets automatisch einordnen.
Extraktion
Strukturierte Felder aus Freitext ziehen.
Zusammenfassung
Lange Inhalte auf den Kern verdichten.
Generierung
Entwürfe, Antworten, Code auf Abruf.
Simulierter Datenstrom
— Typewriter, Zeichen für Zeichen› user ▍
Endlose Bewegung
— Marquee, transform-basiertAnimierte Fortschritte
— Balken füllen beim ScrollenProgressive Offenlegung
— Accordion mit weicher HöheJa. Hosting und Verarbeitung lassen sich vollständig DSGVO-konform in deutschen bzw. EU-Rechenzentren abbilden — auf Wunsch ohne dass Daten den EU-Raum verlassen.
Für klar umrissene Anwendungsfälle steht ein erster lauffähiger Prototyp typischerweise in ein bis zwei Wochen — bewusst klein, um früh zu lernen.
Definierte Schwellen lösen eine Übergabe an einen Menschen aus. Lieber eine ehrliche Rückfrage als eine selbstbewusste falsche Antwort.
Licht folgt dem Zeiger
— Cursor-Spotlight + maskiertes Gridbeweg den Cursor übers Feld
Atmosphäre entsteht durch Details.
Ein Lichtkegel und ein freigelegtes Raster reagieren in Echtzeit auf die Maus — reine CSS-Masken, kein schweres Rendering.
Funktionale Mikrointeraktion
— Code kopieren + Toastimport { agent } from "@kai/sdk";
const support = agent({
tools: [search, createTicket, notify],
guardrails: { confidence: 0.7 },
});
await support.run("Kunde meldet Sync-Fehler");Generative Form
— Rotierender Gradient, GPU-schonendDieselben sechs Gradient-Stops wie überall auf der Seite — hier als langsam rotierende Orb. Wechsle oben das Farbschema und sieh zu, wie sie sich mitfärbt.