MotionMotion
Zwei Geschwindigkeiten, ein Charakter. Im Marketing führt Motion: ausdrucksstarke Form-Reveals und Energie. In der Plattform beruhigt Motion: kurze, funktionale Übergänge, die Vertrauen schaffen. Kein Bounce, keine Endlos-Loops auf Inhalten.Two speeds, one character. In marketing, motion leads: expressive shape reveals and energy. In the platform, motion reassures: short, functional transitions that build trust. No bounce, no looping on content.
Lebendig & ausdrucksstarkAlive & expressive
Form-Reveals, gestaffelte Pop-ins, spielerische Übergänge. Energie, die einlädt — aber nie manipuliert.Shape reveals, staggered pop-ins, playful transitions. Energy that invites — but never manipulates.
Ruhig & funktionalCalm & functional
Kurze Fades und kleine Translates. Motion bestätigt Handlungen, statt sie zu fordern. Verlässlich und unaufdringlich.Short fades and small translates. Motion confirms actions instead of demanding them. Dependable and quiet.
Die Bewegungen des Systems.The system's motions.
Alle Bewegungen respektieren „prefers-reduced-motion“: bei reduzierter Bewegung erscheinen Inhalte sofort und ruhig.All motion respects “prefers-reduced-motion”: with reduced motion, content appears instantly and calmly.
Drei Dauern, ein Easing.Three durations, one easing.
Eine kleine, disziplinierte Palette. Standard-Easing cubic-bezier(.2,.7,.2,1) für ein weiches, sicheres Auslaufen.A small, disciplined palette. Standard easing cubic-bezier(.2,.7,.2,1) for a soft, confident settle.
Bewegung signalisiert Klickbarkeit.Motion signals that something is clickable.
- Hover-, Fokus- und Aktiv-Zustände nur auf interaktiven Elementen: Links, Buttons, Eingaben.Hover, focus and active states only on interactive elements: links, buttons, inputs.
- Sichtbarer Fokus-Ring für Tastatur-Navigation.A visible focus ring for keyboard navigation.
- Kurze UI-Übergänge (240 ms), die das Klick-Ziel bestätigen.Short UI transitions (240ms) that confirm the click target.
- Keine Hover-Effekte auf statischen Karten, Kacheln oder Text — das täuscht Klickbarkeit vor.No hover effects on static cards, tiles or text — it fakes clickability.
- Kein Lift/Schatten auf Dingen, die nichts tun, wenn man sie anklickt.No lift/shadow on things that do nothing when clicked.
- Keine Bewegung allein zur Dekoration in dichten Layouts.No motion for decoration alone in dense layouts.