hyperframes-skills 是做什么的?
将 Figma 内容导入到 HyperFrames 合成中——渲染的资产、品牌令牌、组件、故事板部分→重建的运动(帧被视为状态,而非幻灯片)(REST/CLI),在可用时通过连接器辅助运动,以及来自连接器或原生导出的着色器。当用户粘贴 figma.com 链接或要求将 Figma 设计、框架、Logo、品牌或动画导入到视频/合成中使用。
将 Figma 内容导入到 HyperFrames 合成中——渲染的资产、品牌令牌、组件、故事板部分→重建的运动(帧被视为状态,而非幻灯片)(REST/CLI),在可用时通过连接器辅助运动,以及来自连接器或原生导出的着色器。当用户粘贴 figma.com 链接或要求将 Figma 设计、框架、Logo、品牌或动画导入到视频/合成中使用。
该技能将 Figma 设计内容无缝集成到 HyperFrames 合成中,支持渲染资产、品牌设计令牌、组件和故事板部分的导入。它能够将 Figma 帧转换为运动状态(而非传统幻灯片),通过 REST API 或 CLI 实现直接导入。当连接器可用时,技能会利用其辅助运动生成;同时支持从连接器或原生导出获取着色器效果。这为开发者提供了一种高效方式,将 Figma 设计元素(如帧、Logo、品牌和动画)直接转化为视频或动态合成中的可操作组件。支持的平台包括 HyperFrames 环境,并通过 REST/CLI 接口与 Figma 连接,适合需要在创意工作流中快速原型化和动画化 UI 设计的场景。
npx skills add https://github.com/jasonfast123/hyperframes-skills/tree/main/skills/product-launch-video将 Figma 内容导入到 HyperFrames 合成中——渲染的资产、品牌令牌、组件、故事板部分→重建的运动(帧被视为状态,而非幻灯片)(REST/CLI),在可用时通过连接器辅助运动,以及来自连接器或原生导出的着色器。当用户粘贴 figma.com 链接或要求将 Figma 设计、框架、Logo、品牌或动画导入到视频/合成中使用。
This repo contains 19 individual skills — each has its own dedicated page.
>
Turn arbitrary text — an article, notes, a topic, a brief — into a faceless explainer video: there is no site or footage to capture, so the visuals are invented per scene (typography, abstract graphics, diagrams, data-viz). Use for topic explainers, concept breakdowns, how-tos, listicles. Not a video built from a website (/product-launch-video — promo or tour). Unclear → /hyperframes.
Import Figma content into a HyperFrames composition — rendered assets, brand tokens, components, storyboard sections → reconstructed motion (frames read as states, not slides) (REST/CLI), connector-assisted motion when available, and shaders from a connector or native export. Use when the user pastes a figma.com link or asks to bring a Figma design, frame, logo, brand, or animation into a video/composition.
>
>
All animation knowledge for HyperFrames — atomic motion rules, multi-phase scene blueprints, scene transitions, broader motion-design techniques, AND the seven runtime adapters (GSAP default, plus Lottie, Three.js, Anime.js, CSS keyframes, Web Animations API, TypeGPU). Use for any motion or animation task: pick 2-4 rules and compose, or load a blueprint, or look up runtime-specific API (e.g. GSAP eases / Lottie player / Three.js mixer). Also covers auditing an existing composition
>
>
The HyperFrames composition contract — build one renderable project. Use for composition structure, the `data-*` timing attributes, `class=
Non-animation creative direction for HyperFrames videos. Use for design spec (frame.md / design.md) handling, palettes, typography, narration, beat planning, audio-reactive visuals, composition patterns, and brand / style decisions. For atomic motion patterns and scene blueprints, use `hyperframes-animation`.
>
Install, discover, and wire registry blocks and components into HyperFrames compositions. Use when running hyperframes add or hyperframes catalog, installing one item or every block matching a tag, wiring an installed item into index.html, or working with hyperframes.json. Covers discovery, install locations, block sub-composition wiring, component snippet merging, and authoring a new block or component to contribute upstream (idea → scaffold → validate → PR).
Agent Media OS, the single skill for every media need in a HyperFrames project. Resolve BGM, SFX, image, icon, brand logo, voice, color grade, or LUT into a frozen local file or paste-ready block + ledger record (one verb, `resolve`); generate via TTS / music / image models when the catalog misses; produce voiceover, transcription, captions, and background removal through one shared audio engine; operate on media (cut / reframe / transform); and reuse assets across projects. Also use for vague feedback that real footage looks dark, flat, boring, should feel retro/camcorder/print/ASCII, needs privacy, or needs a media reveal.
>
Turn a music track (an audio file, a video to pull audio from, or a track generated from a mood brief) into a beat-synced video — lyric video, slideshow, or kinetic promo. The music drives all pacing; any user-supplied images/videos are cut onto the same beat grid, and a complete video needs zero assets. Narrated pieces → the input-matched workflow (see /hyperframes). Unclear → /hyperframes.
Turn a GitHub pull request (a PR URL, owner/repo#N, or
Port an existing Remotion (React) composition
>
Package an existing talking-head / interview / podcast video with timed, designed GRAPHIC OVERLAY cards — kinetic titles, lower-thirds, data callouts, quotes, side panels, picture-in-picture — synced to the transcript, on a 16:9 / 9:16 / 4:5 canvas of your choice; the clip plays untouched underneath. Trigger on
Extract frames or short clips from videos using ffmpeg.
Summarize or transcribe URLs, YouTube/videos, podcasts, articles, transcripts, PDFs, and local files.
Use when testing, fixing, or extending the OpenClaw Control UI GUI with Vitest + Playwright end-to-end checks, mocked Gateway WebSocket flows, mocked dashboard runs, screenshots/videos, or agent-verifiable browser proof.
Obra superpowers agent skills.
See, Understand, Act on video and audio. See- ingest from local files, URLs, RTSP/live feeds, or live record desktop; return realtime context and playable stream links. Understand- extract frames, build visual/semantic/temporal indexes, and search moments with timestamps and auto-clips. Act- transcode and normalize (codec, fps, resolution, aspect ratio), perform timeline edits (subtitles, text/image overlays, branding, audio overlays, dubbing, translation), generate media assets (image, audio...
End-to-end marketing campaign planning and execution. Covers audience research, positioning, campaign angle definition, landing page copy, email sequences, social posts, ad copy, short-form video scripts, and content calendars. Use as the orchestration layer for multi-channel product launches. Use when planning or executing a multi-channel product launch, or producing landing page, email, social, or ad copy.