Huashu Motion: Editable Launch Videos

alchaincyf/huashu-motion

Make launch videos, motion graphics and explainers as editable HTML. Review frames in a local studio, leave targeted comments, and export with music and effects.

Contenido actualizado:

Ver en GitHub
npx skills add alchaincyf/huashu-motion
2659Estrellas265ForksÚltimo push del repositorio

Acerca de este Skill

Huashu Motion guides a coding agent in making product videos, explainers and motion graphics as editable HTML animation. A local studio lets the creator review frames and give specific feedback, while the project retains source code for later revisions. Rendering uses a locally installed Chrome-family browser.

Por qué lo elegimos

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.

Para qué sirve

  • 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.

ComandoPara qué sirve
npx skills add alchaincyf/huashu-motionInstall the official Skill for your coding agent.
npx huashu-motion doctorCheck Node.js, the installed browser and FFmpeg.
npx huashu-motion new my-filmCreate an editable starter composition.
npx huashu-motion studio my-film --no-openStart the local editor and print its address.
npx huashu-motion check my-filmCheck source and sampled frames before rendering.
npx huashu-motion render my-filmExport a versioned MP4 under my-film/out/.

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

What to provide for a video

Start with the product or topic, the audience, intended duration and destination. Supply real brand assets, screenshots and copy when they matter, then review the proposed direction and individual frames before export.

The output is generated animation with editable source, not a recording of a real product session. Music, narration, tool availability and any service charges depend on the chosen workflow and environment.

Official repository and installation guideReviewed upstream Skill

Antes de usarlo

  • 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.

Agentes compatibles

Claude CodeCodex CLICursorGitHub CopilotDeepSeek HarnessGemini CLIGrok BuildHermes AgentOpenCodePiKiroRovo DevQoderMistral VibeGoogle Antigravity

Preguntas frecuentes

Does it generate live-action footage?

No. It builds editable code-based compositions and can combine assets you provide. Supply your own footage when real people or live action are needed.

Where does rendering happen?

On your machine using the installed browser and FFmpeg. Optional models and samples may require downloads; agent/model providers may charge for usage.

Fuentes y referencias

Las fuentes originales se enlazan a continuación. Los puntos de partida prácticos son sugerencias editoriales de SkillHey.