@mevdragon/vidfarm-devcli 0.14.0 → 0.15.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.agents/skills/embedded-captions/CATALOG.md +93 -0
- package/.agents/skills/embedded-captions/SKILL.md +286 -0
- package/.agents/skills/embedded-captions/assets/brand/CDPR-fankit-terms.txt +35 -0
- package/.agents/skills/embedded-captions/assets/brand/cyberpunk-widths.json +115 -0
- package/.agents/skills/embedded-captions/assets/fonts/char-widths.json +2211 -0
- package/.agents/skills/embedded-captions/assets/strokefonts/HersheyScript1.svg +242 -0
- package/.agents/skills/embedded-captions/assets/strokefonts/HersheyScriptMed.svg +242 -0
- package/.agents/skills/embedded-captions/dna/README.md +148 -0
- package/.agents/skills/embedded-captions/dna/chrome.json +68 -0
- package/.agents/skills/embedded-captions/dna/cream.json +69 -0
- package/.agents/skills/embedded-captions/dna/documentary.json +62 -0
- package/.agents/skills/embedded-captions/dna/editorial.json +70 -0
- package/.agents/skills/embedded-captions/dna/glitch.json +82 -0
- package/.agents/skills/embedded-captions/dna/ink.json +65 -0
- package/.agents/skills/embedded-captions/dna/keynote.json +62 -0
- package/.agents/skills/embedded-captions/dna/loud.json +75 -0
- package/.agents/skills/embedded-captions/dna/neon.json +58 -0
- package/.agents/skills/embedded-captions/dna/velocity.json +89 -0
- package/.agents/skills/embedded-captions/modes/cinematic/README.md +48 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/champion/spec.md +98 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/champion/template.html +188 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/memory-wall/spec.md +134 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/memory-wall/template.html +179 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/portrait-header/spec.md +81 -0
- package/.agents/skills/embedded-captions/modes/cinematic/_archive/portrait-header/template.html +170 -0
- package/.agents/skills/embedded-captions/modes/cinematic/cinematic-cream/spec.md +16 -0
- package/.agents/skills/embedded-captions/modes/cinematic/cinematic-cream/template.html +226 -0
- package/.agents/skills/embedded-captions/modes/cinematic/engine.html +355 -0
- package/.agents/skills/embedded-captions/modes/standard/_anatomy.md +233 -0
- package/.agents/skills/embedded-captions/modes/standard/_motion.md +192 -0
- package/.agents/skills/embedded-captions/modes/standard/fonts/build-fonts-css.cjs +97 -0
- package/.agents/skills/embedded-captions/references/aesthetic-principles.md +168 -0
- package/.agents/skills/embedded-captions/references/anti-patterns.md +188 -0
- package/.agents/skills/embedded-captions/references/bespoke-vs-presets.md +178 -0
- package/.agents/skills/embedded-captions/references/caption-grouping.md +130 -0
- package/.agents/skills/embedded-captions/references/composition-craft.md +522 -0
- package/.agents/skills/embedded-captions/references/direction-catalog.md +138 -0
- package/.agents/skills/embedded-captions/references/example-renders/champion.html +371 -0
- package/.agents/skills/embedded-captions/references/example-renders/memory-wall.html +334 -0
- package/.agents/skills/embedded-captions/references/failure-modes.md +145 -0
- package/.agents/skills/embedded-captions/references/layout-heuristics.md +238 -0
- package/.agents/skills/embedded-captions/references/motion-vocabulary.md +148 -0
- package/.agents/skills/embedded-captions/references/rail.md +68 -0
- package/.agents/skills/embedded-captions/references/reference-bar.md +47 -0
- package/.agents/skills/embedded-captions/references/scene-types.md +94 -0
- package/.agents/skills/embedded-captions/references/test-set.md +66 -0
- package/.agents/skills/embedded-captions/references/typographic-moves.md +266 -0
- package/.agents/skills/embedded-captions/references/typography-presets.md +63 -0
- package/.agents/skills/embedded-captions/scripts/audio-envelope.cjs +95 -0
- package/.agents/skills/embedded-captions/scripts/check-occlusion.cjs +250 -0
- package/.agents/skills/embedded-captions/scripts/check-overflow.cjs +194 -0
- package/.agents/skills/embedded-captions/scripts/check-rail-climax.cjs +233 -0
- package/.agents/skills/embedded-captions/scripts/check-timing.cjs +173 -0
- package/.agents/skills/embedded-captions/scripts/fill-timings.cjs +124 -0
- package/.agents/skills/embedded-captions/scripts/fit-fonts.cjs +158 -0
- package/.agents/skills/embedded-captions/scripts/gen-stroke-path.py +46 -0
- package/.agents/skills/embedded-captions/scripts/inject-fonts.cjs +169 -0
- package/.agents/skills/embedded-captions/scripts/lib-dna.cjs +201 -0
- package/.agents/skills/embedded-captions/scripts/make-cinematic.cjs +1205 -0
- package/.agents/skills/embedded-captions/scripts/make-composition.cjs +404 -0
- package/.agents/skills/embedded-captions/scripts/make-theme.cjs +8781 -0
- package/.agents/skills/embedded-captions/scripts/matte.cjs +294 -0
- package/.agents/skills/embedded-captions/scripts/measure-layout.cjs +293 -0
- package/.agents/skills/embedded-captions/scripts/prepare.sh +39 -0
- package/.agents/skills/embedded-captions/scripts/preview-frames.cjs +268 -0
- package/.agents/skills/embedded-captions/scripts/render-and-composite.sh +509 -0
- package/.agents/skills/embedded-captions/scripts/render-theme.sh +34 -0
- package/.agents/skills/embedded-captions/scripts/safe-zones.cjs +813 -0
- package/.agents/skills/embedded-captions/scripts/transcribe.cjs +349 -0
- package/.agents/skills/embedded-captions/themes/PORTING.md +49 -0
- package/.agents/skills/embedded-captions/themes/README.md +244 -0
- package/.agents/skills/embedded-captions/themes/anchor.json +27 -0
- package/.agents/skills/embedded-captions/themes/arcade.json +51 -0
- package/.agents/skills/embedded-captions/themes/aurora.json +41 -0
- package/.agents/skills/embedded-captions/themes/biolume.json +35 -0
- package/.agents/skills/embedded-captions/themes/brush.json +74 -0
- package/.agents/skills/embedded-captions/themes/chalkboard.json +52 -0
- package/.agents/skills/embedded-captions/themes/dossier.json +56 -0
- package/.agents/skills/embedded-captions/themes/graffiti.json +62 -0
- package/.agents/skills/embedded-captions/themes/hologram.json +41 -0
- package/.agents/skills/embedded-captions/themes/inkwater.json +43 -0
- package/.agents/skills/embedded-captions/themes/laser.json +46 -0
- package/.agents/skills/embedded-captions/themes/lastpage.json +33 -0
- package/.agents/skills/embedded-captions/themes/neonsign.json +53 -0
- package/.agents/skills/embedded-captions/themes/nightcity.json +56 -0
- package/.agents/skills/embedded-captions/themes/ordnance.json +54 -0
- package/.agents/skills/embedded-captions/themes/papercut.json +37 -0
- package/.agents/skills/embedded-captions/themes/popup.json +46 -0
- package/.agents/skills/embedded-captions/themes/ransom.json +62 -0
- package/.agents/skills/embedded-captions/themes/scoreboard.json +54 -0
- package/.agents/skills/embedded-captions/themes/spectrum.json +46 -0
- package/.agents/skills/embedded-captions/themes/stardust.json +29 -0
- package/.agents/skills/embedded-captions/themes/stomp.json +43 -0
- package/.agents/skills/embedded-captions/themes/terminal.json +49 -0
- package/.agents/skills/embedded-captions/themes/thunder.json +44 -0
- package/.agents/skills/embedded-captions/themes/transit.json +44 -0
- package/.agents/skills/embedded-captions/themes/vhs.json +47 -0
- package/.agents/skills/faceless-explainer/SKILL.md +209 -0
- package/.agents/skills/faceless-explainer/references/cut-catalog.md +215 -0
- package/.agents/skills/faceless-explainer/references/motion-language.md +156 -0
- package/.agents/skills/faceless-explainer/references/story-design.md +248 -0
- package/.agents/skills/faceless-explainer/references/visual-design.md +146 -0
- package/.agents/skills/faceless-explainer/scripts/assemble-index.mjs +570 -0
- package/.agents/skills/faceless-explainer/scripts/audio.mjs +260 -0
- package/.agents/skills/faceless-explainer/scripts/build-frame.mjs +536 -0
- package/.agents/skills/faceless-explainer/scripts/captions.mjs +508 -0
- package/.agents/skills/faceless-explainer/scripts/lib/assets.mjs +55 -0
- package/.agents/skills/faceless-explainer/scripts/lib/dimensions.mjs +45 -0
- package/.agents/skills/faceless-explainer/scripts/lib/storyboard.mjs +249 -0
- package/.agents/skills/faceless-explainer/scripts/lib/tokens.mjs +204 -0
- package/.agents/skills/faceless-explainer/scripts/lib/transition-registry.mjs +38 -0
- package/.agents/skills/faceless-explainer/scripts/lib/transitions.json +71 -0
- package/.agents/skills/faceless-explainer/scripts/transitions.mjs +320 -0
- package/.agents/skills/faceless-explainer/sub-agents/frame-worker.md +75 -0
- package/.agents/skills/flockposter/LICENSE +17 -0
- package/.agents/skills/flockposter/README.md +72 -0
- package/.agents/skills/flockposter/SKILL.md +562 -0
- package/.agents/skills/flockposter/examples/cli-instagram-reel.sh +21 -0
- package/.agents/skills/flockposter/examples/cli-multi-platform.json +69 -0
- package/.agents/skills/flockposter/examples/cli-tiktok-upload-only.sh +22 -0
- package/.agents/skills/flockposter/examples/cli-x-thread.sh +17 -0
- package/.agents/skills/flockposter/examples/cli-youtube-short.sh +21 -0
- package/.agents/skills/flockposter/examples/public-api-instagram-reel.json +28 -0
- package/.agents/skills/general-video/SKILL.md +143 -0
- package/.agents/skills/hyperframes/SKILL.md +160 -0
- package/.agents/skills/hyperframes-animation/SKILL.md +84 -0
- package/.agents/skills/hyperframes-animation/adapters/animate-text.md +64 -0
- package/.agents/skills/hyperframes-animation/adapters/animejs.md +114 -0
- package/.agents/skills/hyperframes-animation/adapters/css-animations.md +143 -0
- package/.agents/skills/hyperframes-animation/adapters/gsap-easing-and-stagger.md +118 -0
- package/.agents/skills/hyperframes-animation/adapters/gsap-timeline-and-labels.md +96 -0
- package/.agents/skills/hyperframes-animation/adapters/gsap-transforms-and-perf.md +96 -0
- package/.agents/skills/hyperframes-animation/adapters/gsap.md +105 -0
- package/.agents/skills/hyperframes-animation/adapters/html-in-canvas-patterns.md +507 -0
- package/.agents/skills/hyperframes-animation/adapters/lottie.md +117 -0
- package/.agents/skills/hyperframes-animation/adapters/three.md +131 -0
- package/.agents/skills/hyperframes-animation/adapters/typegpu.md +178 -0
- package/.agents/skills/hyperframes-animation/adapters/waapi.md +101 -0
- package/.agents/skills/hyperframes-animation/blueprints/comparison-split.md +27 -0
- package/.agents/skills/hyperframes-animation/blueprints/constellation-hub.md +44 -0
- package/.agents/skills/hyperframes-animation/blueprints/cta-morph-press.md +28 -0
- package/.agents/skills/hyperframes-animation/blueprints/cursor-ui-demo.md +57 -0
- package/.agents/skills/hyperframes-animation/blueprints/dataviz-countup.md +46 -0
- package/.agents/skills/hyperframes-animation/blueprints/device-surface-showcase.md +53 -0
- package/.agents/skills/hyperframes-animation/blueprints/grid-card-assemble.md +66 -0
- package/.agents/skills/hyperframes-animation/blueprints/kinetic-type-beats.md +78 -0
- package/.agents/skills/hyperframes-animation/blueprints/logo-assemble-lockup.md +69 -0
- package/.agents/skills/hyperframes-animation/blueprints/overwhelm-surround.md +28 -0
- package/.agents/skills/hyperframes-animation/blueprints/spatial-pan-stations.md +37 -0
- package/.agents/skills/hyperframes-animation/blueprints/ticker-takeover.md +29 -0
- package/.agents/skills/hyperframes-animation/blueprints/titlecard-reveal.md +42 -0
- package/.agents/skills/hyperframes-animation/blueprints/typewriter-reveal.md +51 -0
- package/.agents/skills/hyperframes-animation/blueprints/video-text-pivot.md +30 -0
- package/.agents/skills/hyperframes-animation/blueprints-index.md +146 -0
- package/.agents/skills/hyperframes-animation/examples/assets/avatars/02.avif +0 -0
- package/.agents/skills/hyperframes-animation/examples/assets/brands/github.avif +0 -0
- package/.agents/skills/hyperframes-animation/examples/assets/brands/nvidia.avif +0 -0
- package/.agents/skills/hyperframes-animation/examples/assets/brands/visa.avif +0 -0
- package/.agents/skills/hyperframes-animation/examples/assets/brands/zoominfo.avif +0 -0
- package/.agents/skills/hyperframes-animation/examples/brand-reveal-assemble-zoom.html +382 -0
- package/.agents/skills/hyperframes-animation/examples/comparison-split-cards.html +649 -0
- package/.agents/skills/hyperframes-animation/examples/concept-demo-decode-pan.html +520 -0
- package/.agents/skills/hyperframes-animation/examples/cta-morph-press.html +468 -0
- package/.agents/skills/hyperframes-animation/examples/cta-orbit-collapse.html +1298 -0
- package/.agents/skills/hyperframes-animation/examples/demo-page-scroll-spotlight.html +759 -0
- package/.agents/skills/hyperframes-animation/examples/hook-counter-burst.html +729 -0
- package/.agents/skills/hyperframes-animation/examples/messaging-multi-phrase.html +352 -0
- package/.agents/skills/hyperframes-animation/examples/metric-video-text-pivot.html +779 -0
- package/.agents/skills/hyperframes-animation/examples/problem-mockup-overwhelm.html +1374 -0
- package/.agents/skills/hyperframes-animation/examples/proof-logo-chain.html +861 -0
- package/.agents/skills/hyperframes-animation/examples/takeover-ticker-displace.html +347 -0
- package/.agents/skills/hyperframes-animation/examples/workflow-approve-press.html +606 -0
- package/.agents/skills/hyperframes-animation/rules/3d-page-scroll.md +227 -0
- package/.agents/skills/hyperframes-animation/rules/3d-text-depth-layers.md +297 -0
- package/.agents/skills/hyperframes-animation/rules/ai-tracking-box.md +382 -0
- package/.agents/skills/hyperframes-animation/rules/ambient-glow-bloom.md +305 -0
- package/.agents/skills/hyperframes-animation/rules/asr-keyword-glow.md +286 -0
- package/.agents/skills/hyperframes-animation/rules/avatar-cloud-network.md +371 -0
- package/.agents/skills/hyperframes-animation/rules/camera-cursor-tracking.md +246 -0
- package/.agents/skills/hyperframes-animation/rules/card-morph-anchor.md +267 -0
- package/.agents/skills/hyperframes-animation/rules/center-outward-expansion.md +227 -0
- package/.agents/skills/hyperframes-animation/rules/context-sensitive-cursor.md +257 -0
- package/.agents/skills/hyperframes-animation/rules/coordinate-target-zoom.md +332 -0
- package/.agents/skills/hyperframes-animation/rules/counting-dynamic-scale.md +283 -0
- package/.agents/skills/hyperframes-animation/rules/css-marker-patterns.md +373 -0
- package/.agents/skills/hyperframes-animation/rules/cursor-click-ripple.md +262 -0
- package/.agents/skills/hyperframes-animation/rules/depth-of-field-blur.md +313 -0
- package/.agents/skills/hyperframes-animation/rules/depth-scatter-assemble.md +303 -0
- package/.agents/skills/hyperframes-animation/rules/discrete-text-sequence.md +273 -0
- package/.agents/skills/hyperframes-animation/rules/dynamic-content-sequencing.md +307 -0
- package/.agents/skills/hyperframes-animation/rules/gsap-effects.md +299 -0
- package/.agents/skills/hyperframes-animation/rules/hacker-flip-3d.md +223 -0
- package/.agents/skills/hyperframes-animation/rules/kinetic-beat-slam.md +183 -0
- package/.agents/skills/hyperframes-animation/rules/motion-blur-streak.md +328 -0
- package/.agents/skills/hyperframes-animation/rules/multi-phase-camera.md +273 -0
- package/.agents/skills/hyperframes-animation/rules/orbit-3d-entry.md +301 -0
- package/.agents/skills/hyperframes-animation/rules/physics-press-reaction.md +350 -0
- package/.agents/skills/hyperframes-animation/rules/press-release-spring.md +296 -0
- package/.agents/skills/hyperframes-animation/rules/reactive-displacement.md +277 -0
- package/.agents/skills/hyperframes-animation/rules/scale-swap-transition.md +298 -0
- package/.agents/skills/hyperframes-animation/rules/sine-wave-loop.md +278 -0
- package/.agents/skills/hyperframes-animation/rules/split-tilt-cards.md +277 -0
- package/.agents/skills/hyperframes-animation/rules/spring-pop-entrance.md +273 -0
- package/.agents/skills/hyperframes-animation/rules/stat-bars-and-fills.md +156 -0
- package/.agents/skills/hyperframes-animation/rules/svg-icon-enrichment.md +329 -0
- package/.agents/skills/hyperframes-animation/rules/svg-path-draw.md +274 -0
- package/.agents/skills/hyperframes-animation/rules/vertical-spring-ticker.md +239 -0
- package/.agents/skills/hyperframes-animation/rules/viewport-change.md +349 -0
- package/.agents/skills/hyperframes-animation/rules-index.md +86 -0
- package/.agents/skills/hyperframes-animation/scripts/animation-map.mjs +606 -0
- package/.agents/skills/hyperframes-animation/scripts/package-loader.mjs +288 -0
- package/.agents/skills/hyperframes-animation/scripts/package-loader.test.mjs +62 -0
- package/.agents/skills/hyperframes-animation/techniques.md +507 -0
- package/.agents/skills/hyperframes-animation/transitions/TRANSITION-REGISTRY.md +167 -0
- package/.agents/skills/hyperframes-animation/transitions/catalog.md +127 -0
- package/.agents/skills/hyperframes-animation/transitions/css-3d.md +12 -0
- package/.agents/skills/hyperframes-animation/transitions/css-blur.md +51 -0
- package/.agents/skills/hyperframes-animation/transitions/css-cover.md +43 -0
- package/.agents/skills/hyperframes-animation/transitions/css-destruction.md +95 -0
- package/.agents/skills/hyperframes-animation/transitions/css-dissolve.md +66 -0
- package/.agents/skills/hyperframes-animation/transitions/css-distortion.md +45 -0
- package/.agents/skills/hyperframes-animation/transitions/css-grid.md +10 -0
- package/.agents/skills/hyperframes-animation/transitions/css-light.md +49 -0
- package/.agents/skills/hyperframes-animation/transitions/css-mechanical.md +30 -0
- package/.agents/skills/hyperframes-animation/transitions/css-other.md +25 -0
- package/.agents/skills/hyperframes-animation/transitions/css-push.md +41 -0
- package/.agents/skills/hyperframes-animation/transitions/css-radial.md +37 -0
- package/.agents/skills/hyperframes-animation/transitions/css-scale.md +24 -0
- package/.agents/skills/hyperframes-animation/transitions/overview.md +153 -0
- package/.agents/skills/hyperframes-cli/SKILL.md +113 -0
- package/.agents/skills/hyperframes-cli/references/doctor-browser.md +45 -0
- package/.agents/skills/hyperframes-cli/references/init-and-scaffold.md +55 -0
- package/.agents/skills/hyperframes-cli/references/lambda.md +132 -0
- package/.agents/skills/hyperframes-cli/references/lint-validate-inspect.md +121 -0
- package/.agents/skills/hyperframes-cli/references/preview-render.md +149 -0
- package/.agents/skills/hyperframes-cli/references/upgrade-info-misc.md +75 -0
- package/.agents/skills/hyperframes-core/SKILL.md +78 -0
- package/.agents/skills/hyperframes-core/references/composition-patterns.md +263 -0
- package/.agents/skills/hyperframes-core/references/data-attributes.md +70 -0
- package/.agents/skills/hyperframes-core/references/determinism-rules.md +68 -0
- package/.agents/skills/hyperframes-core/references/full-screen-motion.md +62 -0
- package/.agents/skills/hyperframes-core/references/minimal-composition.md +66 -0
- package/.agents/skills/hyperframes-core/references/script-format.md +49 -0
- package/.agents/skills/hyperframes-core/references/storyboard-format.md +95 -0
- package/.agents/skills/hyperframes-core/references/sub-compositions.md +237 -0
- package/.agents/skills/hyperframes-core/references/subagent-dispatch.md +41 -0
- package/.agents/skills/hyperframes-core/references/tailwind.md +125 -0
- package/.agents/skills/hyperframes-core/references/tracks-and-clips.md +76 -0
- package/.agents/skills/hyperframes-core/references/variables-and-media.md +90 -0
- package/.agents/skills/hyperframes-creative/SKILL.md +70 -0
- package/.agents/skills/hyperframes-creative/frame-presets/biennale-yellow/FRAME.md +289 -0
- package/.agents/skills/hyperframes-creative/frame-presets/biennale-yellow/caption-skin.html +221 -0
- package/.agents/skills/hyperframes-creative/frame-presets/biennale-yellow/frame-showcase.html +1214 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blockframe/FRAME.md +275 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blockframe/caption-skin.html +224 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blockframe/frame-showcase.html +1347 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blue-professional/FRAME.md +307 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blue-professional/caption-skin.html +223 -0
- package/.agents/skills/hyperframes-creative/frame-presets/blue-professional/frame-showcase.html +1372 -0
- package/.agents/skills/hyperframes-creative/frame-presets/bold-poster/FRAME.md +275 -0
- package/.agents/skills/hyperframes-creative/frame-presets/bold-poster/caption-skin.html +230 -0
- package/.agents/skills/hyperframes-creative/frame-presets/bold-poster/frame-showcase.html +1140 -0
- package/.agents/skills/hyperframes-creative/frame-presets/broadside/FRAME.md +284 -0
- package/.agents/skills/hyperframes-creative/frame-presets/broadside/caption-skin.html +225 -0
- package/.agents/skills/hyperframes-creative/frame-presets/broadside/frame-showcase.html +1166 -0
- package/.agents/skills/hyperframes-creative/frame-presets/capsule/FRAME.md +284 -0
- package/.agents/skills/hyperframes-creative/frame-presets/capsule/caption-skin.html +224 -0
- package/.agents/skills/hyperframes-creative/frame-presets/capsule/frame-showcase.html +1465 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cartesian/FRAME.md +278 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cartesian/caption-skin.html +222 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cartesian/frame-showcase.html +1263 -0
- package/.agents/skills/hyperframes-creative/frame-presets/claude/FRAME.md +277 -0
- package/.agents/skills/hyperframes-creative/frame-presets/claude/caption-skin.html +224 -0
- package/.agents/skills/hyperframes-creative/frame-presets/claude/frame-showcase.html +1439 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cobalt-grid/FRAME.md +265 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cobalt-grid/caption-skin.html +238 -0
- package/.agents/skills/hyperframes-creative/frame-presets/cobalt-grid/frame-showcase.html +1468 -0
- package/.agents/skills/hyperframes-creative/frame-presets/coral/FRAME.md +314 -0
- package/.agents/skills/hyperframes-creative/frame-presets/coral/caption-skin.html +226 -0
- package/.agents/skills/hyperframes-creative/frame-presets/coral/frame-showcase.html +1268 -0
- package/.agents/skills/hyperframes-creative/frame-presets/creative-mode/FRAME.md +333 -0
- package/.agents/skills/hyperframes-creative/frame-presets/creative-mode/caption-skin.html +227 -0
- package/.agents/skills/hyperframes-creative/frame-presets/creative-mode/frame-showcase.html +1330 -0
- package/.agents/skills/hyperframes-creative/frame-presets/daisy-days/FRAME.md +274 -0
- package/.agents/skills/hyperframes-creative/frame-presets/daisy-days/caption-skin.html +230 -0
- package/.agents/skills/hyperframes-creative/frame-presets/daisy-days/frame-showcase.html +1444 -0
- package/.agents/skills/hyperframes-creative/frame-presets/editorial-forest/FRAME.md +265 -0
- package/.agents/skills/hyperframes-creative/frame-presets/editorial-forest/caption-skin.html +223 -0
- package/.agents/skills/hyperframes-creative/frame-presets/editorial-forest/frame-showcase.html +1273 -0
- package/.agents/skills/hyperframes-creative/palettes/bold-energetic.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/clean-corporate.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/dark-premium.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/jewel-rich.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/monochrome.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/nature-earth.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/neon-electric.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/pastel-soft.md +14 -0
- package/.agents/skills/hyperframes-creative/palettes/warm-editorial.md +14 -0
- package/.agents/skills/hyperframes-creative/references/audio-reactive.md +76 -0
- package/.agents/skills/hyperframes-creative/references/beat-direction.md +164 -0
- package/.agents/skills/hyperframes-creative/references/composition-patterns.md +199 -0
- package/.agents/skills/hyperframes-creative/references/data-in-motion.md +19 -0
- package/.agents/skills/hyperframes-creative/references/design-adherence.md +19 -0
- package/.agents/skills/hyperframes-creative/references/design-picker.md +123 -0
- package/.agents/skills/hyperframes-creative/references/design-spec.md +55 -0
- package/.agents/skills/hyperframes-creative/references/house-style.md +73 -0
- package/.agents/skills/hyperframes-creative/references/motion-principles.md +150 -0
- package/.agents/skills/hyperframes-creative/references/narration.md +92 -0
- package/.agents/skills/hyperframes-creative/references/prompt-expansion.md +68 -0
- package/.agents/skills/hyperframes-creative/references/typography.md +218 -0
- package/.agents/skills/hyperframes-creative/references/video-composition.md +63 -0
- package/.agents/skills/hyperframes-creative/references/visual-styles.md +457 -0
- package/.agents/skills/hyperframes-creative/scripts/contrast-report.mjs +353 -0
- package/.agents/skills/hyperframes-creative/scripts/extract-audio-data.py +188 -0
- package/.agents/skills/hyperframes-creative/scripts/package-loader.mjs +288 -0
- package/.agents/skills/hyperframes-creative/scripts/package-loader.test.mjs +62 -0
- package/.agents/skills/hyperframes-creative/templates/design-picker.html +1432 -0
- package/.agents/skills/hyperframes-keyframes/SKILL.md +237 -0
- package/.agents/skills/hyperframes-keyframes/agents/openai.yaml +4 -0
- package/.agents/skills/hyperframes-keyframes/references/keyframe-patterns.md +106 -0
- package/.agents/skills/motion-graphics/SKILL.md +172 -0
- package/.agents/skills/motion-graphics/agents/builder.md +40 -0
- package/.agents/skills/motion-graphics/agents/director.md +53 -0
- package/.agents/skills/motion-graphics/agents/finalize.md +17 -0
- package/.agents/skills/motion-graphics/catalog-map.md +40 -0
- package/.agents/skills/motion-graphics/categories/asset-fusion/module.md +37 -0
- package/.agents/skills/motion-graphics/categories/charts/module.md +21 -0
- package/.agents/skills/motion-graphics/categories/kinetic-type/module.md +19 -0
- package/.agents/skills/motion-graphics/categories/logo-reveal/module.md +17 -0
- package/.agents/skills/motion-graphics/categories/lower-thirds/module.md +16 -0
- package/.agents/skills/motion-graphics/categories/maps/bake-basemap.mjs +273 -0
- package/.agents/skills/motion-graphics/categories/maps/module.md +61 -0
- package/.agents/skills/motion-graphics/categories/news/module.md +56 -0
- package/.agents/skills/motion-graphics/categories/stat/module.md +21 -0
- package/.agents/skills/motion-graphics/categories/tweet/module.md +16 -0
- package/.agents/skills/motion-graphics/categories/webpage/module.md +21 -0
- package/.agents/skills/motion-graphics/grounding/PROTOCOL.md +64 -0
- package/.agents/skills/motion-graphics/grounding/locate.mjs +227 -0
- package/.agents/skills/motion-graphics/phases/source/guide.md +21 -0
- package/.agents/skills/motion-graphics/references/builder-contract.md +38 -0
- package/.agents/skills/motion-graphics/references/motion-vocabulary.md +43 -0
- package/.agents/skills/motion-graphics/references/shot-plan-ir.md +54 -0
- package/.agents/skills/motion-graphics/samples/asset-fusion/_ref-circle-highlight.html +306 -0
- package/.agents/skills/product-launch-video/SKILL.md +208 -0
- package/.agents/skills/product-launch-video/references/cut-catalog.md +220 -0
- package/.agents/skills/product-launch-video/references/motion-language.md +156 -0
- package/.agents/skills/product-launch-video/references/story-design.md +373 -0
- package/.agents/skills/product-launch-video/references/visual-design.md +126 -0
- package/.agents/skills/product-launch-video/scripts/assemble-index.mjs +570 -0
- package/.agents/skills/product-launch-video/scripts/audio.mjs +260 -0
- package/.agents/skills/product-launch-video/scripts/build-frame.mjs +536 -0
- package/.agents/skills/product-launch-video/scripts/captions.mjs +508 -0
- package/.agents/skills/product-launch-video/scripts/lib/assets.mjs +55 -0
- package/.agents/skills/product-launch-video/scripts/lib/dimensions.mjs +45 -0
- package/.agents/skills/product-launch-video/scripts/lib/pad-frame-duration.mjs +36 -0
- package/.agents/skills/product-launch-video/scripts/lib/pad-frame-duration.test.mjs +76 -0
- package/.agents/skills/product-launch-video/scripts/lib/storyboard.mjs +249 -0
- package/.agents/skills/product-launch-video/scripts/lib/tokens.mjs +204 -0
- package/.agents/skills/product-launch-video/scripts/lib/transition-registry.mjs +38 -0
- package/.agents/skills/product-launch-video/scripts/lib/transitions.json +71 -0
- package/.agents/skills/product-launch-video/scripts/stage-assets.mjs +39 -0
- package/.agents/skills/product-launch-video/scripts/transitions.mjs +327 -0
- package/.agents/skills/product-launch-video/sub-agents/frame-worker.md +75 -0
- package/.agents/skills/slideshow/SKILL.md +550 -0
- package/.agents/skills/slideshow/references/standalone-harness.md +1020 -0
- package/.agents/skills/talking-head-recut/NOTICE.md +39 -0
- package/.agents/skills/talking-head-recut/SKILL.md +1195 -0
- package/.agents/skills/talking-head-recut/assets/vendor/gsap.min.js +10 -0
- package/.agents/skills/talking-head-recut/references/DESIGN_INDEX.md +145 -0
- package/.agents/skills/talking-head-recut/references/frames/clean.html +92 -0
- package/.agents/skills/talking-head-recut/references/frames/hairline.html +171 -0
- package/.agents/skills/talking-head-recut/references/frames/polaroid.html +131 -0
- package/.agents/skills/talking-head-recut/references/layouts/overlay.html +164 -0
- package/.agents/skills/talking-head-recut/references/layouts/pip.html +143 -0
- package/.agents/skills/talking-head-recut/references/layouts/split.html +121 -0
- package/.agents/skills/talking-head-recut/references/layouts/stack.html +109 -0
- package/.agents/skills/talking-head-recut/references/styles/academic.html +172 -0
- package/.agents/skills/talking-head-recut/references/styles/audit.html +170 -0
- package/.agents/skills/talking-head-recut/references/styles/editorial.html +189 -0
- package/.agents/skills/talking-head-recut/references/styles/geom.html +181 -0
- package/.agents/skills/talking-head-recut/references/styles/minimal.html +130 -0
- package/.agents/skills/talking-head-recut/references/styles/spotlight.html +142 -0
- package/.agents/skills/talking-head-recut/references/styles/swiss.html +188 -0
- package/.agents/skills/talking-head-recut/references/styles/terminal.html +196 -0
- package/.agents/skills/talking-head-recut/references/styles/whiteboard.html +170 -0
- package/.agents/skills/talking-head-recut/references/styles/xhs.html +206 -0
- package/.agents/skills/vidfarm-media/SKILL.md +85 -0
- package/.agents/skills/vidfarm-media/references/tts.md +54 -0
- package/.agents/skills/vidfarm-media/scripts/audio.mjs +628 -0
- package/.agents/skills/vidfarm-media/scripts/wait-bgm.mjs +31 -0
- package/.agents/skills/website-to-video/SKILL.md +145 -0
- package/.agents/skills/website-to-video/assets/sfx/CREDITS.md +35 -0
- package/.agents/skills/website-to-video/assets/sfx/manifest.json +97 -0
- package/.agents/skills/website-to-video/references/beat-builder-guide.md +263 -0
- package/.agents/skills/website-to-video/references/capabilities.md +713 -0
- package/.agents/skills/website-to-video/references/step-0-capture.md +55 -0
- package/.agents/skills/website-to-video/references/step-1-design.md +333 -0
- package/.agents/skills/website-to-video/references/step-2-brief.md +178 -0
- package/.agents/skills/website-to-video/references/step-3-storyboard.md +572 -0
- package/.agents/skills/website-to-video/references/step-4-vo.md +225 -0
- package/.agents/skills/website-to-video/references/step-5-build.md +483 -0
- package/.agents/skills/website-to-video/references/step-6-validate.md +341 -0
- package/.agents/skills/website-to-video/scripts/w2h-verify.mjs +759 -0
- package/SKILL.director.md +37 -0
- package/SKILL.platform.md +6 -1
- package/demo/dist/app.js +295 -11
- package/dist/src/app.js +317 -133
- package/dist/src/cli.js +529 -12
- package/dist/src/composition-runtime.js +262 -3
- package/dist/src/devcli/doctor.js +192 -0
- package/dist/src/devcli/hyperframes-cli.js +118 -0
- package/dist/src/devcli/skills.js +476 -0
- package/dist/src/devcli/stills.js +249 -0
- package/dist/src/editor-chat.js +255 -0
- package/dist/src/hyperframes/composition.js +5 -5
- package/dist/src/services/composition-lint.js +199 -0
- package/dist/src/services/hyperframes.js +67 -13
- package/package.json +2 -1
|
@@ -0,0 +1,238 @@
|
|
|
1
|
+
# Layout Heuristics
|
|
2
|
+
|
|
3
|
+
How to pick `wall_position` / `crown_position` in plan.json.
|
|
4
|
+
|
|
5
|
+
## Step 1: Sample 3 frames
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
ffmpeg -y -ss 0.5 -i source.mp4 -vframes 1 frame0.jpg
|
|
9
|
+
ffmpeg -y -ss <mid> -i source.mp4 -vframes 1 frame1.jpg
|
|
10
|
+
ffmpeg -y -ss <end-0.5> -i source.mp4 -vframes 1 frame2.jpg
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
Read all three. Note: subject's head bbox, shoulder top line, and wherever hands move during gestures. Worst-case foreground envelope = union across all 3.
|
|
14
|
+
|
|
15
|
+
## Step 2: Find the clean zone
|
|
16
|
+
|
|
17
|
+
The caption plane should live in pixels that are **always background** across the clip. Never where the body lands.
|
|
18
|
+
|
|
19
|
+
Annotate approximate ranges:
|
|
20
|
+
|
|
21
|
+
- Head bbox: `head_x_min`, `head_x_max`, `head_y_min`, `head_y_max`
|
|
22
|
+
- Hand gesture envelope (if any): usually below `y = shoulder_top ≈ head_y_max + 40`
|
|
23
|
+
- Props (mic, cup): typically static, note bbox
|
|
24
|
+
|
|
25
|
+
**Clean zones**, in priority order:
|
|
26
|
+
|
|
27
|
+
1. **Corner farthest from head** (usually opposite the gaze direction)
|
|
28
|
+
2. **Upper strip above head_y_min minus 30px margin**
|
|
29
|
+
3. **Lower-third** if upper is occupied (last resort — breaks "embedded" aesthetic)
|
|
30
|
+
|
|
31
|
+
## Step 2.5: Which side of the subject?
|
|
32
|
+
|
|
33
|
+
Once you know where the subject and baked graphics are, decide which side (left or right of the subject) hosts the caption column. Order of precedence:
|
|
34
|
+
|
|
35
|
+
### 1. Hard constraints first — baked graphics
|
|
36
|
+
|
|
37
|
+
Logos, watermarks, date stamps, "60 Overtime"-style lower-thirds are already in the source. They occupy permanent zones you must avoid. Map them out from frame samples:
|
|
38
|
+
|
|
39
|
+
- Jobs 60 Minutes: "2003" at upper-left (x=280-460, y=30-90); "60 Overtime" at bottom-left (x=280-770, y=960-1080). Left side partially constrained; still usable above/below these.
|
|
40
|
+
- TikTok re-uploads: username watermark that rotates corners every few seconds — hard to plan around, often a refusal reason.
|
|
41
|
+
|
|
42
|
+
If one side has a hard constraint that eats > 60% of that side's clean zone, default to the other side.
|
|
43
|
+
|
|
44
|
+
### 2. Subject body bias — pick the bigger clean zone
|
|
45
|
+
|
|
46
|
+
Compute clean-zone widths on both sides:
|
|
47
|
+
|
|
48
|
+
```
|
|
49
|
+
left_clean_width = body_x_min − safe_left_margin
|
|
50
|
+
right_clean_width = safe_right_margin − body_x_max
|
|
51
|
+
```
|
|
52
|
+
|
|
53
|
+
Pick the side where clean zone is wider. If the difference is within 10% of frame width, the sides are ~equivalent → fall through to step 3.
|
|
54
|
+
|
|
55
|
+
Worked examples:
|
|
56
|
+
|
|
57
|
+
- **Champion** (Djokovic, 1920×1080): body x ≈ 550-1200. Left clean = 510, right clean = 720. Right is wider → but we put captions LEFT because of gaze (see step 3). The narrow difference made either workable.
|
|
58
|
+
- **Jobs**: body x ≈ 700-1480 (right-of-center). Left clean = 420, right clean = 160. Left wins decisively. Captions went LEFT.
|
|
59
|
+
- **Memory Wall**: surface location dictated the side (see note below about wall-embed).
|
|
60
|
+
|
|
61
|
+
### 3. Gaze direction — the "looking room" rule (tiebreaker and aesthetic)
|
|
62
|
+
|
|
63
|
+
Classic cinematic framing: leave more empty space on the side the subject is **looking toward**. This preserves their gaze path and feels uncluttered. **Captions go to the OPPOSITE side** (the side the subject is facing away from), so they don't steal looking room.
|
|
64
|
+
|
|
65
|
+
Quick check: sample 3 frames. Estimate the eye-line vector. Does it point more left or right?
|
|
66
|
+
|
|
67
|
+
- Looking screen-right → captions on LEFT
|
|
68
|
+
- Looking screen-left → captions on RIGHT
|
|
69
|
+
- Looking forward at camera → no preference from gaze, use step 2 only
|
|
70
|
+
|
|
71
|
+
The champion / Djokovic shot has him addressing camera slightly from the left — captions on LEFT actually read like text he's looking toward, which can feel like he's acknowledging them. That's fine here but is a flavor choice; generally prefer gaze-opposite.
|
|
72
|
+
|
|
73
|
+
### 4. Narrative emphasis (for optional crown)
|
|
74
|
+
|
|
75
|
+
If you're using a **center-stage crown**, it sits across the subject — no left/right choice for it. But the other captions (the column) still follow steps 1-3.
|
|
76
|
+
|
|
77
|
+
If you're using a **clean-zone crown** (shrunk, placed in one clean zone instead of crossing the body), put it in the **same side as the main column** for visual consistency. Don't split crown and column on opposite sides — it creates ping-pong.
|
|
78
|
+
|
|
79
|
+
### Special case — wall-embed
|
|
80
|
+
|
|
81
|
+
When the template is `wall-embed`, the side is **dictated by where the usable surface is**, not by body bias or gaze. Memory Wall's foam panel was on the right, so captions went right even though the subject was slightly left-of-center. Surface location wins because the whole effect depends on the text sitting ON that specific surface.
|
|
82
|
+
|
|
83
|
+
### Decision summary
|
|
84
|
+
|
|
85
|
+
```
|
|
86
|
+
Side = f(baked graphics, body bias, gaze, surface)
|
|
87
|
+
|
|
88
|
+
priority:
|
|
89
|
+
1. Hard constraints (baked logos) — never place here
|
|
90
|
+
2. Wall-embed surface location — wins if using wall-embed
|
|
91
|
+
3. Bigger clean zone — default for corner-column
|
|
92
|
+
4. Gaze direction (looking room) — tiebreaker when both sides similar
|
|
93
|
+
```
|
|
94
|
+
|
|
95
|
+
If the subject actively swings their gaze across the clip (turning head L→R), pick a side that works for both extremes, not just the most frequent. Or accept that looking room will briefly be violated — it's a 10-second video, nobody cares.
|
|
96
|
+
|
|
97
|
+
## Step 3: Pick template + position
|
|
98
|
+
|
|
99
|
+
### If scene has a flat back wall (acoustic foam, plaster, fabric backdrop)
|
|
100
|
+
|
|
101
|
+
→ `wall-embed.html`
|
|
102
|
+
|
|
103
|
+
```
|
|
104
|
+
wall_position: {
|
|
105
|
+
top: max(40, head_y_min - 40),
|
|
106
|
+
right: 20-60 (hug outer edge),
|
|
107
|
+
width: video_width * 0.35 – 0.50,
|
|
108
|
+
height: shoulder_top - top,
|
|
109
|
+
rotateY: -10 to -16 deg if wall angles away on the left,
|
|
110
|
+
+10 to +16 deg if mirrored, 0 if wall is parallel,
|
|
111
|
+
rotateX: 0-3 deg subtle downtilt only
|
|
112
|
+
}
|
|
113
|
+
```
|
|
114
|
+
|
|
115
|
+
`mix-blend-mode: overlay` in this template — works on mid-tone walls. If wall is near-black (luminance < 60), switch CSS to `screen`.
|
|
116
|
+
|
|
117
|
+
### If scene has a cluttered but dark backdrop (bookshelf, plants, set dressing)
|
|
118
|
+
|
|
119
|
+
→ `corner-column-crown.html`
|
|
120
|
+
|
|
121
|
+
```
|
|
122
|
+
wall_position: {
|
|
123
|
+
top: 40,
|
|
124
|
+
left: 40, // anchor to clean corner opposite head
|
|
125
|
+
width: video_width * 0.40,
|
|
126
|
+
height: clamp(360, 520), // don't reach below shoulder top
|
|
127
|
+
rotateY: 3-6 deg (subtle, not flashy)
|
|
128
|
+
}
|
|
129
|
+
crown_position: {
|
|
130
|
+
top: video_height * 0.40 // center-ish; body will cut middle letters
|
|
131
|
+
}
|
|
132
|
+
```
|
|
133
|
+
|
|
134
|
+
`mix-blend-mode: screen` is correct here (bookshelf is dark).
|
|
135
|
+
|
|
136
|
+
### If subject fills >70% of frame
|
|
137
|
+
|
|
138
|
+
Template doesn't matter — there's nowhere clean. **Refuse**, suggest classic lower-third.
|
|
139
|
+
|
|
140
|
+
## Step 3.5: Crown placement (when using `corner-column-crown`)
|
|
141
|
+
|
|
142
|
+
**Default preference: center-stage crown.** A big, centered crown word (think "WIMBLEDON CHAMPION", "BEATLES", "SHARP AGAIN") that crosses the subject is the most powerful embed move — body occludes the middle letters, clean zones on both sides hold the outer letters, and the word reads as a title drop. **Use this whenever conditions allow.**
|
|
143
|
+
|
|
144
|
+
### Conditions where a centered crown works
|
|
145
|
+
|
|
146
|
+
Sample 3 frames, eyeball the subject's horizontal envelope across the clip. Let `body_x_min / body_x_max` = tightest horizontal bounds that contain the head+shoulders+arms in any frame.
|
|
147
|
+
|
|
148
|
+
A centered crown at font size F (where `crown_width ≈ F × 0.55 × char_count`) reads as dramatic IF:
|
|
149
|
+
|
|
150
|
+
1. **Subject is roughly centered**: `|body_center_x − frame_width/2| < frame_width × 0.10`. The body sits in the middle third.
|
|
151
|
+
2. **Clean zones on both sides are non-trivial**: `body_x_min > frame_width × 0.15` AND `body_x_max < frame_width × 0.85`. There's ≥15% of frame width clean on each side.
|
|
152
|
+
3. **The crown word is wide enough to poke out both sides**: `crown_width > body_width + 400px`. If the word ends before reaching the body's right edge, most letters just get swallowed — ugly.
|
|
153
|
+
|
|
154
|
+
If all three hold, centered crown is right. Go big — font sized so the word spans `0.8 × frame_width` or more. "BEATLES" at 140px (~500px wide) fails condition 3 on an 1920 frame with Jobs-sized body (780px wide). "WIMBLEDON CHAMPION" at 140px (~1700px) on the same frame passes easily.
|
|
155
|
+
|
|
156
|
+
### When center fails — move crown to the clean zone
|
|
157
|
+
|
|
158
|
+
If any of the three conditions fails, center-stage eats too much and the word becomes illegible ("THE BEATLES" → "THE" and a sliver of "S"). Two strategies:
|
|
159
|
+
|
|
160
|
+
**Option A — shrink crown to fit cleanly in the larger clean zone.** Pick the side opposite the subject's bias. Compute `clean_zone_width` on that side. Pick crown font such that the word wraps to 1-2 lines inside it. Tail letters can touch the subject edge for a hint of embed, but the body of the word lives on backdrop.
|
|
161
|
+
|
|
162
|
+
```
|
|
163
|
+
// Jobs: subject center ≈ x=1100 (right of frame center 960). Left clean zone is larger.
|
|
164
|
+
crown_plane: { left: 200, width: 560, text-align: center }
|
|
165
|
+
font-size: 118px → "THE / BEATLES" wraps to 2 lines, fits in x=230-770
|
|
166
|
+
leaving "S" tail at x~760 lightly touching Jobs's shoulder
|
|
167
|
+
```
|
|
168
|
+
|
|
169
|
+
**Option B — drop the crown entirely, promote the word to `emph` in the main column.** Simpler when the phrase doesn't deserve dramatic center-stage treatment. Works fine for 2-word emph like "the Beatles" or "incredible things" — they become large bold text in the left column with body occluding their tails.
|
|
170
|
+
|
|
171
|
+
### Rules of thumb for choosing
|
|
172
|
+
|
|
173
|
+
| Subject occupies center X%+ of frame | Clean zones L/R | Crown approach |
|
|
174
|
+
| ------------------------------------ | ------------------------ | ----------------------------------------------- |
|
|
175
|
+
| < 50%, roughly centered | both ≥ 15% of width | Centered crown, go BIG (frame_w × 0.8+) |
|
|
176
|
+
| 50-70%, slightly offset | one side ≥ 25% | Crown shifted to larger clean zone |
|
|
177
|
+
| > 70%, fills most of frame | neither side wide enough | Drop crown, use `emph` in column |
|
|
178
|
+
| Close-crop face, fills > 80% | essentially none | No crown. All captions in a header/footer strip |
|
|
179
|
+
|
|
180
|
+
## Step 4: Respect these invariants
|
|
181
|
+
|
|
182
|
+
1. **Never cover the eyes.** Eye bbox is sacred. Add 20px margin around it when checking caption bbox intersection.
|
|
183
|
+
2. **Caption bbox must not exit frame.** Reserve 4% broadcast-safe margin on all edges.
|
|
184
|
+
3. **Large emphasis words should have horizontal slack.** At `cap-emph` (92px), an 8-char word ≈ 580px. Plane needs ≥ 620px width OR rely on wrapping at 2 lines.
|
|
185
|
+
4. **Crown lives at `top ≈ shoulder_top − crown_font_size/2`** so it sits across the upper body, not the face.
|
|
186
|
+
5. **If aspect ratio is portrait (9:16), rotate layout**: wall-plane becomes a **top band** (full width, height ≈ 20%), crown goes below it if used at all.
|
|
187
|
+
|
|
188
|
+
## Step 5: Validate before render
|
|
189
|
+
|
|
190
|
+
Before calling `render-and-composite.sh`, sanity check:
|
|
191
|
+
|
|
192
|
+
- Did you place the plane in the opposite quadrant from the face? ✓
|
|
193
|
+
- Does the plane exit the frame anywhere? If yes, shrink.
|
|
194
|
+
- Is the font too big for the plane width? Calculate: longest word in words[] × 0.55 × font_size < plane_width - padding\*2.
|
|
195
|
+
- For `corner-column-crown`, did you set `crown_position.top` so the crown actually crosses the body (not above the head, not below the torso)?
|
|
196
|
+
- **Pillarbox / letterbox hard check.** If the source has black bars (see pre-flight probe in SKILL.md), compute `leftmost_text_x` using the correct formula for the text alignment:
|
|
197
|
+
|
|
198
|
+
| Alignment | Formula |
|
|
199
|
+
| --------------------------- | -------------------------------------------------- |
|
|
200
|
+
| Left-aligned | `plane_left + padding_left` |
|
|
201
|
+
| Right-aligned (main column) | `plane_right − padding_right − longest_word_width` |
|
|
202
|
+
| Center-aligned (crown) | `plane_center − longest_word_width / 2` |
|
|
203
|
+
|
|
204
|
+
Where `longest_word_width ≈ font_size × char_count × 0.55` (adjust 0.55 down to ~0.50 for italic, up to ~0.62 for uppercase bold). **All** of these must be ≥ `pillarbox_left_edge + 10–20px` (safety margin). Mirror for the right bar.
|
|
205
|
+
|
|
206
|
+
**Gotcha from past iteration**: setting `plane_left = 180` with a right-aligned column on a Jobs 60 Minutes clip (pillarbox at 280) looked "inside the plane" but the right-aligned text at font 108px produced `leftmost = plane_right − padding − 468 = 180 + 700 − 36 − 468 = 376` … wait, that IS past pillarbox. The actual bug was different: for a 3-line wrap ("four very / talented / guys") the widest line is "talented" at ~468px, not the whole phrase. Compute against the longest **single line** after wrap, not total phrase width.
|
|
207
|
+
|
|
208
|
+
**Re-check after font-size changes** — bumping font 84→104 shifts right-aligned text leftward by ~30px. If the budget was already tight, the bump blows through the pillarbox.
|
|
209
|
+
|
|
210
|
+
**Empirical target**: leftmost text at pillarbox + 10-20px looks "anchored" to the bar (visually grounded). Pushing it much deeper (50px+) makes captions feel floaty in the middle of the frame.
|
|
211
|
+
|
|
212
|
+
## Worked examples
|
|
213
|
+
|
|
214
|
+
### memory-wall (1280×720, acoustic foam wall)
|
|
215
|
+
|
|
216
|
+
```json
|
|
217
|
+
{
|
|
218
|
+
"template": "wall-embed",
|
|
219
|
+
"wall_position": {
|
|
220
|
+
"top": 40,
|
|
221
|
+
"right": 30,
|
|
222
|
+
"width": 720,
|
|
223
|
+
"height": 520,
|
|
224
|
+
"rotateY": -13,
|
|
225
|
+
"rotateX": 1
|
|
226
|
+
}
|
|
227
|
+
}
|
|
228
|
+
```
|
|
229
|
+
|
|
230
|
+
### champion (1920×1080, bookshelf backdrop)
|
|
231
|
+
|
|
232
|
+
```json
|
|
233
|
+
{
|
|
234
|
+
"template": "corner-column-crown",
|
|
235
|
+
"wall_position": { "top": 40, "left": 40, "width": 720, "height": 420, "rotateY": 4 },
|
|
236
|
+
"crown_position": { "top": 440 }
|
|
237
|
+
}
|
|
238
|
+
```
|
|
@@ -0,0 +1,148 @@
|
|
|
1
|
+
# Motion Vocabulary — named word-entry moves
|
|
2
|
+
|
|
3
|
+
10 motion primitives the skill uses. Each has a specific timing + easing + situational fit. Agent picks by **content tone**, not default to one.
|
|
4
|
+
|
|
5
|
+
**Easing philosophy:** `cubic-bezier(.2,.7,.2,1)` is the "considered confident" default. `linear` is almost always wrong. Back-easing (elastic) is for playful content only — never documentary.
|
|
6
|
+
|
|
7
|
+
**Exit rules:** Default exit is the same tween reversed at 60% duration. Never exit with a different motion than entry unless doing a rhetorical pivot. Never fade out during speech — only during the gap between phrases.
|
|
8
|
+
|
|
9
|
+
---
|
|
10
|
+
|
|
11
|
+
## The 10 moves
|
|
12
|
+
|
|
13
|
+
### 1. typewriter
|
|
14
|
+
|
|
15
|
+
Char-by-char reveal, 25–35ms/char, linear easing. Documentary / data-heavy / tense / interrogative.
|
|
16
|
+
|
|
17
|
+
```js
|
|
18
|
+
// GSAP
|
|
19
|
+
words.forEach((w, i) => {
|
|
20
|
+
const chars = w.textContent.split("");
|
|
21
|
+
w.textContent = "";
|
|
22
|
+
chars.forEach((c, j) => {
|
|
23
|
+
const span = document.createElement("span");
|
|
24
|
+
span.textContent = c;
|
|
25
|
+
span.style.opacity = 0;
|
|
26
|
+
w.appendChild(span);
|
|
27
|
+
tl.to(span, { opacity: 1, duration: 0 }, wordStart + j * 0.028);
|
|
28
|
+
});
|
|
29
|
+
});
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### 2. word-fade-up (DEFAULT)
|
|
33
|
+
|
|
34
|
+
Per-word, 80ms stagger, `opacity 0→1 + translateY 8→0`, `cubic-bezier(.2,.7,.2,1)` (ease-out). Default for conversational content.
|
|
35
|
+
|
|
36
|
+
```js
|
|
37
|
+
tl.fromTo(
|
|
38
|
+
word,
|
|
39
|
+
{ opacity: 0, y: 8 },
|
|
40
|
+
{ opacity: 1, y: 0, duration: 0.45, ease: "power2.out" },
|
|
41
|
+
wordStart,
|
|
42
|
+
);
|
|
43
|
+
```
|
|
44
|
+
|
|
45
|
+
### 3. word-pop
|
|
46
|
+
|
|
47
|
+
Per-word, 60ms stagger, `scale 0.85→1 + opacity 0→1`, elastic-light `cubic-bezier(.34,1.56,.64,1)`. Energetic / YouTube-vlog / high-tempo. **Never for documentary.**
|
|
48
|
+
|
|
49
|
+
### 4. swipe-reveal
|
|
50
|
+
|
|
51
|
+
Whole phrase at once, 400ms, `clip-path inset 0 100% 0 0 → 0 0 0 0`, expo `cubic-bezier(.77,0,.175,1)`. Keynote / tech product / announcement.
|
|
52
|
+
|
|
53
|
+
```css
|
|
54
|
+
.cap {
|
|
55
|
+
clip-path: inset(0 100% 0 0);
|
|
56
|
+
}
|
|
57
|
+
/* animate to inset(0 0 0 0) */
|
|
58
|
+
```
|
|
59
|
+
|
|
60
|
+
### 5. drop-and-settle
|
|
61
|
+
|
|
62
|
+
Per-word, 120ms stagger, `y: -30→0` with back-bounce `cubic-bezier(.68,-.55,.27,1.55)`. Playful but controlled. **Not for documentary.**
|
|
63
|
+
|
|
64
|
+
### 6. etch
|
|
65
|
+
|
|
66
|
+
Whole word at once, 600ms, opacity ramp `0→1` with slight blur→sharp transition. Ease-in-out. Poetic / lyrical / "quote on wall" direction.
|
|
67
|
+
|
|
68
|
+
### 7. crosshair
|
|
69
|
+
|
|
70
|
+
Per-word, 200ms total: two 1px lines converge on word center (linear 150ms), then word snaps in (expo-out 50ms). Thriller / investigative doc.
|
|
71
|
+
|
|
72
|
+
### 8. breathing-hold
|
|
73
|
+
|
|
74
|
+
**Static but alive.** No entry animation. Once visible, micro-scale loop `1.00↔1.008` over 2s, sine ease. Used on climax lines held 1.5s+.
|
|
75
|
+
|
|
76
|
+
### 9. cascade
|
|
77
|
+
|
|
78
|
+
Each word from alternating direction: L, R, L, R. `translateX: ±40→0`, ease-out 300ms. **Rhythm-break move** — use sparingly, once per 30s max.
|
|
79
|
+
|
|
80
|
+
### 10. burn-in
|
|
81
|
+
|
|
82
|
+
**Zero animation.** Sudden 1-frame opacity 1. No fade, no transform. Interview-doc style. Use for every 6–8th phrase in a documentary direction for variety (Standard mode; see direction-catalog §1).
|
|
83
|
+
|
|
84
|
+
---
|
|
85
|
+
|
|
86
|
+
## Tone → timing lookup table
|
|
87
|
+
|
|
88
|
+
| Tone | Stagger | Hold | Entry move |
|
|
89
|
+
| -------------- | ------------------------- | ----------- | ---------------------------------- |
|
|
90
|
+
| documentary | 150ms | 600ms | burn-in (70%) + word-fade-up (30%) |
|
|
91
|
+
| conversational | 80ms | 400ms | word-fade-up |
|
|
92
|
+
| energetic | 50ms | 300ms | word-pop |
|
|
93
|
+
| poetic | 250ms | 1200ms | etch |
|
|
94
|
+
| broadcast | 0 (burn-in) | BBC timings | burn-in |
|
|
95
|
+
| investigative | 25ms/char | 500ms | typewriter |
|
|
96
|
+
| keynote | 0 per-word (phrase swipe) | 600ms | swipe-reveal |
|
|
97
|
+
|
|
98
|
+
Agent picks tone → this table → GSAP parameters. Data, not guesswork.
|
|
99
|
+
|
|
100
|
+
---
|
|
101
|
+
|
|
102
|
+
## Per-word vs per-phrase animation axis
|
|
103
|
+
|
|
104
|
+
Orthogonal to the 10 moves above.
|
|
105
|
+
|
|
106
|
+
- **Per-word animation** (default): each word enters at its `w.start` timestamp. Tight sync with speech.
|
|
107
|
+
- **Per-phrase animation**: whole group enters/exits at `g.in`/`g.out`. Words appear together. Used for:
|
|
108
|
+
- swipe-reveal moves
|
|
109
|
+
- burn-in (no animation, but the "reveal" is a group event)
|
|
110
|
+
- title cards / chapter breaks
|
|
111
|
+
|
|
112
|
+
Rule: per-word for content that tracks speech; per-phrase for moments that step outside the speech flow.
|
|
113
|
+
|
|
114
|
+
---
|
|
115
|
+
|
|
116
|
+
## Stagger breakdown by context
|
|
117
|
+
|
|
118
|
+
Fine-tune stagger within a tone:
|
|
119
|
+
|
|
120
|
+
- **Documentary dialog**: 150ms (measured)
|
|
121
|
+
- **Documentary punchline**: 250ms (weighted)
|
|
122
|
+
- **Vlog opener**: 50ms (fast hook)
|
|
123
|
+
- **Vlog narration**: 70ms (conversational but snappy)
|
|
124
|
+
- **Poem / lyric**: 250–400ms per word, with 500–1000ms gaps between phrases
|
|
125
|
+
- **Keynote hero**: per-phrase only (stagger = N/A)
|
|
126
|
+
- **Interview name card**: 0 stagger (static)
|
|
127
|
+
|
|
128
|
+
---
|
|
129
|
+
|
|
130
|
+
## Anti-patterns (banned, from anti-patterns.md)
|
|
131
|
+
|
|
132
|
+
- Animating `letter-spacing` → reflow
|
|
133
|
+
- Animating `filter:blur` → reflow + can wash out text
|
|
134
|
+
- `Math.random()` / `Date.now()` in timeline → non-deterministic render
|
|
135
|
+
- Entries under 100ms total → frantic, unreadable
|
|
136
|
+
- Same motion for every group for 30s+ → eye adapts, stops registering
|
|
137
|
+
|
|
138
|
+
---
|
|
139
|
+
|
|
140
|
+
## When to break the vocabulary
|
|
141
|
+
|
|
142
|
+
The 10 moves are a comfortable coverage, not a ceiling. For Standard mode, invent new moves when the scene demands it:
|
|
143
|
+
|
|
144
|
+
- Kyle Cooper's scratched typewriter for noir
|
|
145
|
+
- K-pop lyric's directional word-from-side
|
|
146
|
+
- Film-title flash-cut burn-in with chromatic aberration
|
|
147
|
+
|
|
148
|
+
When inventing: stay deterministic, stay transform+opacity only, state the motion in terms of the 4 axes (entry, hold, exit, stagger).
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
# Rail track — standard lower-third subtitle
|
|
2
|
+
|
|
3
|
+
The **default** caption track and the workhorse: a clean, readable subtitle that sits **in
|
|
4
|
+
front** of everything (never occluded by the matte) in the lower third. It carries **most**
|
|
5
|
+
of the transcript. It is deliberately **plain** — the cinematic craft (planes, occlusion,
|
|
6
|
+
Vogue-masthead, accumulation) lives in the _embed_ track only ([composition-craft.md](composition-craft.md)).
|
|
7
|
+
|
|
8
|
+
For talking-head / explainer / voiceover, the typical output is **the whole transcript on the rail**
|
|
9
|
+
with only the climax(es) promoted to embed. Rail is not a fallback — it's the baseline.
|
|
10
|
+
|
|
11
|
+
> **Implementation note.** A dedicated rail renderer is the next build step. The rail is a
|
|
12
|
+
> plain `fg` caption track and maps cleanly onto hyperframes' native caption pipeline
|
|
13
|
+
> (`hyperframes-media` captions) — prefer reusing that over hand-rolling. Until wired, render
|
|
14
|
+
> the rail as a simple `data-caption-layer="fg"` composition (no matte overlay for these caps).
|
|
15
|
+
|
|
16
|
+
## Position & safe area
|
|
17
|
+
|
|
18
|
+
- **Lower third, horizontally centered.** Landscape (16:9): baseline ~80–120px above the
|
|
19
|
+
bottom edge. Portrait (9:16): lower-middle, ~ 600–700px from the bottom (clear of platform UI).
|
|
20
|
+
- **Title-safe margins:** keep text within ~90% width / inside any letterbox-pillarbox bars
|
|
21
|
+
(see the letterbox probe). Never flush to the frame edge.
|
|
22
|
+
- **One caption group on screen at a time.** No accumulation, no cascade — that's embed-track behaviour.
|
|
23
|
+
- It rides above the subject; the matte does **not** occlude it (rail = in front).
|
|
24
|
+
|
|
25
|
+
## Lines, length, timing
|
|
26
|
+
|
|
27
|
+
- **≤ 2 lines.** Broadcast target ~ 32–42 chars/line; break at a clause/phrase boundary, never
|
|
28
|
+
mid-word, never leave a dangling 1-word line.
|
|
29
|
+
- **Word-synced.** Each group's window envelops its words (`group.in ≤ first word.start`,
|
|
30
|
+
`group.out ≥ last word.end`); each group ≥ 0.5s on screen; ~1.5s min gap discipline so it
|
|
31
|
+
doesn't strobe. Word timings within 80ms of transcript (same gate as everywhere).
|
|
32
|
+
- **Grouping** = short readable phrases (see [caption-grouping.md](caption-grouping.md)) — not the
|
|
33
|
+
embed track's "phrase = composition" rule; here it's just legible subtitle chunking.
|
|
34
|
+
|
|
35
|
+
## Look (restrained on purpose)
|
|
36
|
+
|
|
37
|
+
- **Size: ~`calc(0.045 * var(--h))`** (≈48px @1080, ≈58px @1290) — readable, _not_ hero. The rail is a subtitle; it is deliberately much smaller than the embed body/climax. Express as a `var(--h)` fraction (never hardcode px) so it scales across resolutions. The embed climax is sized to the frame independently (see composition-craft § POP) — **never** size the climax as a multiple of this rail.
|
|
38
|
+
- One clean sans (Inter / Helvetica Now / Neue Haas), weight 500–600; white (or near-white).
|
|
39
|
+
- **Legibility without grading the video:** a tight text treatment local to the glyphs only —
|
|
40
|
+
a soft dark drop-shadow, or a subtle rounded gradient pill / 30–40% scrim **sized to the text
|
|
41
|
+
box** (not a full-frame bar, never a frame-wide grade). On luminance > 180 backgrounds, keep
|
|
42
|
+
the scrim; never rely on bare light text.
|
|
43
|
+
- Motion is minimal: 150–250ms fade-up in / fade-down out. No glitch, no scale-pop, no per-word
|
|
44
|
+
choreography on the rail — that energy is reserved for embed.
|
|
45
|
+
|
|
46
|
+
## The `emphasis` flag (active-word highlight)
|
|
47
|
+
|
|
48
|
+
The only intensity the rail carries. When a word is graded `emphasis` (the 1–2 punch words in a
|
|
49
|
+
phrase), give it an **inline** lift on the rail — accent colour and/or +weight, optionally a
|
|
50
|
+
karaoke-style active-word pop (≤1.1× scale) as it's spoken. Keep it inline; it does **not**
|
|
51
|
+
leave the rail. Anything that wants to leave the rail is an `embed`, not an emphasis.
|
|
52
|
+
|
|
53
|
+
## What the rail never does
|
|
54
|
+
|
|
55
|
+
- Never goes behind the subject (that's embed).
|
|
56
|
+
- Never accumulates into a multi-line poem (that's embed).
|
|
57
|
+
- Never crosses the face / uses occlusion as an effect.
|
|
58
|
+
- Never grades or textures the underlying video.
|
|
59
|
+
- Doesn't drop content to "fit fewer blocks" — split into more groups instead. The only drops
|
|
60
|
+
are filler (um/uh, exact stutters, self-corrections); dense conversational `narrator` glue
|
|
61
|
+
("you know", "sort of") may be trimmed for readability, content/structure words stay.
|
|
62
|
+
|
|
63
|
+
## Hand-off to embed
|
|
64
|
+
|
|
65
|
+
Rail + embed coexist in one render: the rail runs the whole clip; an embedded peak appears over
|
|
66
|
+
it at its moment (the rail can briefly clear or dim under the embed if they'd collide). Decide
|
|
67
|
+
which phrases promote via the role read in SKILL.md § Caption model; author the promoted ones
|
|
68
|
+
with [composition-craft.md](composition-craft.md).
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# The reference bar — what world-class looks like
|
|
2
|
+
|
|
3
|
+
Self-review without an external bar always passes. Before shipping, hold the render
|
|
4
|
+
against these references — not "is anything broken" (the gates did that) but "would a
|
|
5
|
+
designer at these houses sign it".
|
|
6
|
+
|
|
7
|
+
## Per register
|
|
8
|
+
|
|
9
|
+
**premium-warm / editorial (cream, editorial)** — the bar is a _Vogue cover_ and the
|
|
10
|
+
A24 title card: type interacts with the subject (masthead behind the head), one or two
|
|
11
|
+
sizes feel chosen not defaulted, the frame would work printed as a poster. Check: does
|
|
12
|
+
the climax frame, screenshotted alone, look like a designed cover — or like a subtitle
|
|
13
|
+
that grew?
|
|
14
|
+
|
|
15
|
+
**tech-premium (keynote, ink)** — the bar is an _Apple keynote slide_ over footage:
|
|
16
|
+
opaque, weighty, dead-center confidence; negative space is doing the work; nothing
|
|
17
|
+
decorating. Check: would this frame look at home in a WWDC sizzle?
|
|
18
|
+
|
|
19
|
+
**formal (documentary)** — the bar is _Errol Morris / PBS Frontline_: the type has the
|
|
20
|
+
restraint of a court document; stillness reads as authority. Check: does ANY motion call
|
|
21
|
+
attention to itself? If yes, cut it.
|
|
22
|
+
|
|
23
|
+
**loud** — the bar is a _k-pop lyric video / Nike spot_: type fights the subject and
|
|
24
|
+
wins on purpose, color is saturated and scene-true, the beat hits WITH the word. Check:
|
|
25
|
+
does the hero frame make you want to replay it?
|
|
26
|
+
|
|
27
|
+
## The five positive checks (run on the preview sheet, after the failure checks)
|
|
28
|
+
|
|
29
|
+
1. **Poster test** — screenshot the climax frame alone. Would you post it as a still?
|
|
30
|
+
If it needs the motion to excuse the composition, the composition isn't done.
|
|
31
|
+
2. **Timid test** — is any body caption apologizing (tiny, corner-parked, far from the
|
|
32
|
+
silhouette)? Small is a choice; timid is a default. Hug the subject or commit to the
|
|
33
|
+
margin as a designed column.
|
|
34
|
+
3. **One-glance hierarchy** — at thumbnail size (shrink the sheet), can you still tell
|
|
35
|
+
opener / body / hero apart? If the tiers blur together, the contrast ratios are off.
|
|
36
|
+
4. **Scene handshake** — name three ways the type acknowledges THIS footage (accent
|
|
37
|
+
sampled from the scene, occlusion crossing, shadow direction, depth blur, palette
|
|
38
|
+
temperature). Fewer than two = it's a sticker, not an embed.
|
|
39
|
+
5. **Dead-air audit** — scrub the no-caption stretches. Are they _composed rests_
|
|
40
|
+
(subject carries the frame) or _gaps_ (the design just stopped)? Rests are earned by
|
|
41
|
+
rhythm; gaps are bugs in pacing.
|
|
42
|
+
|
|
43
|
+
## How to use with fresh-eyes review
|
|
44
|
+
|
|
45
|
+
Give the sub-agent the preview sheet + the 5 failure checks (SKILL.md § Visual QA) +
|
|
46
|
+
these 5 positive checks, and ask for verdicts on both lists. A render ships when it
|
|
47
|
+
passes the failure checks AND at least 4/5 positive checks with specific evidence.
|
|
@@ -0,0 +1,94 @@
|
|
|
1
|
+
# Scene Types — picking the right template
|
|
2
|
+
|
|
3
|
+
The three templates differ in one thing: **what surface (if any) the text physically sits on**. Pick by reading the scene, not by the genre label.
|
|
4
|
+
|
|
5
|
+
## wall-embed — "text is printed on a real surface"
|
|
6
|
+
|
|
7
|
+
Original Memory Wall render used this. Text uses perspective transform + `mix-blend-mode: overlay` to look like it was silk-screened onto a wall behind the subject. The illusion is strong when it works and completely broken when forced.
|
|
8
|
+
|
|
9
|
+
### Four conditions — ALL must hold
|
|
10
|
+
|
|
11
|
+
1. **A flat or near-flat surface exists somewhere in the frame, larger than the caption block.** Good: acoustic foam panel, painted wall, door, stone facade, large backdrop cloth, blackboard. Bad: bookshelf (3D depth + decorative items), mic shield (too small), window (transparent, content behind it shifts), brick wall with mortar patterns (competes).
|
|
12
|
+
2. **The surface is at a non-zero angle to the camera.** Perspective is what sells "embedded". If the wall is perfectly parallel (0° rotation relative to camera), pasting rotateY:0 text onto it looks like a sticker, not embedded. Memory Wall's foam wall was tilted ~13° — perfect. A wall directly behind a centered frontal subject usually has no exploitable angle.
|
|
13
|
+
3. **The surface is mid-luminance.** Overlay blend neutralizes mid-tones — text keeps contrast against a mid-grey wall. On near-black surfaces (luminance < 60), overlay makes text vanish → switch to `mix-blend-mode: screen`. On near-white surfaces (> 180), overlay also fails → switch to `mix-blend-mode: normal` with opaque color.
|
|
14
|
+
4. **The surface has no competing graphical content.** Plain paint, uniform acoustic foam, blurred OOF background all work. Printed wallpaper, picture frames, text on signage, busy bookshelves all compete with the caption and ruin the embed illusion.
|
|
15
|
+
|
|
16
|
+
If **any** condition fails, **do not use wall-embed**. Pick another template.
|
|
17
|
+
|
|
18
|
+
### What memory-wall looked like
|
|
19
|
+
|
|
20
|
+
The acoustic foam wall to the right of the subject took ~40% of frame width, tilted ~13° toward the viewer, mid-grey color, uniform dimpled texture. Perfect. Text with `rotateY(-13deg)` and overlay blend sat on it like printed letters.
|
|
21
|
+
|
|
22
|
+
### Anti-examples (wall-embed would FAIL)
|
|
23
|
+
|
|
24
|
+
- **champion / demo1_avatarv** — bookshelf background with books, white vases, picture frames. Cluttered + 3D depth. Fails condition 1 and 4. Used corner-column-crown instead.
|
|
25
|
+
- **Jobs 60 Minutes** — blurry potted plant background. No flat surface at all. Fails condition 1.
|
|
26
|
+
- **Randy Pausch "Time is all we have"** — completely black backdrop. No perspective to exploit, no mid-tone surface. Fails 2 and 3. Used portrait-header.
|
|
27
|
+
- **Any vlog / selfie with handheld camera** — surface moves frame-to-frame, can't lock perspective. Even if conditions 1-4 hold briefly, motion breaks the illusion.
|
|
28
|
+
|
|
29
|
+
## corner-column-crown — "text sits in a clean region next to the subject"
|
|
30
|
+
|
|
31
|
+
The default for most talking-head content. Works when wall-embed doesn't.
|
|
32
|
+
|
|
33
|
+
### Conditions
|
|
34
|
+
|
|
35
|
+
1. **Single subject, fixed camera.** Handheld is tolerable if drift is small.
|
|
36
|
+
2. **At least one clean zone (≥ 15% of frame width) to the left or right of the subject** where captions can sit without continuous body occlusion.
|
|
37
|
+
3. **Background can be cluttered or 3D** — we're not relying on a flat surface, just readable contrast. Screen blend mode picks up darker backgrounds (bookshelves, dark walls) naturally.
|
|
38
|
+
4. **Landscape aspect** (16:9 or similar). For portrait, use `portrait-header`.
|
|
39
|
+
|
|
40
|
+
### When to add the crown vs when to skip it
|
|
41
|
+
|
|
42
|
+
- Add crown if there's a natural "title drop" line — the one phrase that lands the story (e.g. "WIMBLEDON CHAMPION", "BEATLES", "SHARP AGAIN"). Check [layout-heuristics.md § Crown placement](layout-heuristics.md) for the three geometric conditions.
|
|
43
|
+
- Skip crown for factual / neutral monologues where no phrase carries the climax. Short videos (<10s) often don't need it.
|
|
44
|
+
|
|
45
|
+
## portrait-header — "subject fills center, text lives in top banner"
|
|
46
|
+
|
|
47
|
+
For 9:16 aspect where the subject inevitably fills the middle.
|
|
48
|
+
|
|
49
|
+
### Conditions
|
|
50
|
+
|
|
51
|
+
1. **Portrait aspect** (9:16, 1080×1920 etc.).
|
|
52
|
+
2. **Subject occupies the vertical middle of frame**, leaving ~15-25% of the frame height clear at the top.
|
|
53
|
+
3. **Optional crown at bottom** — only works if there's also clean space beneath the subject's waist, which is rare in close-crop portrait.
|
|
54
|
+
|
|
55
|
+
### What to watch
|
|
56
|
+
|
|
57
|
+
- Subject's head top often approaches y=40 — top banner captions at `top: 30px` will get partially occluded by hair. Accept the partial occlusion (it reads as embed) or bump the caption size down to clear the hair.
|
|
58
|
+
- If the subject already has **baked-in captions** (like the burned-in subtitles test case with yellow subtitles burned in), the skill should refuse — two caption systems compete.
|
|
59
|
+
|
|
60
|
+
## Quick decision flow
|
|
61
|
+
|
|
62
|
+
```
|
|
63
|
+
START
|
|
64
|
+
│
|
|
65
|
+
├─ Aspect is 9:16 / portrait?
|
|
66
|
+
│ ├─ YES → portrait-header
|
|
67
|
+
│ └─ NO ──▼
|
|
68
|
+
│
|
|
69
|
+
├─ Does the scene have a flat uniform surface that passes
|
|
70
|
+
│ ALL 4 wall-embed conditions?
|
|
71
|
+
│ ├─ YES → wall-embed
|
|
72
|
+
│ └─ NO ──▼
|
|
73
|
+
│
|
|
74
|
+
├─ Single subject + fixed camera + ≥15% clean zone on one side?
|
|
75
|
+
│ ├─ YES → corner-column-crown
|
|
76
|
+
│ └─ NO ──▼
|
|
77
|
+
│
|
|
78
|
+
└─ Refuse with reason:
|
|
79
|
+
"No flat surface for embed, no clean caption zone for column.
|
|
80
|
+
Suggest a classic lower-third instead."
|
|
81
|
+
```
|
|
82
|
+
|
|
83
|
+
## Mode checklist (run this before committing to wall-embed)
|
|
84
|
+
|
|
85
|
+
Read 3 frames (start, mid, end). For each, honestly answer:
|
|
86
|
+
|
|
87
|
+
- [ ] Is there a single surface behind/beside the subject that occupies ≥ 30% of the frame?
|
|
88
|
+
- [ ] Is that surface relatively flat (not curved, not 3D-stacked shelving)?
|
|
89
|
+
- [ ] Does that surface angle at 5-20° to the camera (not perfectly parallel, not warped)?
|
|
90
|
+
- [ ] Is the surface mid-luminance (not near-black like dark bookshelves, not near-white like a sunny window)?
|
|
91
|
+
- [ ] Does the surface contain NO printed/decorative elements that compete with caption text?
|
|
92
|
+
- [ ] Does the surface remain visible across all 3 frames (subject doesn't step in front of it)?
|
|
93
|
+
|
|
94
|
+
**Need all six YES to use wall-embed.** Even one NO → step down to corner-column-crown or portrait-header.
|
|
@@ -0,0 +1,66 @@
|
|
|
1
|
+
# Test set — diverse scenes for template stability regression
|
|
2
|
+
|
|
3
|
+
Canonical test corpus for verifying templates don't regress when we add
|
|
4
|
+
features. Pick cases that stress different parts of the pipeline — blend
|
|
5
|
+
mode, matte quality, baked-in graphics, luminance extremes, motion.
|
|
6
|
+
|
|
7
|
+
## The test set
|
|
8
|
+
|
|
9
|
+
All in `~/Downloads/vidfarm_test_videos/` (720×1290, ~8s, 9:16). Add
|
|
10
|
+
landscape + 1:1 as we grow.
|
|
11
|
+
|
|
12
|
+
| Case | Scene | Stress test |
|
|
13
|
+
| --------------- | -------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ |
|
|
14
|
+
| `Sunset_Stroll` | Outdoor selfie at sunset, palm trees, boardwalk | **Bright backdrop** → default `screen` blend fails; needs dark text + `normal` blend |
|
|
15
|
+
| `Nature_Vibe` | Forest golden-hour + **baked timestamp** bottom-left + watermark top-right | Baked graphics avoidance; warm-mid luminance |
|
|
16
|
+
| `Gym_Grind` | Dark gym + dark tank top + phone-mirror selfie | **Low luminance** → matte difficulty; screen blend natural fit |
|
|
17
|
+
| `AI_Insights` | Podcast studio + neon "THE DIALOG" sign + window view | **Competing graphics in BG** (sign, city skyline); mid-tone |
|
|
18
|
+
| `Kitchen_Buzz` | Warm kitchen, apron, smiling | Baseline friendly case |
|
|
19
|
+
| `Tech_Trends` | Clean white studio + mic | **Max bright backdrop** — needs dark text or opaque BG |
|
|
20
|
+
| `Street_Talk` | Walking city street, handheld | Handheld motion + bright outdoor |
|
|
21
|
+
| `Outdoor_Hype` | Forest + **Instagram watermark** top + sun flare | Baked graphic + bright + motion |
|
|
22
|
+
|
|
23
|
+
## Usage
|
|
24
|
+
|
|
25
|
+
```bash
|
|
26
|
+
for case in Sunset_Stroll Nature_Vibe Gym_Grind AI_Insights; do
|
|
27
|
+
bash scripts/render-and-composite.sh /tmp/ts-${case}
|
|
28
|
+
done
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
## Regression checklist
|
|
32
|
+
|
|
33
|
+
For every new template or significant change, re-run the test set and
|
|
34
|
+
verify:
|
|
35
|
+
|
|
36
|
+
- [ ] Sunset_Stroll: captions legible on bright sunset (Cinematic cream/screen washes out → use **Standard mode**, opaque rail)
|
|
37
|
+
- [ ] Nature_Vibe: captions don't collide with baked timestamp (bottom-left) or watermark
|
|
38
|
+
- [ ] Gym_Grind: captions visible on dark gym despite dark subject
|
|
39
|
+
- [ ] AI_Insights: captions don't fight with "THE DIALOG" neon sign
|
|
40
|
+
- [ ] Tech_Trends: dark text + `normal` blend on pure white studio
|
|
41
|
+
- [ ] Each case: 0.5s+ per caption, no wrap-into-subject-head-zone
|
|
42
|
+
- [ ] Each case: FG layer for 9:16 portraits where subject fills frame
|
|
43
|
+
|
|
44
|
+
## Bugs we've fixed via this test set
|
|
45
|
+
|
|
46
|
+
- **2026-04-23**: Hardcoded `text-shadow: warm-glow + dark-drop` in all
|
|
47
|
+
templates ignored `cap_color` — dark text got overwhelmed by bright
|
|
48
|
+
halo on bright backgrounds. Fix: `TEXT_SHADOW` placeholder with
|
|
49
|
+
luminance-adaptive default.
|
|
50
|
+
- **2026-04-23**: Hardcoded `filter: brightness(1.12)` lightened dark
|
|
51
|
+
text, shifting it toward neutral. Fix: `TEXT_FILTER` placeholder that
|
|
52
|
+
drops brightness boost for dark colors.
|
|
53
|
+
- **2026-04-23**: `BLEND_MODE` and `CAP_COLOR` hardcoded in new
|
|
54
|
+
templates — plan.json overrides ignored. Fix: placeholders added to
|
|
55
|
+
all 4 templates.
|
|
56
|
+
|
|
57
|
+
## Expansion plan
|
|
58
|
+
|
|
59
|
+
Still need to add:
|
|
60
|
+
|
|
61
|
+
- 1 × 16:9 landscape (from any test-corpus clip via letterboxing, or new source)
|
|
62
|
+
- 1 × 1:1 square (if available)
|
|
63
|
+
- 1 × multi-speaker (speaker diarization test)
|
|
64
|
+
- 1 × foreign language (CJK rendering test)
|
|
65
|
+
- 1 × shot-cut (PySceneDetect-required case)
|
|
66
|
+
- 1 × product/B-roll (no talking head — refuse gate)
|