Huashu Motion: Editable Launch Videos

About this Skill

Describe your product or explain a topic to your coding agent. Huashu Motion guides it through visual directions, a rhythm plan, editable animation code, local music and sound effects, and a browser studio where you can comment on an exact frame. A project is an HTML composition rendered through your installed Chrome-family browser. The primary deliverable is a video, with editable source retained for revisions.

Why we picked it

Combines product-specific direction, editable animation code and frame-level feedback. The cover is the author’s official launch-film opening; rendering runs locally with your own browser and FFmpeg.

What it helps with

• Product launches, feature announcements and software demonstrations.
• Animated explanations and data stories with editable titles, values and timing.
• Talking-head overlays, captions and alternate aspect ratios for an existing edit.

From product brief to video

1. Describe the subject and output

   Provide the product URL or source material, audience, duration and aspect ratio. Decide whether to use music only, generated narration or your own recording.

2. Review directions and rhythm

   The Skill asks the agent to show distinct directions with real keyframes, then write a treatment and rhythm sheet before building the complete animation.

3. Edit the exact frame

   Open the local studio, edit exposed values or press C to leave a comment. The agent receives its time, scene and target element; changes retain a local revision history.

4. Check and export

   Inspect sampled frames, render the composition with sound, then review the complete film. Keep the HTML project with the exported video for further revisions.

Official repository and installation guideOfficial Huashu Motion Skill instructions

Install and start a project

The standard installer adds the Skill and its references to your selected agent. The om launcher can use the npm runtime, so installation is more than copying one Markdown file. In a full checkout, node cli/om.js runs the same commands directly.

Official repository and installation guideOfficial Huashu Motion Skill instructionsOfficial runtime launcher

Outputs, preview and practical limits

The author documents MP4, transparent MOV/WebM, GIF, alternate aspect ratios and an HTML sharing page. Use supplied footage for real people or live-action material; this is a code-driven animation workflow.

Local soundtrack generation does not require a paid music API. Review the final audio yourself: the agent can inspect score and signal measurements, but cannot replace listening. Output quality depends on the agent, model, brief and review.

The cover is the author’s official hero.gif opening, compressed to an animated WebP for this listing. It is a short silent excerpt; the upstream README links to complete films with sound.

Official repository and installation guideAuthor’s original animated coverMIT license and character exceptionThird-party component licenses

Before you use it

• A Skills-compatible coding agent with local files and shell access. Install with the author’s npx command; the Skill launcher uses the bundled CLI in a checkout or the huashu-motion npm package.
• Node.js 22 or newer, an installed Chrome/Chromium/Edge browser, and FFmpeg with ffprobe. The author reports testing on macOS; other systems require their own validation.
• Optional sampled instruments download about 55 MB. Optional Kokoro narration needs uv, Python 3.12 and a voice model; word alignment uses whisper-cli. System speech is available on macOS.
• The Skill is free and its code and documentation are MIT-licensed. Agent/model usage may cost money. Third-party components keep their licenses; the author’s cartoon character is restricted to this project’s demonstrations.

Supported agents