K06 · Foundations

Motion

Snappy, playful, purposeful. The product moves, the page stays calm. Transform and opacity only, native scrolling always, and a complete reduced-motion fallback.

Durations & springs

  • instant · 100
    hover, press
  • quick · 160
    toggles, chips
  • base · 240
    popovers, drawers
  • slow · 360
    rolling numbers
  • glide · 560
    Expand, count-up
  • spring · snap
    UI responses
  • spring · glide
    shared elements

Motion budget by stage

Pre-launch

Bold, cinematic. Headline reveals, video, one big moment per page.

Launch

Playful. Live UI, cursors, count-ups, Expand.

Scale

Restrained. Fades and state changes only, no cursors by default.

App & utility

Strictly functional. Feedback under 160 ms, nothing decorative.

Catalog · live

DELTA COUNT-UP · 560 glide
51% Δ +14 pts · from 37% · 90 days Runs once on scroll-in. Reduced motion shows the final value.
PRICING TOGGLE · rolling numbers
$ 35 29 per seat / month
Savings stated as computed: $35 × 12 vs $29 × 12.
AUTO-ADVANCE TABS · 6 s

Zendesk, Slack and in-app requests arrive in one inbox with account and ARR.

SHIP LOG TICKER · pausable
v2.14Changelog auto-notify v2.13.2CSV import keeps dates v2.13Linear two-way sync v2.12Revenue weighting
Anything moving longer than 5 s gets a visible pause (WCAG 2.2.2).
Live UI on scroll
Feedback sorts itself into themes when 40% in view. Once.
Bento Expand
View Transitions, glide 560 ms. Fallback: instant swap.
Multiplayer cursors
Glide on 14–17 s paths, never over CTAs, dismissible.
Before / after
Keyboard-operable slider; arrow keys move 10%.