Expertise · Interface and interaction

Motion in interfaces: use at the right moment.

Not every visually appealing effect is worth keeping.

Quick summary

Motion is worth using when it helps customers understand what just happened: confirming actions, signaling state changes, or guiding the eye in sequence. It becomes a nuisance when used merely for decoration, prolonging wait times, or distracting from what the customer is doing. Sinh Vũ uses a simple test: does this effect help the customer understand something? If not, discard it.

Quick comparison
You should choose this direction when
  • need to confirm actions, smooth transitions meaningfully or guide the eye in order
  • daily repetitive interactions should be very short and light
Not needed when.
  • Add effects just to look sophisticated, without serving any understanding.
  • using motion as a psychological bait to rush customer decisions
  • customers reduce movement for health reasons.
Quick glance
Commonly used industries
Digital products.brande-commerce

Motion (motion effects in digital interfaces) is a truly valuable design tool, but it can be easily overused. You will encounter two extremes: pages without any effects look rigid and cold, while pages with too many effects appear chaotic and slow. The right point is not in the middle as a compromise, but in ensuring that each motion has a clear reason to exist.

Four movements allowed to be made

Sinh Vũ categorizes useful movements into four groups, based on practical documentation from the Nielsen Norman Group:

  • Action feedback: confirm that the customer has clicked, sent, and saved. For example: a button changes color slightly when pressed, an icon appears after completion.
  • Status update: informs customers whether the interface is loading, processing, or has changed content. Without this signal, customers do not know what is happening.
  • Spatial metaphor in navigation: when users switch screens, a subtle transition helps the brain orient itself: are they going deeper or returning?
  • Suggest interaction: small movements indicate something can be pulled, swiped, or expanded, rather than leaving the client to guess.

Motion also addresses a practical issue: change blindness, which means that the human eye easily overlooks recently updated content on the page. A small motion marking the recently changed area helps customers avoid having to read the entire page again to find new points.

When to skip movement

Motion becomes a burden in the following three situations:

  • Purely decorative page: effects that run when the page loads without serving any information, only to appear lively. You find it interesting the first time, slow the second time, and frustrating the tenth time.
  • Daily repetitive tasks: If a customer clicks a button twenty times each work session, an effect lasting 600 milliseconds on that button accumulates into a real waste. Things that are repeated often must be fast.
  • Many elements moving at once: The human eye can only focus on one moving point. When three areas run effects simultaneously, the result is chaos, not richness.
Purposeful motion helps customers understand what just happened and what the next steps are. Short duration, appearing at the right moment, without competing for attention with the main content.

Decorative motion runs for aesthetic appeal or because competitors have it. It does not answer any customer questions but consumes their attention and time.

Most common errors

  • Add effects for a sophisticated look, not because it solves any problem.
  • Excessively long motion during repetitive actions causes customers to wait each time they use it.
  • Using motion as a psychological bait: fake countdowns, artificial scarcity effects to pressure customers into hasty decisions. This is manipulation, not design.
  • Ignore the reduced motion option (prefers-reduced-motion), causing dizziness or discomfort for those with vestibular disorders.

Motion serves usability best when providing subtle feedback for microinteractions, not for amusement or entertainment. It should be discreet, brief, and refined.

Nielsen Norman Group, The Role of Animation and Motion in UX

The viewpoint of Sinh Vũ

When creating motion systems for brand websites, Sinh Vũ uses a single test question before each effect: what does this effect help the customer understand? If it cannot be answered, it is discarded. This question eliminates about half of the initial ideas, resulting in a lighter and clearer final page.

Sinh Vũ also considers respecting motion reduction options as mandatory, not optional. A decent digital product should not make a group of customers feel unwell after using it.

If you are reassessing your current motion system, start by listing all the effects currently running and ask that question for each one. Effects that do not pass the question are candidates for removal first.

The tool brings back.

Decision checklist

Topic: Timely motion in digital design. Sinh Vũ guide, sinhvu.com

0 more than 5 items

Select each item you find appropriate, then print or save as PDF to take with you.

Sign indicating that you should take action
Questions to answer before deciding

If you have marked most of the signs above, this is the time to discuss in more detail. Sinh Vũ can help you review and propose a direction.

References

Nielsen Norman Group, The Role of Animation and Motion in UX; Nielsen Norman Group, Executing UX Animations: Duration and Motion Characteristics. Sinh Vũ's practical experience in building motion systems for brand websites.

Frequently asked questions

How long should motion last?

Based on practical experience, most interface movements should be kept within 100 to 300 milliseconds. More complex movements can extend to about 500 milliseconds. This is a reference range, not a hard threshold, as the appropriate duration also depends on the type of movement and the frequency with which the customer repeats that action. What the customer does ten times a day needs to be faster than something that only happens once.

Is it mandatory to support the motion reduction option?

The prefers-reduced-motion option is a system setting for people with vestibular disorders or sensitivity to fast motion. If a digital product ignores this option, a group of customers may feel dizzy or uncomfortable while using it. Sinh Vũ considers this a mandatory part of a decent product, not an additional feature added later.

← Back to Digital experience