Pointer-driven motion should be bounded, smoothed only as much as needed, and designed with touch and reduced-motion behavior in mind.

Root input types

• The root inputs[] union supports mouse, mouseVelocity, time, distance, scroll, drag.
• mouse writes an axis value to a parameter, with optional normalize, elementSelector, invert, and smooth.
• mouseVelocity writes pointer speed with optional maxVelocity, absolute, centered, smoothing, decayFactor, and elementSelector.
• distance maps pointer distance from a circle, rectangle, polygon, point, or element shape into a parameter.
• drag uses elementSelector, optional axis, inertia, throw resistance/duration, snap points, bounds, drag range, axis lock, and trigger.

Interaction rules

• Scope Canvas-only interactions to the Canvas mount so page scroll and rendered-object interaction do not fight.
• Hover-only effects need a touch fallback or a stable non-hover visual state.
• Drag should not block page scroll unless the section intentionally owns that gesture.

Debug checks

• Use debug.nodes({ type: "pointer" }) or nearby input node filters to inspect live values.
• Use debug.inspect(selector) when a DOM interaction should target an element.
• For physics drag, watch PHYSICS_MOUSE_DRAG_NO_MATCH and body reference errors.

Verified runnable example

This guide points to proof-backed sample coverage. The full ledger lives in Generated examples and proof log.

DOM: Scroll fade reveal

• Source: faster-motion/demo/tests/dom/catalog/scroll-animations/fade-reveal/fade-reveal.domgraph.fmtion
• Expected output: Sections fade and translate into place as their trigger elements enter the configured viewport range.
• Validation: Schema validation passed. Runtime proof reports zero structural/runtime issues and 17 loaded nodes.
• Desktop proof: generated-assets/faster-motion-docs/proofs/screenshots/dom-fade-reveal-desktop.png
• Mobile proof: generated-assets/faster-motion-docs/proofs/screenshots/dom-fade-reveal-mobile.png

Guide-specific sample target: Pointer sample with normalized X/Y parameters, one hover gate, one drag bound, and mobile fallback proof.

Faster Motion docs

Use this local map together with the left navigation. The source-backed content tree controls the main article order; this section keeps related pages one click away.

Start

• Faster Motion docs map
• Faster Motion documentation overview
• Get started with Faster Motion
• Faster Motion concepts
• .fmtion file format

DOM animation

• DOM animation guide
• DOM selectors and targets
• Scroll animation
• Pointer, hover, and drag inputs
• Text, SVG, and path animation
• Responsive gates and parameter overrides

Canvas animation

• Canvas animation guide
• Canvas area lifecycle
• Canvas objects, assets, and rendering
• Canvas inputs and state machines

3D and procedural

• Canvas 3D and procedural guide
• 3D scenes, cameras, and lights
• Procedural geometry and fields
• Particles and physics

Reference

• Node reference index
• Node categories reference
• Runtime loading and publishing
• Runtime API reference
• Debugging and preflight
• Debug API reference
• Validation errors and warning codes
• Faster Motion production checklist
• Faster Motion recipes overview