graphic-overlays

HyperFrames CLI dev loop — `npx hyperframes` for scaffolding (init), validation (lint, inspect), preview, render, and environment troubleshooting (doctor, browser, info, upgrade). Use when running any of these commands or troubleshooting the HyperFrames build/render environment. For asset preprocessing commands (`tts`, `transcribe`, `remove-background`), invoke the `hyperframes-media` skill instead.

HyperFrames的所有动画知识——原子运动规则、多阶段场景蓝图、场景过渡、更广泛的动态设计技术，以及七种运行时适配器（默认GSAP，外加Lottie、Three.js、Anime.js、CSS关键帧、Web Animations API、TypeGPU）。适用于任何运动或动画任务：选取2-4条规则进行组合，或加载蓝图，或查询特定运行时的API（例如GSAP缓动函数/Lottie播放器/Three.js混合器）。HyperFrames原生特性：单一暂停时间线，安全跳帧，...

HyperFrames HTML 组合合约。用于组合结构、数据属性、剪辑、轨道、子组合、变量、媒体播放、确定性渲染规则以及最小可渲染项目的验证。

为HyperFrames合成提供资产预处理——多供应商TTS（HeyGen / ElevenLabs / Kokoro本地）、多供应商BGM（Google Lyria / 本地MusicGen）、Whisper转录、背景移除及字幕编写。用于npx hyperframes tts、bgm、transcribe、remove-background、语音/供应商选择、音乐情绪提示、字幕/副标题/歌词/卡拉OK/逐词样式。

安装并将注册表块和组件接入HyperFrames组合中。在运行hyperframes add、安装块或组件、将已安装项接入index.html或处理hyperframes.json时使用。涵盖add命令、安装位置、块子组合接入、组件片段合并、注册表发现，以及编写新块或组件以向上游贡献（构思→脚手架→验证→PR）。

用作自定义HyperFrames HTML视频合成创作的后备方案，适用于无专门工作流程的场景。涵盖较长或多场景作品、品牌/宣传片、蒙太奇、标题卡、动态海报、静态循环以及任意长度或格式的自由创作。不适用于营销产品推广（product-launch-video）、通用网站转视频（website-to-video）、主题解说（faceless-explainer）、GitHub PR视频（pr-to-video）、为现有素材添加字幕等场景。

当用户需要一段简短、以设计为主导的动态图形，且动态本身即为信息时使用：动态文字排版、数字或统计计数、图表/数据可视化效果、标志片头、品牌组合、底部三分之一、标注、社交覆盖层、动画标题/推文/新闻条目、动态海报或快速捕捉页面高亮。通常时长在10秒以内，最长约30秒，无叙事弧线、画外音或真人实拍主体。可渲染为MP4或透明叠加层。不适用于较长、多场景、带旁白或品牌宣传片的作品……

对于任何制作、创建、生成、编辑、动画化或渲染视频、动画、动态图形、解说视频、标题卡、叠加层、带字幕视频、产品宣传片、网站视频、公关或更新日志视频、数据蒙太奇、动态海报或HyperFrames HTML合成的请求，请从此处开始。当用户希望HyperFrames创作或渲染完成的MP4/网络视频、选择工作流程，或在产品发布视频、无脸解说视频、网站转视频等之间路由时，请在其他视频或动画技能之前使用此功能。