Animations and Transitions

Bringing the interface to life. Learn how to create smooth state changes and complex cyclic animations without JavaScript.

Smooth Transitions: The Art of Transition

theory

Timing and Steps: Ease, Bezier, and Steps

theory

Transform: GPU and 3D Reality

theory

Keyframes: Complex Direction

theory

Animation Shorthand and Delays: Wave Effect

theory

State Control: Fill-mode and Direction

theory

Modern CSS: Independent Transforms

theory

Future: Scroll-Driven Animations

theory

View Transitions: Magic of Frame Change

theory

CSS Math: Trigonometry in Motion

theory

Performance: Layout, Paint, Composite

theory

@property: Animating the Impossible

theory

Workshop: Micro-interactions

theory