Direct naar hoofdinhoud

Hoofdnavigatie

Platform Beta

Motion

Motion helps to guide users, providing them with the right information at the right time. Motion should be used help navigate complex challenges, and clearly communicate to the user an element’s resistance, dynamism, and path.

How to use motion with meaning

Motion can play an integral part to the overall feeling and functionality of any digital experience. It conveys energy, drawing inspiration from forces like gravity and friction.

Just as objects in the real world don’t come to abrupt stops or instantly speed up, motion should respond to the user’s input without missing a beat. Motion should feel natural, with elements gaining velocity or easing into a resting state by following an arc rather than a straight path.

We’ve developed four principles of motion to help designers and developers implement effective motion design:

  • Make it responsive – motion should quickly respond to user input precisely where the user triggers it.
  • Keep it natural – any movement should mimic natural movement inspired by forces in the real world.
  • Make it aware – motion should be aware of its surroundings, including the user and other objects around it. It can be attracted to elements and respond appropriately to user intent.
  • Always intentional – motion should guide focus to the right spot at the right time.