helios-skills

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.

Safety Notice

This listing is imported from skills.sh public index metadata. Review upstream SKILL.md and repository scripts before running.

Copy this and send it to your AI assistant to learn

Install skill "helios-skills" with this command: npx skills add BintzGavin/helios-skills/skills/getting-started

Helios Skills Collection

This repository contains agent skills for Helios, a browser-native video engine for programmatic animation and rendering.

Installation

This is a collection repository containing multiple skills. To use these skills, install individual skills by their path:

# Getting started
npx skills add BintzGavin/helios-skills/skills/getting-started

# Core skills
npx skills add BintzGavin/helios-skills/skills/core
npx skills add BintzGavin/helios-skills/skills/renderer
npx skills add BintzGavin/helios-skills/skills/player
npx skills add BintzGavin/helios-skills/skills/studio

# Workflows
npx skills add BintzGavin/helios-skills/skills/workflows/create-composition
npx skills add BintzGavin/helios-skills/skills/workflows/render-video
npx skills add BintzGavin/helios-skills/skills/workflows/visualize-data

# Guided video creation
npx skills add BintzGavin/helios-skills/skills/guided/motion-design-rules
npx skills add BintzGavin/helios-skills/skills/guided/promo-video
npx skills add BintzGavin/helios-skills/skills/guided/explainer-video
npx skills add BintzGavin/helios-skills/skills/guided/product-demo
npx skills add BintzGavin/helios-skills/skills/guided/testimonial-video
npx skills add BintzGavin/helios-skills/skills/guided/launch-announcement
npx skills add BintzGavin/helios-skills/skills/guided/social-clip

# Framework examples
npx skills add BintzGavin/helios-skills/skills/examples/react
npx skills add BintzGavin/helios-skills/skills/examples/vue
npx skills add BintzGavin/helios-skills/skills/examples/svelte

# Animation libraries
npx skills add BintzGavin/helios-skills/skills/examples/gsap
npx skills add BintzGavin/helios-skills/skills/examples/framer-motion
npx skills add BintzGavin/helios-skills/skills/examples/threejs

Available Skills

Getting Started

  • skills/getting-started - Installation and quick start guide. Covers package installation, requirements (Node.js, FFmpeg), basic setup, and initial composition structure. Use when setting up a new Helios project.

Core Package Skills

  • skills/core - Core API for Helios video engine. Covers Helios class instantiation, signals, animation helpers, and DOM synchronization.
  • skills/renderer - Server-side rendering of Helios compositions to video files.
  • skills/player - Embeddable video player with composition playback and controls.
  • skills/studio - Visual editor for Helios compositions.

Workflow Skills

  • skills/workflows/create-composition - Workflow for creating a new Helios composition.
  • skills/workflows/render-video - Workflow for rendering compositions to video.
  • skills/workflows/visualize-data - Workflow for data visualization animations.

Guided Video Creation Skills

  • skills/guided/motion-design-rules - Motion design framework: anti-slideshow architecture, visual layering, physics-based easing, choreography, and quality validation. Referenced by all guided video skills.
  • skills/guided/promo-video - End-to-end promotional / hype video. High energy, beat-synced, CTA-driven.
  • skills/guided/explainer-video - Explainer / walkthrough video. Narrative arc, section headers, measured pacing.
  • skills/guided/product-demo - Product demo / showcase. Feature callouts, UI zoom-ins, progressive reveals.
  • skills/guided/testimonial-video - Social proof / testimonial video. Quote typography, customer branding, trust signals.
  • skills/guided/launch-announcement - Product launch / release announcement. Countdown motifs, dramatic reveal.
  • skills/guided/social-clip - Short-form social clip (Reels/TikTok/Shorts). Vertical 9:16, punchy, loop-friendly.

Framework Integration Skills

  • skills/examples/react - React integration patterns
  • skills/examples/vue - Vue integration patterns
  • skills/examples/svelte - Svelte integration patterns
  • skills/examples/solid - Solid.js integration patterns
  • skills/examples/vanilla - Vanilla JavaScript patterns

Animation Library Skills

  • skills/examples/gsap - GSAP animation integration
  • skills/examples/framer-motion - Framer Motion integration
  • skills/examples/lottie - Lottie animation playback
  • skills/examples/threejs - Three.js 3D scenes
  • skills/examples/pixi - PixiJS 2D graphics
  • skills/examples/p5 - p5.js creative coding

Data Visualization Skills

  • skills/examples/d3 - D3.js visualizations
  • skills/examples/chartjs - Chart.js animated charts

Rendering Technique Skills

  • skills/examples/canvas - Canvas 2D rendering
  • skills/examples/signals - Reactive signals patterns
  • skills/examples/tailwind - Tailwind CSS styling
  • skills/examples/podcast-visualizer - Audio visualization

When to Use

Use these skills when:

  • Creating programmatic video compositions
  • Working with browser-native animations (CSS, WAAPI)
  • Building video rendering pipelines
  • Integrating Helios with React, Vue, Svelte, or other frameworks
  • Using animation libraries like GSAP, Framer Motion, or Three.js
  • Creating data visualizations as video
  • Setting up Helios development workflows

Repository

View all skills and source code at: https://github.com/BintzGavin/helios-skills

Source Transparency

This detail page is rendered from real SKILL.md content. Trust labels are metadata-based hints, not a safety guarantee.

Open in GitHubOpen in ClawHub

Related Skills

Related by shared tags or category signals.

Coding

Markdown Lint

Use this skill immediately when the user needs to: set up markdownlint-cli2 and pre-commit hooks in a repository, fix or batch-repair markdownlint errors lik...

Registry SourceRecently Updated
1660niracler
Coding

Code Sync

Use this skill to batch-sync all git repos across machines — pushing uncommitted changes at end of day or pulling latest at start of day. Invoke when the use...

Registry SourceRecently Updated
1460niracler
Coding

Workspace Init

Use this skill to initialize or update a multi-repo workspace created from dev-config-template. Invoke whenever the user wants to: set up a fresh workspace c...

Registry SourceRecently Updated
1390niracler
Coding

GitHub Issue Auto Triage

自动分类 GitHub Issue，AI 打标签、分配负责人、检测重复、回复 FAQ

Registry SourceRecently Updated
00SxLiuYu