animejs

Register Anime.js animations with autoplay disabled for HyperFrames seek-driven control.

1|Updated Jan 23, 2026
One-click install
npx skills add https://github.com/vs4vijay/vibecoding --skill animejs-vs4vijay
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: animejs
Source: https://github.com/vs4vijay/vibecoding/tree/main/video-hyperframes/.agents/skills/animejs
Command: npx skills add https://github.com/vs4vijay/vibecoding --skill animejs-vs4vijay

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill enables HyperFrames to integrate and control Anime.js animations, ensuring seek-driven and deterministic motion within compositions.

Core Features & Use Cases

  • Animation Integration: Allows creation and registration of Anime.js animations and timelines during HyperFrames composition initialization.
  • Seek-Driven Control: Facilitates synchronization of animations with HyperFrames time, enabling precise control over playback.
  • Use Case: Use this Skill to embed SVG or DOM animations in HyperFrames, making them controllable and reproducible within interactive presentations or demos.

Quick Start

Use the animejs Skill to register an Anime.js animation and control it via HyperFrames seeking capabilities.

Frequently Asked Questions about animejs

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I control Anime.js SVG animations with seek playback?

To control Anime.js SVG animations with seek playback, you create animations with autoplay disabled, register them on window.__hfAnime, and drive them using HyperFrames time for deterministic visual effects.

What is seek-driven deterministic animation in interactive compositions?

Seek-driven deterministic animation synchronizes visual effects with a timeline, ensuring precise and reproducible playback control over SVG and DOM elements within interactive presentations or demos.

Can I use infinite looping Anime.js timelines in HyperFrames?

You cannot use infinite looping Anime.js timelines in HyperFrames. This integration supports basic animation patterns with finite durations and loop counts to ensure consistent and deterministic seek playback.

How do I integrate DOM animations into HyperFrames compositions?

To integrate DOM animations into HyperFrames compositions, initialize the Anime.js animations during composition setup, register them on the window.__hfAnime object, and control them via HyperFrames seeking capabilities.

Does HyperFrames support Anime.js animation integration natively?

HyperFrames supports Anime.js animation integration through this Skill by requiring animations to have autoplay disabled and registering them on window.__hfAnime to enable seek-driven control over SVG and DOM elements.