Registers Anime.js animations as seek-driven instances inside HyperFrames compositions.
npx skills add https://github.com/gmolike/Claude-Template --skill animejs-gmolike
Please help me install this Agent Skill. Skill: animejs Source: https://github.com/gmolike/Claude-Template/tree/main/.agents/skills/animejs Command: npx skills add https://github.com/gmolike/Claude-Template --skill animejs-gmolike
window.__hfAnime so HyperFrames controls the clock via instance.seek(timeMs). - Deterministic Patterns: Enforce autoplay: false, finite durations, and synchronous creation during composition initialization. - Use Case: You found an Anime.js example with a rotating, fading element. Use this Skill to translate it into a HyperFrames-safe composition that renders identically at every seek position. ## Quick Start Convert my Anime.js animation into a HyperFrames composition with autoplay disabled and the instance registered on window.__hfAnime.High-intent search queries and answers about installing and using this skill.
Create the Anime.js animation synchronously during composition initialization with autoplay set to false, then push the returned instance onto window.__hfAnime. HyperFrames will drive it by calling instance.seek(timeMs) with its own clock.
GSAP is the primary HyperFrames authoring path and is preferred for complex scene sequencing. Use Anime.js for small SVG and DOM flourishes, compact syntax, or when translating existing Anime.js examples into seek-driven compositions.
Yes, the adapter works with any build as long as the returned object exposes seek() and pause(), and preferably play(). You can import animate from the animejs ESM CDN and register the instance the same way.
The usual causes are leaving autoplay at its default, relying on anime.running auto-discovery instead of pushing to window.__hfAnime, or using infinite loops and wall-clock callbacks. Set autoplay false, register explicitly, and use finite durations.
Yes, timelines built with anime.timeline work the same way as single animations. Set autoplay false on the timeline, add your keyframed segments, and push the timeline object onto window.__hfAnime for seeking.
KamalabotAdapt Anime.js animations to HyperFrames' seek-driven playback via window.__hfAnime registry.
chmonitorTranslate Remotion React compositions into HyperFrames HTML and GSAP timelines.
automatedigitalOverride Anime.js wall-clock playback for seek-driven HyperFrames timeline control.
chmonitorCompose deterministic GSAP timelines from atomic motion rules and scene blueprints.