All motion recipes

3D & backgrounds / CANVAS

Particle assembly

A field of points gathers into a word or a simple supplied silhouette.

Particle assembly, DKC reference still

DKC reference implementation; not an original creator video. You can play, pause, and inspect time in the reference.

Make it fit your project.

Your brief stays in this browser. Preparing a prompt does not send it to a server.

Build a twelve-second Canvas scene with a seeded field of 400 points. Sample target positions from a short word rendered to an offscreen canvas, assign each point a stable target, and interpolate from scattered positions to the silhouette with staggered timing. Hold the assembled form before returning.

Build and check.

  1. Confirm the supplied content, target environment, and required assets before implementing.
  2. Build a twelve-second Canvas scene with a seeded field of 400 points. Sample target positions from a short word rendered to an offscreen canvas, assign each point a stable target, and interpolate from scattered positions to the silhouette with staggered timing. Hold the assembled form before returning.
  3. Expose seek(t) so frames can be inspected deterministically; add play, pause, replay, and a reduced-motion still.
  4. Inspect the opening, midpoint, and final state at desktop and mobile sizes; report any dependency or output limitation.

Know the limits.

  • Use a supplied font and word. Avoid randomizing targets each frame or exceeding the point budget on mobile.
  • The prompt guides a coding agent; output quality depends on its implementation and review.

Want us to build it?

Send an optional project brief. We’ll receive your contact details, project description, and this recipe’s ID.

By sending this brief, you agree to our privacy policy. Prefer a conversation? Book a strategy call.

Catalog 2026-10-22.a82e12098f76 · Source revision sha256:dfbe6519cbc4fc84acc4cbf926d8a01c7f2e248dd46cedd67a9112b0e928c2ba