MCPInstall

creative-director

Use when overseeing animation vision, setting creative direction for motion, or guiding teams on animation quality and consistency.

Installs
581
Last 24h
—
Trending rank
—
Security
Not audited

Install

Works with every agent the skills CLI supports.

npx skills add https://github.com/dylantarre/animation-principles --skill creative-director
  1. 01

    Install

    Run the command in your project. The CLI asks which agents to install for.

  2. 02

    Describe the task

    Ask your agent for something this skill covers. It loads creative-director automatically when relevant.

  3. 03

    Review the result

    The agent follows the SKILL.md steps, scripts and references bundled with the skill.

SKILL.md

The instructions your agent reads when the skill is triggered.

Creative Director: Animation Vision & Leadership

You are a creative director setting vision and standards for animation across projects. Apply Disney's 12 principles to lead teams toward excellent motion design.

The 12 Principles for Creative Leadership

1. Squash and Stretch

Creative Direction: Define the elasticity range for your project. How much life do we give objects? What's our physics reality? Vision Question: "On a spectrum from rigid to rubbery, where does our world live?"

2. Anticipation

Creative Direction: Establish anticipation as a pacing tool. Are we building tension or moving quickly? Anticipation is your dramatic control. Vision Question: "Do we let moments breathe, or do we punch through?"

3. Staging

Creative Direction: Visual hierarchy is storytelling. Review compositions for clarity. If staging requires explanation, it's not working. Vision Question: "Does the eye know where to go? Does the motion tell the story?"

4. Straight Ahead vs Pose to Pose

Creative Direction: Production approach impacts feel. Commission straight ahead for organic warmth, pose to pose for controlled precision. Vision Question: "What production approach serves this creative vision?"

5. Follow Through and Overlapping Action

Creative Direction: Follow-through is where craft shows. This is the layer that separates amateur from professional. Invest here. Vision Question: "Have we earned the details? Does the craft match the ambition?"

6. Slow In and Slow Out

Creative Direction: Easing is the signature. Define your curves and protect them. Inconsistent easing breaks the world. Vision Question: "What does our motion feel like? Do we have a recognizable rhythm?"

7. Arc

Creative Direction: Movement paths define spatial philosophy. Organic worlds arc. Mechanical worlds line. Establish the rule, then break it intentionally. Vision Question: "What kind of space are we creating? How do things move through it?"

8. Secondary Action

Creative Direction: The delight layer. This is where personality lives. Allocate time for secondary action—it's not polish, it's character. Vision Question: "What small moments will make people love this?"

9. Timing

Creative Direction: Timing is tone. Fast and snappy vs slow and weighty. Establish timing frameworks early—retrofitting timing is expensive. Vision Question: "What's the tempo of this experience?"

10. Exaggeration

Creative Direction: Exaggeration calibration sets genre. Too little = boring. Too much = cartoon. Find your specific sweet spot. Vision Question: "How stylized is our reality? Where's our line?"

11. Solid Drawing

Creative Direction: Spatial coherence across all animation. Different animators must produce consistent spatial logic. Define the rules. Vision Question: "Would animation from different artists feel like one world?"

12. Appeal

Creative Direction: The sum of all principles. Appeal is the emotional response to everything working together. This is what you're ultimately responsible for. Vision Question: "Do people want to keep watching? Does it feel like us?"

Leadership Responsibilities

Vision Setting

  • Create motion mood boards and reference libraries
  • Define the "feel" in communicable terms
  • Make early animation tests before full production

Quality Standards

  • Establish review checkpoints
  • Create do/don't reference guides
  • Define minimum quality thresholds

Team Guidance

  • Protect animator creative ownership within bounds
  • Balance consistency with individual expression
  • Know when to push and when to accept

Stakeholder Communication

  • Translate animation quality to business value
  • Defend craft time in production schedules
  • Present work in context of vision

Review Checklist

  • Does it match the established motion language?
  • Does it serve the story/user need?
  • Is the craft level consistent with project standards?
  • Would I put my name on this?

FAQ

What does the creative-director skill do?

Use when overseeing animation vision, setting creative direction for motion, or guiding teams on animation quality and consistency.

How do I install creative-director?

Run npx skills add https://github.com/dylantarre/animation-principles --skill creative-director in your project. The skills CLI detects the agents you use and copies the skill into the right folder. For Claude Code you can also place the skill folder at ~/.claude/skills/creative-director/ (personal) or .claude/skills/creative-director/ (project).

Which AI agents can use creative-director?

Any agent that supports the open Agent Skills format (a folder with a SKILL.md file), including Claude Code, Codex, Cursor, GitHub Copilot, Gemini CLI, Windsurf, Cline, OpenCode and more.

Is creative-director safe to install?

No partner security audit is available yet. Skills can run commands and scripts, so read the SKILL.md and any bundled files before installing.

Who maintains creative-director?

It is published by dylantarre in dylantarre/animation-principles. It has 581 recorded installs.

More from dylantarre/animation-principles

View all →

video-motion-graphics

dylantarre/animation-principles

Use when creating After Effects compositions, Premiere Pro motion, video titles, explainer videos, or broadcast motion graphics.

Media & Creative2.4K installs

mobile-touch

dylantarre/animation-principles

Use when designing iOS/Android gestures, haptic feedback, touch interactions, or native mobile animations.

Mobile2.4K installs

framer-motion

dylantarre/animation-principles

Use when implementing Disney's 12 animation principles with Framer Motion in React applications

Frontend & Design1.7K installs

motion-designer

dylantarre/animation-principles

Use when designing visual motion systems, creating animation specifications, or when a designer needs guidance on crafting beautiful, meaningful movement.

Frontend & Design1.6K installs

micro-interactions

dylantarre/animation-principles

Use when designing small UI feedback moments like button states, toggles, form validation, loading indicators, or notification badges.

Frontend & Design1.4K installs

web-motion-design

dylantarre/animation-principles

Use when building CSS animations, JavaScript transitions, React/Vue motion, or any browser-based animation work.

Frontend & Design1.3K installs

Popular media & creative skills

View category →

hyperframes

heygen-com/hyperframes

Read first to make, edit, animate or render any video with HyperFrames (HTML rendered to video), including launch films, explainers, music videos, charts, maps, vertical clips, title cards, captions and overlays. Holds the render contract, the work loop and what each kind of video needs.

Media & Creative1.2M installs

media-use

heygen-com/hyperframes

Get or make any media for a HyperFrames video - music, sound effects, images, icons, logos, voiceover, avatar and generated video, transcripts, cutouts, colour grades and looks - with HeyGen or free local tools, and mix placed audio. Also for footage that looks dark, flat or dull, or should be stylized or hidden.

Media & Creative1.1M installs

hyperframes-registry

heygen-com/hyperframes

About 450 ready-made HyperFrames blocks and components installed as editable source - transitions, overlays, titles, kinetic type, captions, charts, map overlays, 3D, camera moves. Use it before hand-building any named visual (CRT scanlines, glitch, film grain, a chart); also for hyperframes add and catalog.

Media & Creative1M installs

hyperframes-creative

heygen-com/hyperframes

Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use hyperframes-animation.

Media & Creative916.5K installs

ai-video-generation

101-skills/superpowers

Generate AI videos with Google Veo, Seedance 2.0, HappyHorse, Wan, Grok and 40+ models via inference.sh CLI. Models: Veo 3.1, Veo 3, Seedance 2.0, HappyHorse 1.0, Wan 2.5, Grok Imagine Video, OmniHuman, Fabric, HunyuanVideo. Capabilities: text-to-video, image-to-video, reference-to-video, video editing, lipsync, avatar animation, video upscaling, foley sound. Use for: social media videos, marketing content, explainer videos, product demos, AI avatars. Triggers: video generation, ai video, text to video, image to video, veo, animate image, video from image, ai animation, video generator, generate video, t2v, i2v, ai video maker, create video with ai, runway alternative, pika alternative, sora alternative, kling alternative, seedance, happyhorse

Media & Creative881.5K installs

ai-image-generation

101-skills/superpowers

Generate AI images with GPT-Image-2, FLUX, Gemini, Grok, Seedream, Reve and 50+ models via inference.sh CLI. Models: GPT-Image-2, FLUX Dev LoRA, FLUX.2 Klein LoRA, Gemini 3 Pro Image, Grok Imagine, Seedream 4.5, Reve, ImagineArt. Capabilities: text-to-image, image-to-image, inpainting, LoRA, image editing, upscaling, text rendering. Use for: AI art, product mockups, concept art, social media graphics, marketing visuals, illustrations. Triggers: flux, image generation, ai image, text to image, stable diffusion, generate image, ai art, midjourney alternative, dall-e alternative, text2img, t2i, image generator, ai picture, create image with ai, generative ai, ai illustration, grok image, gemini image, gpt image, openai image, chatgpt image

Media & Creative880.3K installs