Good animation is invisible. You shouldn't notice that you're looking at it. Animation must improve the usability, feel natural and subtle, and give feedback to the user. Be sure to hand pick only the most useful animations, and spend the time to get it just right — all in the interest of improving the user experience.

Be Contextual

The connection between an input event and on-screen action should be visually represented to tie them together.

Products that practice responsive interaction produce timely, logical, and delightful screen reactions for their users. Each interaction is thoughtful, perhaps whimsical, but never distracting. Responsive interaction encourages deeper exploration of a product.

Be Informative

Use clear, smooth, and simple animations to guide the viewer through the page and to help them navigate transitions.

Motion design can effectively guide the user’s attention in ways that both inform and delight. Use motion to smoothly transport users between navigational contexts, explain changes in the arrangement of elements on a screen, and reinforce element hierarchy.

Be Delightful

Be sure to go the extra pixel

Delight with an interaction corresponds to an actor having charisma. The important thing is that the viewer feels the interaction is real and interesting. When an interaction connects better with the user; for likable characters a symmetrical or particularly baby-like face tends to be effective. A complicated or hard to read face will lack appeal...