create-composition

What problem does it solve?

This Skill provides a repeatable workflow to bootstrap a Helios composition, eliminating manual setup when starting a new animation project or converting an existing one.

Core Features & Use Cases

• Bootstrap HTML/Canvas scaffolding: Create the standard composition.html and canvas setup.
• Helios Initialization & Binding: Initialize Helios and bind to the document timeline for playback and rendering.
• Conversion & Reuse: Streamline converting existing animations to Helios-compatible workflows across Browser, Player, and Renderer contexts.

Quick Start

Create a new composition by laying out a minimal HTML scaffold, import the Helios core, initialize a Helios instance with a basic timeline, bind it to the document, expose it to the window, and implement a simple render loop that subscribes to input state.