Communitygithub.com

brand-intake

The setup step every other skill in this pack reads. A short interview plus 3 to 5 reference frames becomes two files in your project, brand.md (who you are, what you sell, your assets) and MOTION.md (your colours, type, timing and motion rules), plus a rule in CLAUDE.md so Claude reads them before it animates anything. Use at the start of any motion project, or when someone says

brand-intake 是什麼?

brand-intake is a Claude Code agent skill that the setup step every other skill in this pack reads. A short interview plus 3 to 5 reference frames becomes two files in your project, brand.md (who you are, what you sell, your assets) and MOTION.md (your colours, type, timing and motion rules), plus a rule in CLAUDE.md so Claude reads them before it animates anything. Use at the start of any motion project, or when someone says.

相容平台✓Claude Code~Codex CLI~Cursor
npx skills add https://github.com/charlie947/motion-graphics-skills/tree/main/skills/brand-intake

在你喜歡的 AI 中提問

開啟一個已預先載入此 Agent Skill 的新對話。

說明文件

Brand intake

Every other skill in this pack reads the two files this one writes. Without them, Claude picks its own colours, its own type and its own idea of motion. Run this once per brand.

Start straight away

When someone asks for this, your first message is the Batch 1 questions. No summary of the skill, no preamble.

Step 1: The interview, in two batches

Batch 1. Ask these four together, then wait:

  1. What is the brand called, and what do you do, in one line?
  2. Who is it for? One sentence on the person watching.
  3. What do you sell or promote in your videos? The offer, the product or the newsletter, with its real link.
  4. What should people feel in the first second? Pick up to three: calm, premium, playful, urgent, technical, warm, bold.

Batch 2. Then ask these three, and wait: 5. Your colours as hex codes, your font names, and your logo files (SVG or PNG, attached). No hex codes? Say "sample them from my site" and give the link. 6. 3 to 5 reference frames: screenshots of motion you already like, from Dribbble, Pinterest or your own work. Put them in a folder called examples. 7. One thing your motion must never do.

If an answer is blank, ask for it once more, then move on. Never fill a gap with a guess.

Step 2: Write brand.md

Save it in the project root, under 300 words:

# Brand

## Name and what we do
## Audience
## What we promote (with the real link)
## The feeling
## Assets
Colours (hex, typed by me or sampled from a named source), fonts, logo file names
## Never

Step 3: Write MOTION.md from the frames

Read every frame in examples, then write MOTION.md with this brief to yourself:

Write one file called MOTION.md that any AI can read before it animates anything for me. It must cover:

1. Every colour as a hex code, and what each one is for
2. The fonts and the type sizes
3. Timing: how things come in, how long they hold, and how they leave
4. How things move: the frame rate, the easing, and anything that makes it feel handmade
5. Texture and finish
6. Five things my motion must never do, named plainly
7. One example, described shot by shot, of it done right

Work only from what is in the frames. Where you cannot tell, write ASK ME rather than guessing.

Show the user the file before you save it. Colours in brand.md win over colours sampled from a frame.

Step 4: Add the read-first rule to CLAUDE.md

Create CLAUDE.md if it does not exist, and add this block word for word:

Before designing, generating or animating anything, read MOTION.md in full.

Every colour, font, timing and motion value comes from that file.

The file sets the look, not the ambition. When I say go all out, go all out.

If something I ask for is not covered there, ask me rather than choosing for yourself.

When you have finished, check your own frames against MOTION.md, fix what fails, and only then show me.

What I learned the hard way

  • Mixed frames give mixed looks. My five frames held four different looks. The file named all four and asked which to use. Pick one master look, or name which look goes with which job.
  • The ambition line is not optional. Without "the file sets the look, not the ambition", my first try with the file came out far too polite.
  • ASK ME is a feature. With the file in place, the one-line prompt stopped and asked a question before building. That is the file working.
  • Sampled hex codes drift. A colour read off a JPEG is a few points out. Use the hex codes you typed wherever they exist.

Step 5: Prove it (optional, two minutes)

Run the same one-line prompt twice, once in an empty folder and once in this project: "Make a dynamic 15-second motion graphics video that shows what an incredible motion designer you are. Go all out." Put the two side by side. Both should go all out. Only one should look like yours.

Hand off

Tell the user brand.md, MOTION.md and the CLAUDE.md rule are in place, then list what to try next: launch-video, vox-explainer, animated-chart, milestone-reveal. Until both files exist, no other skill may call its result on-brand.

Individual skills in this repo

This repo contains 14 individual skills — each has its own dedicated page.

animated-chart

Make a looping animated chart for LinkedIn or a newsletter in code with Claude Code. Bars that become a line, a number that counts up, a before and after. Every value stays exactly as given. Use when someone says

apple-launch-film

Rebuild an Apple-style Mac launch film entirely in code with Claude Code. A thin menu bar, the black notch growing into widgets one scene at a time, full-screen gradient wallpapers and one short caption per scene. No screen recording, no After Effects. Use when someone says

launch-video

Make a 30-45 second product launch video in code with Claude Code, the kind SaaS companies post on launch day. One sentence split across scenes, real product screens with slow camera moves, a typed prompt, a proof beat and a clear call to action. Use when someone says

loop-cover

Turn a newsletter or blog cover into a seamless looping GIF at 896 x 640, 180 frames at 20fps. Only the one element you name moves, the loop is rotated so frame 1 shows the finished picture, and the seam is measured, not eyeballed. Use when someone says

milestone-reveal

Make a 12-second looping milestone clip in code with Claude Code. Thousands of tiny points drift like a night sky, pull together into your real number (followers, subscribers, revenue, customers), a line draws underneath and the label settles in. Premium, not a party. Use when someone says

model-showdown

Give the same motion brief to three AI models, keep each first try, render all three the same way and stack them into one comparison video with model names and logos. Makes a 16:9 side-by-side for a newsletter and a 1080 x 1920 stacked reel for Instagram and TikTok. Use when someone says

motion-brief-writer

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

motion-effects

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. Interfaces (button to player, search to results, card to workspace, tabs to panels), data (chart morph, dashboard zoom, spring stack, magnetic dock), type (masked type, elastic type, text to layout, image reveal) and systems (perspective shift, glass focus, flowing paths, particle logo). Use when someone says

motion-prompt-writer

Write a complete 8-part Claude Motion prompt (The bar, Format, The one rule, Look, Motion, Never, Before you finish, The scene) for one short looping motion graphic, in your own brand. Takes your brand (a website screenshot, a logo, hex codes, or nothing for the Apple-style default) and one moment you want to show, in plain words. Use when someone says

newsletter-promo

Turn a newsletter edition into a 12-20 second promo clip for LinkedIn, Instagram or X that drives people to read and subscribe. Hook question, three proof frames from the edition, then the newsletter name and where to read it. Use when someone says

reel-export

Turn any horizontal or square motion video into a 1080 x 1920 Instagram Reel or TikTok that uploads cleanly. Headline and logos inside the safe zone, H.264, yuv420p, limited colour range, bt709, a silent audio track when there is no sound, and an ffprobe check before upload. Use when someone says

reference-to-motion

Turn references you admire into a scene-by-scene Claude Motion prompt for your own topic and brand. Takes a video for the moves (screenshots, frames or a contact sheet of a reel or ad) and, optionally, a look reference for the style (a website, a brand, a moodboard). Use when someone says

title-sequence-3d

Make a cinematic 3D title sequence (8-15 seconds) in code with Claude Code and Three.js. A camera moves through a lit scene, such as a rainy street at night with brand names as neon signs, then a big question or title lands. Use when someone wants a scroll-stopping opener, a film-style intro,

vox-explainer

Make a short Vox-style documentary explainer (30-60 seconds) entirely in code with Claude Code. Torn paper, halftone texture, bold condensed type, motion on twos. Use when someone says

相關技能