Who this is for: Designers animating a cursor over supplied product screens.
What to prepare
- Verified control sequence
- Screens with stable target positions
- Chosen cursor asset or captured pointer
- A timing pass with target holds
Map the action before the path
List the controls a task genuinely uses. A cursor should explain that sequence, not visit attractive interface areas. Record where each control is before deciding how the pointer travels. If a panel moves after activation, use the new coordinates from the resulting state.
Choose one pointer style and scale for the composition. Keep it distinguishable from selected controls without making it the largest object on screen. Remove any captured pointer if a separate animated one will be added; two pointers create an ambiguous actor.
Illustrative path: assign a sample request
For a fictional request tool, follow R-031 from Unassigned to Example reviewer. The following is an editorial timing plan, not a recorded performance measurement. Use supplied screens to confirm the actual menu and save behavior.
- 0–3 seconds: cursor rests in a neutral margin while the request identifier and Unassigned field remain readable.
- 3–5 seconds: move directly to Owner; stop before activation so the destination is clear.
- 5–8 seconds: open the menu, then hold while the available names become legible.
- 8–11 seconds: move to Example reviewer and select it once. Show only the real selection feedback.
- 11–15 seconds: if required, move to Save and activate. Then park the pointer away from the updated owner field so it can be inspected.
Edit unnecessary movement
A rough recording may include a circle over the field, a detour to the sidebar and a corrective movement back to Save. Remove those paths if they convey no useful uncertainty. Retain the pause before choosing the reviewer: it separates finding the control from making the decision.
Avoid oversized click ripples that obscure the label. A brief activation cue can help if it is clearly a production annotation, but it must not resemble a product confirmation. Cursor motion and successful saving are different pieces of evidence.
Adapt for crops and touch demonstrations
Recheck the full path after zooming or changing aspect ratio. A pointer that arrives correctly in the source image can miss its target in a transformed composition. Hold the camera during the consequential click unless the target remains unambiguous.
For a touch task, use the product’s actual touch interaction as reference and a restrained tap marker if needed. Do not insert a desktop cursor into a mobile example merely because the motion preset exists.
Review checklist
- Each movement leads to a required control.
- The target label can be read before activation.
- The pointer does not cover confirmation text.
- No extra cursor remains in the supplied screenshots.