Collection of agent skills for Helios video engine. Use when working with programmatic video creation, browser-native animations, or Helios compositions. Install individual skills by path for specific capabilities.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Core API for Helios video engine. Use when creating compositions, managing timeline state, controlling playback, or subscribing to frame updates. Covers Helios class instantiation, signals, animation helpers, and DOM synchronization.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Installation and quick start guide for Helios video engine. Use when setting up a new Helios project, installing packages, or creating your first composition. Covers package installation, requirements, basic setup, and initial composition structure.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Player API for embedding Helios compositions in web pages. Use when you need to display a composition with playback controls, enable client-side exporting, or support Picture-in-Picture.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Renderer API for generating video/image output from Helios compositions. Use when you need to programmatically render a composition to a file using Node.js.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Studio tool for developing and previewing Helios compositions. Use when you want to launch the interactive development environment or manage assets.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Story-first motion design philosophy for animated video: motion must earn its place; arc (establish, complicate, resolve); show vs tell; shots as units of thought; quiet vs loud motion; Disney principles with restraint; timing heuristics; composition; grammar by medium (product demos, logos, data viz, explainers); technical commitments (deterministic time, scrubbability, refs); cutting discipline; explicit anti-patterns. Use when planning, storyboarding, critiquing, or implementing programmatic or motion-driven video (Helios, Remotion, explainers, loops, UI capture, logo reveals), or when the user asks for motion direction, pacing, or visual-story structure.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
End-to-end production plan template for feeling-first cinematic product promos: brief interrogation, 45s beat structure (cold open through brand), hero-element metaphor, storyboard fidelity ladder, visual system (palette, type, camera, texture), motion mix and easing vocabulary, audio and captions, tooling (animatic through HTML or AE), deliverables matrix, accessibility, review milestones, and compromises to accept or refuse. Use when planning, pitching, storyboarding, or producing polished brand films for any SaaS or consumer product—not category-specific; pair with skills/design/animated-video-philosophy for broader motion principles.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Opt-in library of established visual styles for code-drawn Helios videos: style cards (colour rules, type, motion grammar, a checkable signature list, the core rendering trick) with tested renderAt(t) demo pages, plus finishing passes and time tricks. Load it only when the user names a specific established style or medium they want reproduced (a print process, a retro screen look, a design movement), or asks to see Helios's style options. Do not load it to choose a look for a video request that names no style: design an original look instead, and at most offer this library.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with Vanilla Canvas API. Use when building high-performance 2D/3D animations without frameworks.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Chart.js integration patterns for Helios. Use when creating animated data visualizations with Chart.js.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Learn how to use D3.js with Helios for data visualization. Use when creating charts, graphs, or data-driven animations.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with Framer Motion. Use when you want to use Framer Motion's physics and transitions but need frame-perfect synchronization with Helios.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with GSAP (GreenSock). Use when integrating GSAP timelines with the Helios timeline for precise scrubbing and rendering.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Lottie integration patterns for Helios. Use when rendering Lottie (Bodymovin) JSON animations synchronously with Helios.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Learn how to use P5.js with Helios. Use when creating creative coding sketches or generative art.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
PixiJS integration patterns for Helios. Use when creating high-performance WebGL 2D animations with PixiJS.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Workflow for creating a podcast visualizer with multi-track audio mixing and DOM-based synchronization. Use when building audio-reactive compositions.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with React. Use when building compositions in a React environment.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Learn how to use Helios Signals for high-performance, fine-grained reactivity. Use for complex dependency graphs or when optimizing performance.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with SolidJS. Use when building compositions in a SolidJS environment, utilizing signals for fine-grained reactivity.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with Svelte. Use when building compositions in a Svelte environment, utilizing Svelte stores for reactive frame updates.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Learn how to use Tailwind CSS with Helios. Use for styling compositions and animating with utility classes.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.
Patterns for using Helios with Three.js and React Three Fiber. Use when creating 3D animations or integrating WebGL scenes.
한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.