Motion design craft / Guide

Use spacing to structure motion scenes

Use spacing to show which elements belong together before animating them. A clear static arrangement gives motion a structure to reveal instead of forcing movement to explain every relationship.

By AnimroUpdated 3 min readAI-assisted · independently agent-reviewed

Who this is for: Motion designers, content producers and creative reviewers.

What to prepare

  • Elements and their actual relationships
  • Parent-child or peer grouping rules
  • Longest labels and required reference notes
  • Wide and compact composition sizes

Draw three arrangements of the same material

Use an illustrative diagram with one heading, three method steps and a note about the whole method. The crowded arrangement packs all five elements into the center. The evenly spaced arrangement distributes them across the frame with identical gaps. The relationship-based arrangement places the three steps together, the heading above that group and the note beneath the whole group.

Keep wording, size and color constant for this comparison. Otherwise the spacing exercise becomes a test of several variables at once. Ask which elements appear to belong together and whether the note seems attached to one step or to all three.

Mark the intended groups

Draw a temporary boundary around the three steps and a larger boundary around the complete explanation. Specify an internal gap between peers and a larger separation between different roles. The exact measurements depend on the composition; the useful rule is the relationship between gaps, not a universal number.

In the illustrative revision, place the note below the group’s full width rather than directly under the third step. That makes its ownership clearer. Keep the heading close enough to introduce the group but far enough that it does not look like a fourth process step. Record these choices in a spacing worksheet.

Animate groups without breaking their meaning

Reveal the group boundary or whole arrangement first, then emphasize the steps in order. If a step moves outside its group during emphasis, retain a connector or another clear ownership cue. A label traveling across the frame can accidentally appear to join a different object.

For a new thought, move the completed group into a stable supporting region and reserve a clean region for the next idea. Do not squeeze the first group continuously while the second is being read. Complete the spatial change, then begin the next reading beat. This makes the composition change serve a narrative purpose.

Adapt by restructuring rather than shrinking

On a narrow layout, stack the three peer steps while keeping their labels aligned and their relationship explicit. The note still belongs beneath the complete group. The heading should not consume so much vertical space that the final step is forced outside the visible composition.

Inspect the longest label in every slot. If it breaks the grouping, widen the slot, approve a shorter label or adjust the structure. Recheck the final resting frame and the widest motion excursion. Useful spacing at rest can disappear during overshoot, so include the temporary paths in collision review. The final layout should remain understandable as a still image.

Review checklist

  • Group membership is clear before movement begins.
  • Peer gaps differ intentionally from role boundaries.
  • Labels retain ownership throughout motion.
  • Compact layouts are restructured around relationships.
Explore motion design craft ↗