motion-graphic-placement

Featured

Add motion graphics at the right moments without blocking the story. Use when the user wants to enhance talking-head, lecture, tutorial, interview, podcast, or creator videos with motion graphics.

AI & Automation 1,738 stars 259 forks Updated today AGPL-3.0

Install

View on GitHub

Quality Score: 90/100

Stars 20%
100
Recency 20%
100
Frontmatter 20%
70
Documentation 15%
100
Issue Health 10%
50
License 10%
100
Description 5%
100

Skill Content

# Motion Graphic Placement Use this skill to plan where motion graphics should appear, what type each one should be, and how to keep them readable, rhythmic, and consistent with the video. ## Goals - Reinforce important speech moments without covering the speaker or subtitles. - Match MG type to the semantic function of the line. - Keep density high enough for retention but sparse enough to avoid fatigue. - Maintain one visual language across the whole edit. ## Workflow 1. Read project state, transcript, active design style, video aspect ratio, and visible speaker layout. 2. Identify the video structure: - hook - problem or setup - body / proof / steps - summary / CTA 3. Decide motion-graphic density: - long-form landscape: usually one meaningful MG every 5-8 seconds, tighter in the first 15 seconds - short-form portrait: usually one meaningful MG every 3-5 seconds, with stronger rhythm - reduce density when the speaker's face, gesture, or screen recording already carries the moment 4. Pick MG types from semantic triggers. 5. Review the plan before generation: - no repeated form in a row unless intentionally templated - no overlays on face, hands, product focal point, or subtitle area - no unnecessary full-screen takeover when a card, strip, badge, or annotation is enough 6. Generate or reuse MGs. 7. Place each MG against the relevant transcript moment. 8. Verify screenshots at target frames and fix anything that blocks content, feels mistim...

Details

Author
0xsline
Repository
0xsline/OpenChatCut
Created
1 months ago
Last Updated
today
Language
TypeScript
License
AGPL-3.0

Integrates with

Similar Skills

Semantically similar based on skill content — not just same category

AI & Automation Solid

motion-graphics

Use when the user wants a short, design-led motion graphic where motion is the message: kinetic typography, stat or number count-up, chart/data-viz hit, logo sting, brand lockup, lower-third, callout, social overlay, animated headline/tweet/news item, motion poster, or quick captured-page highlight. Usually under 10s and up to ~30s, with no live-action subject. Can render to MP4 or transparent overlay. Not for longer, multi-scene, or brand-reel pieces (use general-video), topic explainers (faceless-explainer), PR videos (pr-to-video), or captions on existing footage (embedded-captions). When unsure whether it's a quick motion-first piece or a longer treatment, see /hyperframes.

122 Updated today
Sma1lboy
AI & Automation Featured

create-motion-graphics

Use whenever the agent needs to add, create, hand-author, patch, or place Motion Graphic JSX assets in a OpenChatCut project. This is the direct-authoring path: use create_motion_graphic_from_code / edit_asset / edit_item, not motion-graphic-gen or submit_motion_graphic. Covers project/timeline intake, project visual language, editable properties, asset binding, inline JSX authoring, existing asset updates, timeline placement, and verification.

1,738 Updated today
0xsline
Web & Frontend Listed

motion-graphics

A short, design-led motion graphic where motion is the message — kinetic typography, stat count-up, chart/data-viz hit, logo sting / brand lockup, lower-third / callout / social overlay, animated map (highlight regions, connect places, zoom to a location), animated tweet / news-article / headline, webpage / UI animation (scroll, cursor, callouts), or fusing a real image's geometry into a chart. Usually under 10s (up to ~30s), no narration or live-action subject; renders to MP4 or transparent overlay. Longer / narrated / multi-scene → /general-video. Unclear → /hyperframes.

1 Updated 1 months ago
jpratt9