Free

Free coded apps to suit all. No sign up, no email, usable offline, updates when I can, feedback welcome. Send feedback

How-to

Drawing motion paths on the preview in Video by Zaweba

See an animated position drawn as a path on the Video by Zaweba preview, drag its points to reshape the move, and add animate in and out and motion blur.

Drawing motion paths on the preview in Video by Zaweba

Numbers are a clumsy way to describe movement. Typing X and Y values for a picture's position at each key works, but it is hard to picture the result. Video by Zaweba draws the movement on the preview instead, as a motion path, so you can see where a picture goes and change its route by dragging.

What the motion path shows

When a clip's position is animated, the preview shows its path as a line, with a point for each keyframe. You can see at once where the picture starts, where it goes and where it ends.

Drag a point to move it. The key's position changes, and the path updates to show the new route. It is the most direct way to adjust a move: you put the picture where you want it on the frame, rather than nudging numbers until it looks right.

Building a move

Set a key on position at the start of the move, with the picture where it should begin. Move the playhead to where the move should end, drag the picture to its final place on the preview and make sure a key sits there too. The path appears between the two points.

To make the path go via another spot, move the playhead to the middle, drag the picture there and key it, and a third point appears on the path. Adjust any point by dragging.

For a smoother journey, set eases on the keys and shape the speed in the keyframe graph, so the picture accelerates and slows naturally along its path.

Animate in and out

For common moves, you may not need to build keys at all. Animate in and out is available for any picture clip, and gives a clip an entrance and an exit. It is the quick way to bring a title, logo or photo on and off screen with movement, without setting up position keys by hand.

Real cameras blur things that move fast. Animated pictures without blur can look too crisp and a little artificial, especially on quick moves. Motion blur can be added to animated movement, softening the picture along its direction of travel. On a fast slide or spin, it makes the move feel much more natural.

Use it on quick moves, and leave it off slow ones, where it adds little.

Moves worth making

Picture in picture. Slide a small picture into a corner, hold, then slide it out. Drag the end point exactly into the corner on the preview.

Following something. Move a label or pointer along with an object in the shot by setting keys at a few moments and dragging the label to the object each time.

Map routes and diagrams. Move a marker along a route on a map image, with a key at each turn.

Titles. Bring a title in from off screen with animate in, add motion blur for a smooth swoop, and let it settle with an ease.

Zoom the preview in when you need to place a point precisely, and use the Hand tool to move round the enlarged picture.

Keep paths simple. Two or three points with good eases look better than many points that wiggle.

Check safe margins when a move ends near the edge, so the picture does not finish partly hidden.

Paths that misbehave

Dragging the picture without a key on position changes it for the whole clip. If you want a move, start by setting a key.

Adding too many points to fix a wobble usually makes it worse. Remove the extras and use the graph to smooth the speed instead.

Paths, graphs and lanes together

The motion path is one more view onto the same keys used by the Inspector, the keyframe graph and the rubber bands. Video by Zaweba lets you build a move by dragging on the preview, shape its timing in the graph and trim its keys on the timeline, so you can work in whichever view makes the job clearest.