Motion is useful when it makes a relationship or change easier to understand. A circle drawing around a redundant label directs attention to the exact element being discussed. Items making room in an ordered list show where a dragged item will land. These movements answer questions the content or interaction already raises. An endlessly moving shape beside a paragraph may ask for attention without explaining anything about it. Before adding animation, decide what it will explain and how the result will remain clear after it stops.
Move only what helps explain the change.
When an item moves in an ordered list, nearby items can make room before it lands. That motion explains where the item will go. A decorative loop beside a paragraph explains nothing about reading the paragraph and may compete with it instead. In an illustrative reorder, moving the third item above the second should cause the second item to make room before the drop. A still view can also show the resulting sequence. In a Creative diagram, a brief underline can draw attention to the improved sentence, then stop so the reader can compare it with the earlier wording.
Give motion a beginning, a purpose, and an end. Keep the final state understandable without animation, and respect people who prefer reduced motion. On these Creative pages, a brief geometric transition introduces the visual idea, then leaves the reading still. The animation is not the lesson itself. If people cannot understand the connection without movement, improve the still diagram or the visible result of the interaction before adjusting the animation’s timing.
Put it into practice.
Choose the smallest movement that communicates the change. Give it a clear beginning and end, and leave the result still enough to read. Make the same information available when motion is reduced or absent. When someone moves an item or follows a control, show where it will go before they finish the action. For an illustration, direct attention to the part that supports the lesson rather than making the entire graphic move. Remove animation that adds no explanatory value.
What becomes easier to understand because this moves?