Motion as meaning: a design philosophy for frontend animation

You have felt it — on a site where everything moved wrong. Not broken. Nothing crashed. The animation was technically fine. But something was off. A button that responded too slowly. A section that revealed itself before you were ready for it. Scroll that felt like it was fighting you.

You probably left without knowing why. That is the thing about bad motion design — it does not announce itself. It just makes you slightly less willing to stay.

The opposite exists too. Sites where the motion feels like it was thought through — where you read things you would normally skim, scroll further than you intended, and end up somewhere different from where you started. You felt like you were inside something. Not reading a page.

That gap is what motion design is for. Almost nobody talks about it honestly — because most animation advice focuses on technique. Easing curves, spring physics, timing functions. All useful. All downstream of the real question: what is this motion actually doing to the person experiencing it?

I have spent years building toward three answers.

Dogstudio — a Belgian studio whose WebGL work became a reference point for me before I knew what WebGL was — build sites you can feel. Not just see. The technique is always impressive. But technique is not why it works.

Their sites direct you. They intrigue you into the next scroll. And by the time you reach the bottom, you have been somewhere — not just through a document.

That is the word: authored. Not assembled. The difference is not complexity. It is whether someone made deliberate decisions about what the reader experiences at each moment, and whether those decisions compound into something larger than their sum.

The three principles I have landed on are the mechanics underneath that effect.

Direction. Every animation on your page should push the reader somewhere specific. Not reveal — push. A section that fades in tells you it exists. A section that enters from a specific axis tells you where it came from and implies where you are going. Motion has a vector. Use it. The question is not "does this element animate?" — it is "does this animation show the reader where to go next?" Entrance animations that do not answer that question are noise, not signal. Cut them.

Intrigue. The best motion leaves the reader wanting the next frame before they have consciously decided to scroll. It creates a visual question — what happens if I keep going? A scrambled headline resolving into a name is intrigue. A page transition that wipes the screen and promises something different is intrigue. A trail that curves through content and disappears below the fold is intrigue — it says there is more, and it says so without words. Design for the person who almost left and did not. Motion is what tips that decision.

Immersion. When direction and intrigue compound across a full scroll, they become something else: the feeling of being inside a space, not reading a document. This is what separates sites that are looked at from sites that are experienced. It is not achieved by one clever animation. It is the accumulated effect of every motion decision making the right call, at the right moment, in the right direction — so completely that the mechanism disappears and only the feeling remains.

ASSEMBLED:  element appears  →  user notices animation
AUTHORED:   element arrives  →  user feels where to go next

Ignore these principles and the site still ships. Lighthouse will not flag an animation that fails to direct. Your client will not know why the dwell time is what it is.

But something will be missing. Visitors who should have scrolled further will not. Content that should have landed will be skimmed. The site will be technically animated and experientially forgettable — which is worse than being static, because it suggests someone tried and missed.

What good motion design returns is harder to put in a report: longer sessions, more content read, the feeling that the site is a product of someone who thought carefully about the experience. That last one converts. Not in a way you can cleanly attribute in analytics. But consistently, over time, it does.

Motion design is the part of frontend that separates builders from craftspeople. It is not about what you add. It is about whether everything you add is doing three things at once: pointing somewhere, creating a reason to keep going, and building the accumulated sense that the reader is inside something worth staying inside.

A site that does this well makes motion invisible. All you feel is where it took you.

The same precision applies beyond the frontend — here's how five Shopify automations are built to be invisible until you need them →