motion-design

Turn a product, website or idea into a complete motion film.
Choose a look. Adapt the prompt. Generate with Higgsfield.

Codex + Claude Code   /   10 motion styles   /   One shared skill

Get started   ·   Explore the looks   ·   Setup guide   ·   How it works

The motion library

From glass interfaces to product reveals, start with a visual direction you can actually watch. Click any image to play its source film.

Glass UI launch Software & product launches	Tropical product Products & ingredients	Kinetic typography Announcements & animated type
Blueprint to building Architecture & property	Exploded product Hardware & component reveals	Flat vector explainer Apps & simple explanations

Explore four more styles — hyper-motion, hybrid 2D + 3D, collage and footage

Product hyper-motion Food & product assembly	Hybrid 2D + 3D Playful brand stories
Editorial collage Ideas & educational shorts	Footage + graphics Presenters & existing footage

_{These are Higgsfield source examples that the skill adapts, not new results generated by this package. Source attribution.}

Open the playable gallery locally to browse all ten styles, inspect their original prompts and copy a request for your app. You can also develop an original concept.

Quick start

Install the same skill in either app, then connect your own Higgsfield account for media generation. Browsing and prompt drafting work before you connect.

Codex

Paste into Codex:

$skill-installer

Install the skill from:
https://github.com/cth9191/motion-design/tree/main/skills/motion-design

Claude Code

Paste into Claude Code:

Install the skill from https://github.com/cth9191/motion-design.
Copy skills/motion-design into ~/.claude/skills/motion-design.
If it already exists, compare it, back up local customizations, and update it.

Connect Higgsfield using the setup guide. It includes Claude Code's MCP command, authentication and a read-only access check. Generation requires model access and credits or an applicable allowance.

Make your first film

Start with $motion-design in Codex or /motion-design in Claude Code, then add:

Use the kinetic typography preset for a 15-second announcement:
"Build your first AI workflow."
Use music and synchronized effects, without narration.
Show me the complete adapted prompt before generating anything.

Review the draft, then ask it to generate. A prompt-review request stops before images, uploads and video jobs; production can incur Higgsfield charges.

Show me the available motion-graphics styles with playable examples.

Use the website I provide to propose a 15-second promo.
Choose a suitable preset and focus on one main product benefit.
Show me the complete adapted prompt before generating anything.

Use the flat vector explainer preset for a beginner-friendly,
15-second explanation of how an LLM generates an answer.
Use music and synchronized effects without narration.
Show me the full adapted prompt before generating anything.

Use the tropical product preset to make a 15-second film for the
product photo I attach. Keep its packaging recognizable.
Use instrumental music and sound effects, with no narration.
Generate the complete film and inspect the result.

How it works

Choose → Adapt → Generate → Review

The skill starts from the closest example's complete original prompt and the takeaway your viewer should leave with. It retains the source's effective visual and motion techniques while adapting scenes, sequence, timing and transitions to your subject. The resolved timed sequence is submitted as one complete film through Higgsfield MCP.

Bring your own video: a supplied clip defaults to a new generation guided by its sequence, framing, timing and camera moves, with your message fitted into those beats. It uses video-reference conditioning and compares the result against the actual source. Editing existing footage is a separate request. Ask for loose inspiration when you want more freedom. See video references.

References are optional. A product photo can help preserve identity; a style frame can clarify appearance. Typography or abstract motion may need no images. After generation, the assistant checks the actual motion, product relevance, exact copy, audio and ending, then identifies any corrections needed.

New campaigns generally target 15 seconds · 16:9 · music + effects, without narration, and a 30fps delivery. Native fps and supported durations depend on the model. Portrait product and supplied-footage presets have their own starting settings; your choices take precedence. See tool routing for live model checks and asset handoff.

Under the hood

The package includes ten source examples, archived prompts with verified hashes, separate adaptation guides, a playable gallery and production review guidance. Both apps use the same skill folder.

python skills/motion-design/scripts/build_gallery.py