seam-craft

Diagnose and fix white-flash render defects at scene-to-scene transitions in HyperFrames master timelines.

13|17|Updated Jan 30, 2025
One-click install
npx skills add https://github.com/CodeWithSally/CodeWithSally-Apex-English --skill seam-craft-codewithsally
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: seam-craft
Source: https://github.com/CodeWithSally/CodeWithSally-Apex-English/tree/main/Sessions/ClaudeCode/Session007/.agents/skills/seam-craft
Command: npx skills add https://github.com/CodeWithSally/CodeWithSally-Apex-English --skill seam-craft-codewithsally

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? When assembling a HyperFrames master timeline (index.html) from multiple scenes, transitions like crossfades and zoom-throughs can briefly drop the combined opacity of overlapping scene wrappers below 1, letting the renderer's default white page show through as a glaring white flash at every seam — especially visible on dark films. This Skill documents the render-correctness prerequisites and injector mechanics that make transitions composite correctly. ## Core Features & Use Cases - White-flash guard: Ensures the assembled index.html paints an opaque stage ground via #root { background: var(--canvas-deep, var(--canvas, #000)) } so opacity dips never reveal the white page. - Injector mechanics reference: Explains how the injector extends the outgoing wrapper's duration, pulls the incoming wrapper's start earlier, ping-pongs track indices to avoid illegal same-track overlap, and stamps the gsap_template onto the master timeline. - Template placeholder table: Documents tokens like __OLD__, __NEW__, __T__, __DUR__, __DX__, __DY__, and __ORIGIN_OUT__/__ORIGIN_IN__ substituted into each transition template. - Use Case: While assembling a launch video's master timeline, you notice a white flash at a crossfade seam on a dark film; load this Skill to verify the #root background guard and confirm the injector's overlap and track-assignment behavior. ## Quick Start Load this Skill when assembling the master timeline index.html or when a white flash appears at a scene transition seam, and ask it to verify the stage-ground background and injector overlap mechanics.

Frequently Asked Questions about seam-craft

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
Why does a white flash appear at a crossfade transition in my rendered video?

A white flash appears when the two overlapping scene wrappers' summed opacity drops below 1 and the #root element has no opaque background, so the renderer's default white page shows through. Fix it by setting #root background to var(--canvas-deep, var(--canvas, #000)) in the assembled index.html.

How do I fix transition seams on dark videos in HyperFrames?

Paint the stage ground by ensuring the assembler emits an opaque #root background, which assemble-index.mjs now does automatically. Any other consumer of the transition templates must provide the same guarantee so opacity dips composite over the dark canvas instead of white.

How does the injector overlap two scenes on the master timeline?

The injector extends the outgoing wrapper's data-duration to hold its final frame, pulls the incoming wrapper's data-start earlier to create the overlap window, and reassigns clip data-track-index as a 0/1 ping-pong so the wrappers never share a track. It then stamps the gsap_template into window.__timelines["main"] at the overlap start time.

Can two overlapping scene wrappers share the same track?

No, same-track overlap is illegal under the composition lint rules in core/src/lint/rules/composition.ts. The injector avoids this by ping-ponging all clip track indices between 0 and 1, with the higher track compositing on top.

Are filter and scaleX animations allowed on the master timeline?

Yes, filter, scaleX, and transformOrigin are lint-clean on the master timeline because the gsap lint rule has no per-property whitelist and scopes checks to data-composition-id ranges. The x/y/scale/rotation/opacity whitelist is only a scene-worker prompt rule and does not bind index.html.

Does this Skill contain the catalog of individual transitions?

No, this Skill covers only the render-correctness doctrine and master-timeline mechanics shared by all transitions. The per-transition catalog such as crossfade, push-slide, zoom-through, and cut-the-curve lives in the separate transition registry.