Brand Motion Design Skill — Design skill for Claude Code
Claude Code skill: showreel-grade brand motion videos (launch, promo, teaser.
How to install Brand Motion Design Skill
This entry records only its repository, not the path inside it, so there is no
exact command to give. Open ouerf-man/brand-motion-design-skill and copy the folder into
~/.claude/skills/, or the file into ~/.claude/agents/.
What Brand Motion Design Skill does
Claude Code skill: showreel-grade brand motion videos (launch, promo, teaser...) in code with HyperFrames + Three.js
Alternatives in Design
- Frontend Design — Create distinctive, production-grade frontend interfaces with high design quality 94.1k ★
- Studio — Launch the local design Studio — a live token editor over the latest extraction 3.6k ★
- Stitch Remotion — Generate walkthrough videos from app designs 2.6k ★
README
brand-motion-design
A Claude Code skill that turns any brand into a showreel-grade motion film, in code: a product launch, a feature spotlight, a promo or offer, a brand teaser, social proof, an event, a before/after or a product showcase, as an Instagram Reel, a TikTok or a launch video. Give it a **brand book**, a **codebase**, a **website URL**, or nothing but a few answers (every question has a "you choose for me" option), plus any logo, photos, screenshots or recordings you have, and it makes a fast, dynamic cut: lit Three.js scenes with glossy materials, bloom and particles, a camera cut every two beats, giant slammed type, a colour flip on every chapter, a viewfinder HUD, cut to a generated hip-hop or punchy beat. It renders with [HyperFrames](https://github.com/heygen-com/hyperframes) (HTML to video, Apache 2.0) and keeps the brand's own colours, fonts, logo, voice and claims.
Fast is the default: it never asks "calm or catchy?". A calm explainer is made only if you ask for one.
Based on [product-film](https://github.com/Rieranthony/product-film-skill) by Anthony Riera (MIT), ported from Remotion to HyperFrames and rebuilt around the showreel cut.
What's new in this edition
- For any brand, even without a brand book. No brand files? It asks a few questions with AskUserQuestion (colours, type, tone, audience), each with "You choose for me", and shows its picks as style frames.
- It remembers. The brand, your standing choices (format, music, tone, language) and your notes on each film live in
videos/BRAND.md; the next film reuses them and only asks what is new. - Nine video types. Launch, feature spotlight, promo / offer, brand teaser, social proof, event, before/after, product showcase, and an explainer on request, each with its own chapters and ending (
reference/video-types.md). - Your assets. Logo (SVG or PNG), product photos and cut-outs as lit 3D cards, screenshots, screen recordings, footage, your song or a voiceover (`refer
Related Skills
Motion Video Design
Product animation, UI motion, portfolio videos — Apple-grade reveals, motion tokens, full production pipelines
Vibe Motion
Vibe Motion is a "Vibe Coding" application for motion design video creation. It enables users to create profes
Video Talkcraft
Agent skill that turns Claude Code / Codex into a motion-design studio for narration videos — word-level voice
Ant Marketplace
Three focused workflow skills for Claude Code and Codex: implementation orchestration, PR/MR delivery and conf
Rogue Open Design Skill
Generate web, mobile, and desktop prototypes, slides, dashboards, and editorial layouts from a single prompt u
Website Builder Setup
Build professional animated websites with Claude Code — no coding needed. One install, three tools: UI/UX Pro
Related Agents
Motion Builder
Builds the HyperFrames composition — scenes, kinetic text, and data graphics — using the XChart library and th
Animation Implementer
Specialized coding agent that implements motion design specs using Framer Motion, GSAP, and Three.js. Use this
Aaron Sorkin Screenwriter
Use this agent for video scripts, demo walkthroughs, tutorial content, launch videos, and workshop materials.