A page can move beautifully and still be difficult to use. The useful question is not how much animation a screen can hold, but what each movement tells the person looking at it.
Make the change clear.
Moving between pages is a change of context. A transition can mark that moment and introduce the destination before the new content arrives. Its job is to connect the action with the result.
At QIXARC, the page curtain uses the destination name as its focal point. The surrounding content changes while the curtain covers the screen, then the next page is revealed. The movement has a beginning and an end.
Acknowledge the action.
A selected option, an expanded menu or a form message should make its state clear. Small changes in colour, position or opacity can support that feedback.
The message still needs to work without movement. A label should explain what happened; an animation should reinforce it. For example, preparing an email draft is different from sending a message, and the interface should say so.
Know when to stop.
Repeated motion competes with reading. Keep the main task in view and give decorative movement a quieter role. A pause control is useful when a page includes ongoing animation.
For people who prefer reduced motion, keep the navigation and content available with a simpler change of state. The information should never depend on watching an effect.
Four questions before shipping.
- Does the movement explain a change or provide useful feedback?
- Can someone continue their task without waiting unnecessarily?
- Is the meaning still clear with animation disabled?
- Does the experience hold together on a smaller screen?
If an effect has no clear answer to the first question, removing it is often the most useful design decision.