MADE TO MOVE.
MADE TO THINK.

What was preserved

Claude's original Motion Lab archive contributed 20 technique definitions across entrance, feedback, spatial and storytelling categories, code starter examples, purpose descriptions, reduced-motion notes and an early PDF. This rebuilt edition keeps that educational core and corrects its rendering, scheduling, controls and documentation.

What was changed

• Pattern demonstrations now render inside the actual visible canvas, using a virtual coordinate system scaled to fit.
• One requestAnimationFrame loop draws visible canvases; offscreen demos are not continuously redrawn.
• The loop stops when the page is hidden, when manual focus or pause is enabled, and when the system prefers reduced motion.
• The on-screen FPS is calculated from observed callback counts over elapsed time. It is neither a promise of 60 FPS nor a comprehensive performance benchmark.
• Presets, search, filters, a recipe builder, copy controls, pause/resume and focus are interactive.
• A newly written 18-page field guide replaces the earlier PDF, which was incorrectly advertised as 20 pages.

Accessibility notes

Motion Lab uses semantic headings, native controls and strong focus styling. The graphical pattern demonstrations have written explanations of purpose and alternate still states. Focus Mode is an additional manual option. It has not been formally audited for WCAG conformance or verified with every browser, assistive technology or motion sensitivity profile.

W3C WAI — Understanding 2.2.2 Pause, Stop, Hide — understanding controls for moving or auto-updating content.

W3C WAI — Understanding 2.3.3 Animation from Interactions (AAA) — interaction-triggered nonessential motion and disabling it.

MDN — prefers-reduced-motion — browser and system motion preference.

Performance and implementation references

MDN — Intersection Observer API supports visibility-aware scheduling. MDN — Page Visibility API supports pausing when the tab is hidden. MDN — requestAnimationFrame supports frame-aligned scheduling. These are implementation references, not claims about the observed speed of all devices.

Copyable code caveat

The 20 original snippets are deliberately labeled starter snippets, not ready-made components. Some illustrate an animation principle and still need selectors, DOM state, or explicit labels to be useful in production. The motion recipe builder generates a self-contained style pattern with a reduced-motion override, but assumes you wire the is-active class to your own component.

Attribution & privacy

Concept, editorial direction and visual design: Sahil Tayal / Sahilverse. Source archive initially generated with Claude and extensively reworked here. There are no analytics or external trackers shipped in this site. The recipe selections stay in the browser session; no user inputs are transmitted to a server by the provided code. Outbound links open other independently maintained sites, whose privacy practices may differ.

Related-world URLs for Synth and Angry originate from the creator's project map but could not be independently fetched with the browsing tool during preparation. The main Sahilverse and Out of the Garage entrances were observed publicly. Verify external URLs after deployment.

Report a real issue

Clicking something that does nothing is a bug, not “conceptual art.” Send a Motion Lab bug report with browser, device, affected control and what happened.