Interface animations, motion that explains the UI, not motion for its own sake.
Interface animation has one job: make the product state-change legible. Good motion clarifies; bad motion delays. We design and ship the animation layer alongside the static design so the product feels intentional, not 'designer added a bounce'.
What we build
Easing + duration as tokens, not magic numbers
Named easing curves (`ease-out-quart`, `ease-out-expo`) and duration tokens (`fast`, `medium`, `slow`) live in the design system. Engineers reference tokens; the motion feels consistent across components without designers reviewing every PR.
Imperative motion for interactions, Lottie for the rest
Interactive product motion handled in code with proper layout animations and presence handling. Decorative motion (hero loops, loading states, success affirmations) as Lottie files exported from After Effects. Right tool per surface.
Reduced-motion as a first-class state
Every animation respects `prefers-reduced-motion`. Critical state-change animations downgrade to opacity-only crossfades; decorative motion gets disabled entirely. Accessibility is baked in, not audited later.
Page transitions that don't fight the router
Route-change animations that work with streaming, server-rendered route changes. No flicker, no layout shift, no broken back button. Animation runs on top of the framework, not against it.
Loading states that earn the wait
Skeleton screens shaped like the content they're loading. Progress indicators on operations that take time. Optimistic UI on operations that don't. The wait is structured information, not a generic spinner.
Animation budget enforced in CI
Lighthouse CI tracks Total Blocking Time and INP. Animations that block the main thread fail the build. The animation team sees the budget; nobody ships a 60kb Lottie that tanks LCP.
Where this fits
Your product is functionally complete but feels static; the team has been saying 'we'll polish the motion later' for two quarters.
Your animations are inconsistent across the product because each engineer picks easing values by feel.
Your motion is heavy and the performance team has flagged it but design doesn't want to remove it.
Tech stack
- After Effects
- Lottie
- motion/react
- Easing Tokens
Want this for your team?
30 minutes to scope what you need. No pitch deck, no obligation. We tell you straight whether Stacklane fits.
Book a Free Call