AI Skill MartBrowse skillsPromptsProgramsLearnWhat is a Skill?
← Back to list

huashu-motion

A director-grade skill that builds launch films, explainers and motion graphics as editable HTML + GSAP code and renders them to MP4/GIF.

Image & VideoAdvanced★ 2,522⑂ 255AI score 9/10Last updated: Oct 22, 2026

What it does

  • Treats one index.html (HTML + GSAP) as the film, rendered frame by frame through your own Chrome and exported to MP4/MOV/GIF/WebM.
  • Starts from the product's real material: om grab <folder|url> pulls screenshots, the actual logo file, images, and the colours and typefaces the site or repo really declares — never grey placeholders or invented UI.
  • Enforces a full directing pipeline: om learn (past preferences) → three distinct directions with real key frames and palette cards → a written treatment.md with a rhythm sheet and beat map → build the hardest shot first → verify with om check/om still/om qa → compose music (ABC score) and place SFX → hand over the studio → render → share GIF + post draft.
  • Runs a local studio on 127.0.0.1 where the user clicks the frame to comment; om inbox/om look show the exact frame and click spot so only that element changes, with every version kept in .om/history for om undo.
  • Exposes titles, key numbers, colours and hold durations as composition variables so users can tweak them without the agent.

Who it's for

  • Developers and solo founders who need a launch video or a looping README GIF for their own product.
  • Indie makers who want promo motion that doesn't look like a slide deck, without hiring a designer.
  • Product and marketing people producing UI demos, changelog films and explainers repeatedly.
  • Prerequisites: an installed desktop Chrome, the ability to run a local server, Node (npx); ffmpeg for spectrogram checks. Sandboxes that block browsers or local servers will break the visual-QA steps.

Examples

  1. A one-line request ("make a launch video for my project") → the skill reads the repo and site, grabs material, then sends a single message with its defaults for format (30 s 16:9 for X / 15 s 9:16 for shorts / looping README GIF), energy and narration, followed by three directions.
  2. You click a card in the live preview and write "hold this a beat longer" → the skill inspects that exact frame, changes only the timing variable, and reports "1.2s → 2.0s, everything after shifted 0.8s".
  3. For a launch film it writes its own ABC score fitted to the scenes, puts an SFX hit on each landing, enables motion blur for the final pass, and ships the MP4 plus a ≤10 MB share GIF and a draft post.

· · · Install guide · · ·

Try it now, no install

Paste this into Claude to use the skill without installing anything.

Read the instructions in this file and follow them to help me:
https://raw.githubusercontent.com/alchaincyf/huashu-motion/HEAD/skills/huashu-motion/SKILL.md

What I want: (describe your task here)

If Claude can't open the link, open it yourself and paste the contents instead.

↓ If it works for you, download the ZIP below and install it. Then it runs on its own — no pasting each time.

Install in the Claude app (no terminal)
  1. Download the ZIP with the button below.
  2. In Claude, open Settings → Capabilities and turn on 'Code execution and file creation'. (one time)
  3. Go to Customize → Skills → + → 'Upload a skill' and upload the ZIP.
↓ Download ZIP
Install in Claude Code

Let Claude do it — paste this into Claude Code

Install the skill I found on AI Skill Mart.
Copy the skills/huashu-motion folder from the GitHub repo alchaincyf/huashu-motion into my ~/.claude/skills/huashu-motion/.
When it's done, tell me in one line what this skill can do.

Install with a command instead

git clone https://github.com/alchaincyf/huashu-motion.git /tmp/huashu-motion && mkdir -p ~/.claude/skills && cp -r /tmp/huashu-motion/skills/huashu-motion ~/.claude/skills/

⚠ This is a third-party skill. Check the source repository before installing.

  1. Open a terminal and clone the repo: git clone https://github.com/alchaincyf/huashu-motion.git /tmp/huashu-motion
  2. Make sure the skills folder exists: mkdir -p ~/.claude/skills
  3. Copy the skill in: cp -r /tmp/huashu-motion/skills/huashu-motion ~/.claude/skills/
  4. Check prerequisites: desktop Chrome installed, Node.js available (so npx works), and ffmpeg if you want audio spectrogram checks.
  5. Restart Claude Code, then ask something like "make a launch video for my project" to trigger the skill.
  6. On first use run npx huashu-motion doctor (or <skill-folder>/bin/om doctor) to verify the environment.
  7. For previews, run om studio <project> and open the printed 127.0.0.1 URL — allow the local server and browser launch, otherwise the visual checks are skipped.