Every Frame Perfect: why an interface is judged frame by frame

Every frame is perfect

The phrase comes from Wayland: "every frame is perfect" is a stated goal of the display protocol, which was designed to take control back from increasingly complex GPU stacks. In a post on tonsky.me, the author argues that the same idea should apply to user interfaces, not just to graphics plumbing.

The rule of thumb he proposes is simple: if someone takes a screenshot of your app at any moment, you should be able to explain what is on screen. An edit note adds that the earlier phrasing — "it must make sense" — was too strict, because advanced animation techniques such as smear frames deliberately distort motion.

Why the middle of a transition matters

The argument for caring about every frame is trust. Users never see the code, so the interface is the only thing they can use to judge quality. If the UI looks polished, the reasoning goes, the team probably had time to polish the code as well — a heuristic, but a reasonable one.

In practice the author lists what that means: no white flashes between screens, no partially loaded content, no relayout while data arrives, internal consistency (one part of the UI should not say "1 update available" while another says "Checking for updates..."), and precise animations.

Animations are the part most often forgotten. An interface can look good in its start and end states and still be visibly broken in between. Screenshots taken mid-transition show elements caught in positions that no designer would have drawn on purpose.

Small desynchronisation, big doubts

Several examples come from everyday software. In Safari, placeholder text moves from the centre while the cursor animates from the left position, which makes two components feel out of sync — and raises the question of whether they were designed together at all. In Photos, switching between Crop and Adjust snaps the picture into place instantly while the crop border animates, creating a false impression that something subtly changed.

YouTube's example is the simplest task imaginable — moving a rectangle from one position to another — yet the result is hard to explain. The author calls such cases "the technology has outsmarted the programmer", pointing to limits in the DOM architecture. Whatever the cause, the frame is not perfect.

The post ends with an unprovoked zoom animation from the Preview app and a request: pay attention not only to the start and end states, but to everything in between.