Animejs
boraoztunc/skills
Anime.js adapter patterns for HyperFrames. An agent skill from boraoztunc/skills.
Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand.
Install Motion Brief Writer
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a claude-codeProject install by default; add -g for ~/.claude/skills/.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writer --agent claude-codeProject scope by default; add --scope user for a personal install. Needs GitHub CLI 2.90.0 or later (public preview).
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .claude/skills && cp -r skills-src/skills/motion-brief-writer .claude/skills/motion-brief-writer && rm -rf skills-srcUse ~/.claude/skills/ instead of .claude/skills for a personal install. The folder must contain SKILL.md.
Claude Code skills documentation · loads skills from .claude/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .claude/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.Claude Code copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$skill-installer install https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writerType this inside Codex. $skill-installer <name> installs a curated skill from openai/skills. The installer writes to $CODEX_HOME/skills (default ~/.codex/skills). Restart Codex if the skill does not show up.
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a codexProject install goes to .agents/skills/; add -g for ~/.codex/skills/.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writer --agent codexProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .agents/skills && cp -r skills-src/skills/motion-brief-writer .agents/skills/motion-brief-writer && rm -rf skills-srcUse ~/.agents/skills/ instead of .agents/skills for a personal install.
Codex skills documentation · loads skills from .agents/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .agents/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.Codex copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a cursorProject install goes to .agents/skills/; add -g for ~/.cursor/skills/.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writer --agent cursorProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .cursor/skills && cp -r skills-src/skills/motion-brief-writer .cursor/skills/motion-brief-writer && rm -rf skills-srcUse ~/.cursor/skills/ instead of .cursor/skills for a personal install.
Cursor skills documentation · loads skills from .cursor/skills/, .agents/skills/, .claude/skills/, .codex/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .cursor/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.Cursor copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gemini skills install https://github.com/charlie947/motion-graphics-skills.git --path skills/motion-brief-writer--scope user (default) or --scope workspace; --path is the subfolder of the repo that holds the skill; --consent skips the security confirmation prompt.
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a gemini-cliProject install goes to .agents/skills/; add -g for ~/.gemini/skills/.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writer --agent gemini-cliProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .gemini/skills && cp -r skills-src/skills/motion-brief-writer .gemini/skills/motion-brief-writer && rm -rf skills-srcUse ~/.gemini/skills/ instead of .gemini/skills for a personal install, then run /skills reload.
Gemini CLI skills documentation · loads skills from .gemini/skills/, .agents/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .gemini/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.Gemini CLI copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writerInstalls for Copilot at project scope by default; add --scope user for a personal install. Preview a skill first with gh skill preview. Needs GitHub CLI 2.90.0 or later (public preview).
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a github-copilotProject install goes to .agents/skills/; add -g for ~/.copilot/skills/.
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .github/skills && cp -r skills-src/skills/motion-brief-writer .github/skills/motion-brief-writer && rm -rf skills-srcUse ~/.copilot/skills/ instead of .github/skills for a personal install. Commit .github/skills so cloud agent and code review can use it.
GitHub Copilot skills documentation · loads skills from .github/skills/, .claude/skills/, .agents/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .github/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.GitHub Copilot copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
$ npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a opencodeOpenCode documents no install command of its own. Project install goes to .agents/skills/; add -g for ~/.config/opencode/skills/.
$ gh skill install charlie947/motion-graphics-skills motion-brief-writer --agent opencodeProject scope by default (.agents/skills/); add --scope user for a personal install.
$ git clone --depth 1 https://github.com/charlie947/motion-graphics-skills.git skills-src && mkdir -p .opencode/skills && cp -r skills-src/skills/motion-brief-writer .opencode/skills/motion-brief-writer && rm -rf skills-srcUse ~/.config/opencode/skills/ instead of .opencode/skills for a personal install.
OpenCode skills documentation · loads skills from .opencode/skills/, .claude/skills/, .agents/skills/
Install the "motion-brief-writer" agent skill from https://github.com/charlie947/motion-graphics-skills/tree/main/skills/motion-brief-writer into .opencode/skills/motion-brief-writer/ in this project. Copy the whole folder (SKILL.md and every file beside it), keep the folder name "motion-brief-writer", then confirm the skill loads.OpenCode copies the folder itself, the same result as the manual copy. Check what it changed before you commit it.
Facts
- Skill name
motion-brief-writer- GitHub stars
- 180
- Token cost
- ~1.1k tokens
- SKILL.md length
- 689 words
- Files
- 1
- Repo updated
- First seen
- Licence
- MIT
At a glance
Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand.
- Works in 4 steps: Say what you want to make, in plain… → It asks for whatever is missing, in one… → It hands back two parts: a… → …
- Someone says brief this animation
- SKILL.md covers How to use it, The instructions and Tested
- Instructions only: no scripts, shell commands, URLs or credentials in SKILL.md
What it does
Motion Brief Writer is an agent skill from charlie947/motion-graphics-skills. Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand. Asks for anything essential first (exact numbers, size, length, brand), keeps real results apart from sample data, and never invents a figure. Use when someone says "brief this animation", "write me a motion brief", "I want an animated chart/graphic for my post", "make this move in my brand", or has an idea but no build prompt yet.
Its SKILL.md is about 1.1k tokens, which your agent loads only when the skill is triggered. It is a single SKILL.md file with no bundled scripts.
It sits in Media & Creative, covering Motion graphics. The repository describes itself as: 13 Claude Code skills for launch-grade motion graphics. Every frame is code. No After Effects, no video generator. The licence is MIT.
When your agent uses it
- Someone says brief this animation
- Write me a motion brief
- I want an animated chart/graphic for my post
- Make this move in my brand
Example prompts
- “brief this animation”
- “write me a motion brief”
- “I want an animated chart/graphic for my post”
- “/motion-brief-writer”
Workflow steps
4 steps, taken from the first numbered list in SKILL.md.
- Say what you want to make, in plain words. Add your logo, a screenshot of your brand or your hex codes, and your exact words and numbers.
- It asks for whatever is missing, in one batch of five questions or fewer.
- It hands back two parts: a three-sentence summary, and one build prompt in a code block.
- Paste the build prompt into Claude Code in the folder with your files.
What it can do on your machine
Read from SKILL.md and the folder at commit dfc4284. It shows what the files ask for, not the result of running them.
Tool permissions
Pre-approves nothing: there is no allowed-tools line, so your agent's usual permission prompts apply.
From allowed-tools in the SKILL.md frontmatter.
Runs code
No scripts in the folder and no shell commands in SKILL.md.
From the folder's file list and the shell code blocks in SKILL.md.
Network
No URLs in SKILL.md.
From URLs in SKILL.md, links to its own repository left out.
Credentials
Names no API keys, tokens, secrets or passwords.
From names ending in _API_KEY, _TOKEN, _SECRET, _KEY or _PASSWORD in SKILL.md.
Context cost
Motion Brief Writer loads about 1.1k tokens when it runs. Until then it costs about 115 tokens; SKILL.md has 689 words of instructions outside code blocks.
Estimates: characters ÷ 4, the usual rule of thumb; real counts depend on the model's tokenizer. Scripts and assets cost tokens only if the agent reads them.
Safety
Auto-check passed
The automated check found no risky patterns in SKILL.md.
Automated static check — not a guarantee. Review scripts before installing. It scans the text of SKILL.md for risky patterns (piping downloads into a shell, reading credential files, hidden Unicode, destructive commands); files beside SKILL.md are not scanned.
SKILL.md
The full file from charlie947/motion-graphics-skills at commit dfc4284, republished under its MIT licence (© charlie947). 689 words, ~1,141 tokens.
Download SKILL.mdSave it as
.claude/skills/motion-brief-writer/SKILL.md (or your agent's skills folder).- name
- motion-brief-writer
- description
- Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand. Asks for anything essential first (exact numbers, size, length, brand), keeps real results apart from sample data, and never invents a figure. Use when someone says "brief this animation", "write me a motion brief", "I want an animated chart/graphic for my post", "make this move in my brand", or has an idea but no build prompt yet.
Motion brief writer
You write the brief. Claude Code builds from it. Use this before any of the other skills in this pack when the idea is still rough.
Before you start: read brand.md and MOTION.md if they exist. If not, run brand-intake first, or ask for hex codes, a font and a logo file. Never call a result on-brand without them.
How to use it
- Say what you want to make, in plain words. Add your logo, a screenshot of your brand or your hex codes, and your exact words and numbers.
- It asks for whatever is missing, in one batch of five questions or fewer.
- It hands back two parts: a three-sentence summary, and one build prompt in a code block.
- Paste the build prompt into Claude Code in the folder with your files.
The instructions
You are a motion-design brief writer. You write build prompts. You never build the animation yourself.
<context>
I want a short looping animated graphic for a post, in my own brand. I will paste your prompt into Claude Code with my files attached. Precision matters because a vague brief gives a generic animation, and an invented number could end up in public under my name.
</context><task>
1. Read what I give you: an idea, a logo, brand guide, screenshot or colours, exact words and numbers, the platform or size, and maybe a motion reference.
2. If something essential is missing, ask for it in one batch of five questions or fewer. Essential means: the exact words and numbers, the size, the length, and the brand. Skip anything I have already answered. Then wait.
3. If I have no brand assets, offer neutral defaults and label them "Neutral default, replace with your brand". For my actual brand, only use hex codes I typed or that are clearly readable. Otherwise ask for the exact colour. You may propose a neutral palette if you label it as a suggestion, not my brand.
4. My brand rules outrank any reference. Take the motion idea from a reference. Leave out its logo, copy and colours.
5. Keep measured results, targets and sample data separate. If a requested performance claim has no supporting figures or its status is unclear, ask. With no data, offer a demo marked "Illustrative data". Never present a target as a result.
</task><output_format> Two parts only. Part 1: a plain-English summary of no more than three sentences. Part 2: one build prompt in a code block, with:
Show full SKILL.md (270 more words)Show less
- width x height in pixels, and total seconds
- four states with timings: start, change, hold, return (last frame matches the first)
- the exact text and numbers, marked as fixed
- colours, font and assets. Asset files are attached by me, so name them without a path
- one self-contained HTML file with a window.seek(seconds) function and a reduced-motion setting that shows the held frame
- after the build: capture named frames, check them for overlap, cut-off text and changed numbers, fix what is real, keep the earlier version
- no installs, spending, sending or publishing without asking me
- optional export: check which tools exist, then state the real file formats and sizes. Do not assume HTML alone becomes MP4 </output_format>
<examples>
<example>"Bars grow for my Q3 results", no numbers -> ask for the numbers. Do not write a prompt yet.</example>
<example>A reference with another firm's logo -> copy its motion only. State that its logo and colours are excluded.</example>
<example>Brand screenshot too blurry to read -> "exact colour needed", never a guessed hex.</example>
</examples>If my idea or essential details are missing, ask only for those and wait. If I already supplied everything, produce the two-part output immediately.
Tested
- A made-up brand (Fern & Co, navy, terracotta and cream) with six sample numbers: it wrote the brief, and Claude Code built an 8-second 1080 x 1350 chart from it. It caught two layout problems on its own and fixed both. Every number matched the brief.
- A vague bakery idea: it asked five questions instead of inventing a brand.
- A "20% revenue growth" headline with no figures: it asked whether 20% was a result, a target or an example.
© charlie947, MIT. Rendered from Markdown: HTML in the file is shown as text, images as links, and headings moved down two levels. Raw file
Files
Just SKILL.md in skills/motion-brief-writer of charlie947/motion-graphics-skills.
Open the folder on GitHubat commit dfc4284
Compare with similar skills
Motion Brief Writer next to the 5 skills that share the most tags, products or categories with it. Stars are the repository's; “used in” counts other GitHub owners with a copy.
| Skill | Stars | Used in | Tokens | Auto-check | Licence | Repo updated |
|---|---|---|---|---|---|---|
| Motion Brief Writer this skillcharlie947/motion-graphics-skills | 180 | — | ~1.1k | Automated safety check: Pass | MIT | |
| Animejsboraoztunc/skills | 398 | 2 repos | ~828 | Automated safety check: Pass | Apache-2.0 | |
| Video Storytellingnateherkai/hyperframes-student-kit | 1.3k | — | ~4.9k | Automated safety check: Pass | Custom licence | |
| HyperFrames Animationheygen-com/hyperframes | 60k | 3 repos | ~2.1k | Automated safety check: Pass | Apache-2.0 | |
| Slack GIF Creatoranthropics/skills | 180k | 29 repos | ~2k | Automated safety check: Pass | Apache-2.0 | |
| Stitch to Remotion Walkthrough Videosgoogle-labs-code/stitch-skills | 8.5k | 6 repos | ~3.2k | Automated safety check: Notes | Apache-2.0 |
Similar skills
Video Storytelling
nateherkai/hyperframes-student-kit
Design and build the visual layer of a long-form talking-head video as one persistent world the camera moves through, instead of a sequence of separate graphics.
HyperFrames Animation
heygen-com/hyperframes
Collects motion rules, scene blueprints, transitions and runtime adapters for HyperFrames video compositions, with GSAP as the default animation runtime.
- Official
Slack GIF Creator
anthropics/skills
Provides Slack size and frame limits, Python animation helpers and validators for building animated GIFs sized for emoji and messages.
- Official
Stitch to Remotion Walkthrough Videos
google-labs-code/stitch-skills
Builds walkthrough videos from Stitch design projects using Remotion, with transitions, zoom effects and text overlays on each screen.
Faceless Explainer Video
heygen-com/hyperframes
Turns an article, notes or a topic brief into an explainer video whose visuals are invented per scene, built frame by frame in HyperFrames with no footage.
More from charlie947/motion-graphics-skills
All 9 skills in this repoMotion Effects
charlie947/motion-graphics-skills
Build any of 16 premium motion effects from scratch in your own brand, as one 8-second looping HTML file with window.seek(seconds) so it exports frame-exact to MP4 or GIF.
Animated Chart
charlie947/motion-graphics-skills
Make a looping animated chart for LinkedIn or a newsletter in code with Claude Code.
Apple Launch Film
charlie947/motion-graphics-skills
Rebuild an Apple-style Mac launch film entirely in code with Claude Code.
Launch Video
charlie947/motion-graphics-skills
Make a 30-45 second product launch video in code with Claude Code, the kind SaaS companies post on launch day.
Loop Cover
charlie947/motion-graphics-skills
Turn a newsletter or blog cover into a seamless looping GIF at 896 x 640, 180 frames at 20fps.
Milestone Reveal
charlie947/motion-graphics-skills
Make a 12-second looping milestone clip in code with Claude Code.
Related
Categories
Questions about Motion Brief Writer
What does Motion Brief Writer do?
Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand. Motion Brief Writer is an agent skill from charlie947/motion-graphics-skills. Turns a rough idea for an animated graphic into a precise build brief for Claude Code, in your own brand.
When should I use Motion Brief Writer?
Motion Brief Writer fits situations like: someone says brief this animation; write me a motion brief; I want an animated chart/graphic for my post; make this move in my brand.
How do I install Motion Brief Writer in Claude Code?
Run `npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a claude-code`. Or copy the skill folder (skills/motion-brief-writer in charlie947/motion-graphics-skills) into .claude/skills/motion-brief-writer in your project. Claude Code loads it when a task matches its description.
How do I install Motion Brief Writer in Codex?
Run `npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a codex`. Or copy the skill folder (skills/motion-brief-writer in charlie947/motion-graphics-skills) into .agents/skills/motion-brief-writer in your project. Codex loads it when a task matches its description.
Can I use Motion Brief Writer in Cursor, Gemini CLI or GitHub Copilot?
Cursor, Gemini CLI, GitHub Copilot and OpenCode also load SKILL.md folders. With the skills CLI, run `npx skills add charlie947/motion-graphics-skills --skill motion-brief-writer -a cursor` (or -a gemini-cli, github-copilot or opencode for the others). To copy it by hand, put the folder in .cursor/skills/motion-brief-writer, .gemini/skills/motion-brief-writer, .github/skills/motion-brief-writer and .opencode/skills/motion-brief-writer in your project.
What does Motion Brief Writer need to run?
SKILL.md names no scripts, command-line tools or credentials: Motion Brief Writer is instructions for the agent only.
Does Motion Brief Writer access the network?
SKILL.md contains no URLs. Any network use would come from the scripts or tools the agent runs. This is read from the text; nothing was executed.
Is Motion Brief Writer safe to install?
Our automated static check of SKILL.md found no risky patterns, such as piping downloads into a shell, reading credential files or hidden Unicode. It is not a guarantee. Review the folder before installing.
What licence does Motion Brief Writer use?
Motion Brief Writer is published under the MIT licence (the repository's licence). It allows redistribution, so the full SKILL.md is shown on this page.
How many tokens does Motion Brief Writer use?
About 1.1k tokens (SKILL.md is roughly 4.6k characters). Agents keep only the skill's name and description in context until a task matches; then they load SKILL.md in full.
What are the alternatives to Motion Brief Writer?
Skills that share tags, products or a category with Motion Brief Writer: Animejs (boraoztunc/skills, 398 stars), Video Storytelling (nateherkai/hyperframes-student-kit, 1.3k stars), HyperFrames Animation (heygen-com/hyperframes, 60k stars) and Slack GIF Creator (anthropics/skills, 180k stars). The comparison table on this page puts their stars, adoption, token cost, safety result and licence side by side.
Who maintains Motion Brief Writer?
charlie947 (a GitHub user) maintains it in charlie947/motion-graphics-skills, which has 180 GitHub stars. The repository was last updated on October 10, 2026.
Source: charlie947/motion-graphics-skills on GitHub. Facts on this page come from the repository at the commit we read; the author's words are quoted as theirs.