Stix — AI skill for Claude Code

/stix

A coding-agent skill that generates stick figure animations from natural language prompts.

/stix "a person waving hello"

Outputs: `.stix/output/animation.gif` + `.stix/output/animation.mp4`

Installation

Via npx skills (recommended)

npx skills add bassimeledath/stix

Via npm

npx @bassimeledath/stix

Manual

# Claude Code
git clone https://github.com/bassimeledath/stix ~/.claude/skills/stix

# Codex
git clone https://github.com/bassimeledath/stix ~/.codex/skills/stix

# Other agents
git clone https://github.com/bassimeledath/stix ~/.agents/skills/stix

Dependencies

• A supported AI coding agent CLI (claude, codex, or set STIX_AGENT_CLI)
• agent-browser — headless browser for screenshot capture
• ffmpeg — frame stitching

Agent Configuration

stix auto-detects your agent CLI. Override with:

# Use a specific agent
export STIX_AGENT_CLI="codex --quiet --full-auto"

# Custom agent with env vars to unset
export STIX_AGENT_CLI="my-agent --pipe"
export STIX_AGENT_ENV_UNSET="MY_AGENT_PARENT_SESSION"

How It Works

stix uses an **asset-first pipeline** inspired by animation studios: characters, backgrounds, and props are generated as reusable SVG assets upfront, then scenes are composed by positioning and animating those shared assets. This guarantees visual consistency across scenes.

1. Parameter inference — parses your prompt to determine scene count, mood, FPS
2. Story decomposition — breaks the prompt into scenes with an asset manifest and per-scene position contracts
3. Asset generation — parallel workers create reusable SVG assets (characters, background, props)
4. Asset validation — each asset is rendered and screenshotted for visual inspection
5. Scene composition — parallel workers read shared assets, position them with translate(), and add CSS @keyframes
6. Visual QC — ev