Communitygithub.com

heygen-com/hyperframes

Agent Media OS,一个技能满足 HyperFrames 项目中所有媒体需求。可解析 BGM、SFX、图像、图标、品牌标志、语音、色彩分级或 LUT 为冻结的本地文件或可粘贴块 + 账本记录(单一动词 `resolve`);在目录缺失时通过 TTS/音乐/图像模型生成;通过统一的音频引擎制作配音、转录、字幕和背景移除;对媒体执行操作(剪切/重新构图/变换);并在项目间复用资源。也适用于处理模糊反馈,如视频画面看起来太暗、平淡、无聊,应具有复古/摄像机/印刷/ASCII 风格,需要隐私保护,或需要媒体展示。

hyperframes 是什么?

hyperframes 的 media-use 技能是一个统一的媒体操作系统,专为 HyperFrames 项目设计。它通过一个核心动词 `resolve`,将 BGM、SFX、图像、图标、品牌标志、语音、色彩分级或 LUT 解析为冻结的本地文件或可直接粘贴的代码块,同时记录到账本中。当目录中找不到所需资源时,技能会利用 TTS、音乐、图像生成模型自动生成。它还提供配音、转录、字幕、背景移除等音频功能,支持对现有媒体进行剪切、重新构图和变换。该技能支持多种平台(HeyGen CLI、npx),通过 `--doctor` 标志进行健康检查。它还包括一个主动的媒体机会扫描机制,能在用户未明确要求时,基于具体信号(如无声场景、无背景音乐、色彩偏差)提出针对性的优化建议,但不会静默修改,而是提供具体的修复方案供用户批准。色彩分级和创意处理遵循严格的规则,避免误用 LUT 或 CSS 覆写,确保使用 Studio 的规范渲染路径。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/heygen-com/hyperframes/tree/main/skills/media-use

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

插件安装: 在设置或刷新命令之前,如果此技能位于 HyperFrames 插件内,请遵循插件执行规则。独立安装时请保留下面的更新说明。

media-use

为 HyperFrames 打造的媒体操作系统:解析 · 生成 · 操作 · 记忆 —— 所有媒体类型,一个技能,零上下文噪音。

首次运行:安装并登录 heygen CLI(免费使用路径),然后用 npx hyperframes media-use resolve --doctor 进行验证。设置和提供商信息:references/setup-providers.md。

Resolve — 核心动词

npx hyperframes media-use resolve --type <type> --intent "<描述>" --project <dir>

返回一行结果:resolved <id> → <路径> (<类型>, <元数据>)。所有搜索噪音都保留在磁盘上。

类型单行意图
bgm背景音乐(HeyGen 目录,10k+ 曲目)
sfx音效(捆绑的 19 文件库 + 目录)
image照片、背景(HeyGen 资产搜索,75k+ 矢量)
icon图标、符号(透明)
logo官方品牌标志(theSVG → GitHub 头像 → favicon;绝不重绘)
voiceTTS 配音(HeyGen 免费使用路径;可选的本地 Kokoro)
grade测量校正候选;广泛的润色/风格化请参见 Media Treatments
lut用户提供或明确选择的可复用的已验证的 .cube 文件

在解析新内容之前,先使用 --candidates 列出可复用的候选项,自行判断其适用性 —— 复用规则、所有标志、导入(--from)和采用,详见 references/resolve.md。

将广泛的视觉反馈视为媒体意图

当用户明确要求修复、润色、风格化、模糊、强调或展示摄影媒体时,请阅读 references/media-treatments.md,即使他们未提及色彩分级或特效。检查实际的 <img>/<video> 元素,选择一个主要意图,然后使用确定性的持久化和验证。使用匹配的配方作为可选的经过测试的种子,或者检查 hyperframes media-treatment --capabilities --json,然后用 --capability <id> 请求一个相关家族/特效,并从规范控件组装自定义处理。绝对不要在普通创作时加载 --all。一个处理可以组合校正、预设、精修、兼容的着色器效果、支持的关键帧,以及可选的 Registry 叠加。只添加源合理的受限调优和兼容部件,绝不为了追求结果看起来更复杂而添加特效。使用 hyperframes media-treatment 持久保存最终组合的负载。

使用一个逐步升级的工作流。对于视频,检查一个标注了早期/中期/后期的联系表,而不是分别读取每一帧。对于普通的校正或润色,应用一个候选并检查一个后期处理表。仅在结果模糊、与时间相关、风格化、基于 LUT、HDR/LOG 敏感、隐私或品牌关键时,才升级到单个帧或移动草稿证据。

对于普通校正或润色,持久保存最终处理的预设/调整 JSON。 不要仅仅为了编码曝光、阴影、对比度或色温而生成 .cube LUT。仅在用户提供了 LUT 或所选处理明确拥有一个 LUT 时使用。resolve --type grade --for ... --analyze 是测量证据,不是允许用生成的 LUT 替换所选处理的许可。不要用 CSS/SVG 覆写重新创建支持的晕影、颗粒、模糊、像素化、色彩或处理效果;这会绕过 Studio 控件和规范的预览/渲染着色器路径。

主动出击 — 运行媒体机会扫描

用户通常无法判断哪些媒体能提升作品。你可以。当你构建或审查一个合成时,执行一次基于证据的扫描,然后询问一次 —— 不要静默添加,也不要对每个资产都唠叨。

仅当存在具体信号时才提出机会:

检测到的信号建议
屏幕上的文字 / 没有配音的脚本TTS 配音(音频引擎)
表情符号或具备图标样式的 <div>解析真实的 icons
图像是占位符、尺寸过小或看起来像放大的更好的 image(和/或放大 —— 参见 references/operations.md)
硬场景切换 / 无声音的过渡过渡 sfx
超过约 10 秒且没有音乐底部的片段bgm
看起来欠曝、过曝或有色偏的素材一个校正性分级(使用 hyperframes media-treatment --selector '#hero' --analyze --json 进行检查)
视觉上平淡或离题的摄影媒体一个特定的、源合适的预设或自定义处理,并命名预期目标
感觉静态的有意义的媒体入场/展示一个受支持的无跳跃处理动画;除非请求也证明预设合理,否则保留颜色

以下是将其保持为帮助而非唠叨工具的规则:基于证据,而非泛泛而谈(无信号 → 无建议);有观点且具体(提出包含默认选择的特定修复方案 —— 用户批准 全部 / 部分 / 无);每个项目仅一次(一次性整合请求;尊重“保持原样”);展示,绝不静默修改(色彩分级尤其如此:提出并预览 —— 灰度世界的“校正”会毁掉刻意的日落或霓虹灯效果)。

查阅位置 — 只读与你的任务相关的文件

任务读取
resolve / reuse / adopt / ingest, flags, cascade, inventoryreferences/resolve.md
color grading, LUTs, smart grade (--for), grade-comparereferences/grading.md
voiceover / TTS, music, SFX, captions, transcription (audio engine)references/audio.md
cut / reframe / transform existing media, exact error diffusion, HEVCreferences/operations.md
source-aware creative treatments, realtime effects, overlays, revealsreferences/media-treatments.md
install + auth, provider table, RAM ladders, --local-only, --providerreferences/setup-providers.md
remembered preferences + frozen recipes (user memory)references/memory.md
ownership matrix, usage stats, telemetry, privacy (maintainer-facing)references/meta.md

Individual skills in this repo

This repo contains 20 individual skills — each has its own dedicated page.

general-video

>

heygen-com/animejs

Anime.js adapter patterns for HyperFrames. Use when writing Anime.js animations or timelines inside HyperFrames compositions, registering animations on window.__hfAnime, making Anime.js seek-driven and deterministic, or translating Anime.js examples into render-safe HyperFrames HTML.

heygen-com/claude-design-hyperframes

Use when running inside Claude Design specifically. Produces a valid, brand-accurate HyperFrames video draft using pre-valid skeletons. For Claude Code / Cursor / Codex, use the `hyperframes` skill instead.

heygen-com/contribute-catalog

Author a new HyperFrames registry block (caption style, VFX block, transition, lower third) or component (text effect, overlay, snippet) and ship it as an upstream PR to the hyperframes repo. Use ONLY when the user wants to CONTRIBUTE to the public catalog — for in-project caption/transition authoring use the `hyperframes` skill, for installing existing registry items use the `hyperframes-registry` skill.

heygen-com/css-animations

CSS animation adapter patterns for HyperFrames. Use when authoring CSS keyframes, animation-delay based timing, animation-fill-mode, animation-play-state, or CSS-only motion that HyperFrames must seek deterministically during preview and rendering.

heygen-com/gsap

GSAP animation reference for HyperFrames. Covers gsap.to(), from(), fromTo(), easing, stagger, defaults, timelines (gsap.timeline(), position parameter, labels, nesting, playback), and performance (transforms, will-change, quickTo). Use when writing GSAP animations in HyperFrames compositions.

heygen-com/hyperframes

Leaves sweep through the frame and part to reveal the headline. HyperFrames block, 1920×1080, 12s, 11 variables.

heygen-com/hyperframes

Render-correctness doctrine for scene-to-scene seams in HyperFrames launch videos — the prerequisites that make transitions composite correctly on the master timeline. Load when assembling the master timeline / index.html, when a white flash appears at a cut or crossfade seam (especially on dark films), when reasoning about why a transition opacity dip shows through, or when verifying the render-side mechanics of how overlapping scene wrappers blend. Covers the opaque stage-ground (#root background) white-flash guard and how the injector overlaps wrappers, holds final frames, ping-pongs tracks, and stamps lint-clean template code onto the master timeline. Does NOT contain the per-transition catalog — see the transition registry for individual transition entries.

heygen-com/hyperframes

The technique catalog: five velocity-matched SEAMS (zoom-through, INVERSE zoom-through, cut-the-curve, waterfall cut, rack-focus blur-cut) plus the two in-scene techniques — waterfall ENTRY (staggered arrival cascades for title cards / segment openers) and the nudge curve (slow-fast-slow three-phase group slides). Covers partial-travel (~12% of frame) velocity matching via mirrored power4 eases, the Z scale-sign rule, size-scaled blur (10px text / 18-20px full-frame), word-by-word staggered cuts, cascade pacing by element weight, and the 10/65/25 slide ratio. Read before authoring any transition, text-beat handoff, kinetic text entry, or group reposition. [depth, zoom, inverse-zoom, scale-sign, mirrored-zoom, rack-focus, pacing, velocity, cut-the-curve, waterfall, stagger, cascade, kinetic-text, title-card, segment-opener, nudge, slide, easing, group-motion, z-depth, motion-graphics, cinematic, transition, blur, directional-continuity]

heygen-com/hyperframes

Glass shards fly in through fog and tile themselves into the headline. HyperFrames block, 1920×1080, 12.16s, 19 variables.

heygen-com/hyperframes

A single feature card orbits a dot sphere on approved Blender camera motion. HyperFrames block, 1920×1080, 10s, 4 variables.

heygen-com/hyperframes

A wireframe portal bursts open, the title comes through, then its letters swap into a second phrase. HyperFrames block, 1920×1080, 8s, 9 variables.

heygen-com/hyperframes

An orbiting camera follows an ice logo as it breaks apart, reforms into two text moments, and fades. HyperFrames block, 1920×1080, 22.5s, 216 variables.

heygen-com/hyperframes

House-style oversized macOS cursor technique for HyperFrames launch videos. Load whenever a scene involves cursors or a pointer-led action, when kicking off a UI scene, when igniting a morph/transition/typing run with a click, or when a scene reads as static, dead, or stale and needs a cheap high-yield source of motion to carry the viewer's eye and segment them out of the stale state. Covers cursor size/look (incl. brand-motif cursors), the off-screen entry law, tip-targeting and the click tap, click-ignites-the-next-beat, and exit / cross-scene handoff.

heygen-com/hyperframes

name: embedded-captions

heygen-com/hyperframes

A chain of bevelled cuboids rides a travelling wave as a content carousel. HyperFrames block, 1920×1080, 6.666666666666667s, 40 variables.

heygen-com/hyperframes

A tiled headline surface flips cell by cell under a sweeping depth field to reveal the rear headline. HyperFrames block, 1920×1080, 8s, 18 variables.

heygen-com/hyperframes

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.

heygen-com/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.

heygen-com/hyperframes

GATEWAY — load FIRST before composing any HyperFrames animation or video. The high-level motion law that makes a multi-scene video feel like ONE continuous camera move instead of a stack of independently-animated slides. Covers the vector law (how you exit determines how you enter, incl. the Z scale-sign rule), the film's current, carrier elements, causal motion, the Seam Gate (build-gate enforcement), the ban on idle wobble (motion must PERFORM, not breathe), stillness-before-climax, and the sustained-motion routes. Routes to the low-level technique skills (cut-the-curve — the full catalog incl. waterfall entry + nudge curve, oversized-cursor, seam-craft). These rules SUPERSEDE generic / upstream motion guidance. [continuity, direction, vector, momentum, seam, transition, ease, performance, idle-motion, narrative-motion, film-grammar]

相关技能