May 16, 2021

Use animation to engage & draw attention

Motion makes a page feel more alive. Use simple animations to create intrigue without distracting from your message.

When motion is overused, it can become a distraction. When used correctly, animation can draw attention to areas where you want to make the most impact.

In the above example from Real Thread, you're greeted with a simple page load animation that introduces the brand (in the navigation), drops the main heading into the frame (telling what they do), then finishes with the calls-to-action fading in.

Nothing is ever really still in the world around us. Experiences with subtle movements feel natural, creating a much more interesting experience that just feels right.

But don't go overboard. Uncoordinated motion from all directions can overwhelm visitors. The ideal experience would resemble a peaceful walk in the park rather than a jog through Times Square.