Motion & Video Direction

Plan a product demo, feature announcement, or launch video as a beat sheet and shot list BEFORE animating — hook in the first 3s, problem, reveal, proof, CTA — with target duration and pacing per scene type, output as a JSON scene plan that remotion-compose consumes directly. Use when someone says "storyboard my demo", "plan the video", "what scenes do I need", "plan my launch video", "map out the demo", or "break this feature into scenes" before any code. Do NOT use when the request is the animation mechanics — writing the .tsx, using interpolate/spring, registering the Composition — that is remotion-compose; do NOT use for the easing and choreography craft of a single scene — use motion-design-principles instead.

Put text in motion the right way — title cards, animated captions, lower-thirds, callouts, and word-by-word reveals — with a reading-time-per-word budget so copy holds long enough to read, plus enter/exit timing, weight and size transitions, and type hierarchy in motion. Use when someone asks to "animate this text", "make a title card", "animated captions/subtitles", "kinetic typography", "animate the headline", "lower-third", "word-by-word reveal", "text that pops in", or "how long should this line stay on screen". Do NOT use when the question is the cut, pacing, or easing curve of non-text motion — use motion-design-principles instead; do NOT use to plan which scenes or shots exist — use video-storyboard instead; do NOT use to resize or crop a caption track for a specific platform (9:16 TikTok, 1:1 feed) — use social-video-formatter instead; do NOT use for the color, contrast, or lighting of the type against its background — use motion-color-and-light instead.

Choose palette, contrast, and lighting for a moving video — not a static UI — so color survives H.264/VP9 compression, banding, and YouTube/Instagram/TikTok recompression across OLED, LCD, and projectors. Use when picking video colors, building a gradient mesh, adding glow/bloom/depth, setting a dark-background default, asking "why does my gradient band", "why is my neon muddy after upload", "is this contrast video-safe", or "what palette for my video". Do NOT use when laying out scene timing or beats — use video-storyboard instead. Do NOT use for motion-easing or animation-feel decisions — use motion-design-principles instead. Do NOT use to style or animate the on-screen text itself — use kinetic-typography instead (you give it the palette, it sets the type in motion). Do NOT use to structure a product walkthrough or decide what to show — use product-demo-director instead. Do NOT use for audio, beat-matching, or scoring — use sound-and-music-sync instead. Do NOT use to re-crop or re-spec a video for a platform's aspect ratio and safe areas — use social-video-formatter instead.

Direct the craft of putting a real software UI on screen — cursor choreography, zoom/pan/callout language, screen-recording vs recreated-UI, and making state changes legible with highlights, focus pulls, and slow-downs. Use when filming or recreating an app for a product demo, feature walkthrough, onboarding clip, or release reel and asking "how do I show this click", "where should the camera zoom", "should I screen-record or rebuild the UI", "why does my demo feel confusing", "how do I make the state change readable", or "how do I move the cursor". Do NOT use for the underlying motion grammar (easing, timing) — use motion-design-principles; for the beat-by-beat plan — use video-storyboard; for animating words on screen — use kinetic-typography; for the color/light of highlights and glows — use motion-color-and-light; for sound design or a click/whoosh hit — use sound-and-music-sync; for reframing the demo to 9:16 or 1:1 — use social-video-formatter; for the React/MP4 mechanics of building it — use remotion-compose and remotion-render.

Score a video like an editor: beat-match cuts to the music, land SFX on transitions, pace the voiceover so it breathes, source royalty-free tracks safely, and duck the music so the VO sits clearly on top. Use when adding music, sound effects, or voiceover to a video, when asked to "sync cuts to the beat", "the music is drowning out the voice", "add whooshes on the transitions", "where do I get royalty-free music", "mix the audio", or "the VO feels rushed". Do NOT use when wiring audio into the Remotion timeline mechanically (Audio/staticFile/render) — that is remotion-compose and remotion-render; do NOT use when choosing the shot order or scene beats — use video-storyboard instead; do NOT use when tuning the visual look (color grade, lighting, contrast) — use motion-color-and-light instead.

Reframe and export a finished video for social platforms — 9:16 ↔ 16:9 cropping, burned-in captions, a platform-native first frame, loop design, and per-platform specs (aspect, length, safe areas) for TikTok, Reels, Shorts, X, and LinkedIn. Use when someone says "make this vertical", "crop to 9:16", "format for TikTok/Reels/Shorts", "add captions/subtitles", "why is my video cut off on mobile", "resize for Instagram", or "export for social". Do NOT use when the question is about the storyboard or shot order before any video exists (use video-storyboard); when it is about the animation craft of how elements move and the easing/spacing of motion (use motion-design-principles); when it is about animated word-by-word caption styling (use kinetic-typography); when it is about palette, contrast, or lighting choices (use motion-color-and-light); when it is about directing the actual product-demo content and screen choreography (use product-demo-director); or when it is about scoring, beat-syncing, or audio (use sound-and-music-sync) — this is the craft layer that decides WHAT to format for the feed, then hands a concrete spec to remotion-compose / remotion-render to author and export.