What problem does it solve? Designers and video creators often need to bring Figma designs into animated video compositions without manually recreating layouts, colors, and animations. This Skill imports Figma content directly into HyperFrames compositions, preserving geometry, brand tokens, and motion timing while freezing assets locally for deterministic renders. ## Core Features & Use Cases - Asset and Token Import: Render Figma layers as SVG/PNG via REST and import brand variables as composition variables with binding records, so re-branding propagates without re-importing. - Component and Motion Reconstruction: Convert Figma node trees into editable HTML components and translate Figma Motion animations into GSAP timelines, with an objective PSNR-based verification script comparing against Figma's own video export. - Storyboard Reconstruction: Parse storyboard sections as keyframes rather than slides, diffing adjacent frames into element chains and building a single sequenced timeline. - Use Case: A user pastes a figma.com link to an animated product card; the Skill imports the frame as a component, translates its motion to a GSAP timeline, and verifies the render against Figma's exported MP4 before finishing. ## Quick Start Import this Figma frame into my HyperFrames composition and reconstruct its animation: https://www.figma.com/design/FILEKEY/My-File?node-id=1-2
