A gradient on a poster is a decision. A gradient that moves is a whole series of decisions, and most of them are about restraint.
Almost every identity we have built in the past three years started with a gradient. Not because gradients are fashionable, but because they are the simplest way to show that something is alive. A flat colour sits still. A gradient implies light, depth and the possibility of change.
The trouble starts when the gradient has to move. Animate the colour stops too quickly and the result feels like a screensaver. Animate them too slowly and nobody notices. We now work with a simple rule of thumb: a full cycle should take longer than the average time someone looks at it.
Seven colours, three of them dark
Our festival identity for Afterglow uses seven colour stops, and three of them are almost black. That sounds like a waste of a palette, but the darks are what make the bright colours glow. Without them, ember orange and hot pink simply fight each other.
The darks are not the background. They are the reason the colours look lit from within.
We also blur far more than feels comfortable. The gradients in our hero loops are rendered at a tiny resolution, scaled up and blurred heavily, then a whisper of grain is added on top. The grain matters more than you would think: it stops video compression from turning smooth transitions into visible bands.
Loops that do not look like loops
Every looping background on this site is a seamless loop. The trick is unglamorous: we render a little more than we need and cross-fade the last few seconds into the first few. Done right, the eye never finds the seam, and the gradient just keeps breathing.
