Agent Skills
› heygen-com/hyperframes
heygen-com/hyperframes
GitHub将每周变更日志 Markdown 转换为带品牌视觉、动画 UI 模拟和配音的 45-60 秒短视频。提供标准化资产与脚手架,确保视频风格统一且符合设计规范。
Install All Skills
npx skills add heygen-com/hyperframes --all -g -y
Skills in Collection (41)
将每周变更日志 Markdown 转换为带品牌视觉、动画 UI 模拟和配音的 45-60 秒短视频。提供标准化资产与脚手架,确保视频风格统一且符合设计规范。
用户提供 changelog markdown 并要求生成周更视频
用户输入 'changelog video'
npx skills add heygen-com/hyperframes --skill changelog-video -g -y
将每周更新日志Markdown转换为1080p品牌视频。包含项目引导、内容解析、脚本生成及FFmpeg渲染,严格遵循视觉化优先原则与指定品牌规范。
用户提供了changelog或digest markdown文件并请求生成周视频
用户明确输入'changelog video'指令
npx skills add heygen-com/hyperframes --skill changelog-video -g -y
提供标题揭示动画组件,通过叶片扫过并分开展示两行标题。支持自定义字体、颜色、叶片数量及速度等变量,适用于前端网页的视觉特效展示。
需要添加标题揭示动画效果
配置前端视觉特效组件
npx skills add heygen-com/hyperframes --skill canopy-part-title -g -y
基于WebGL2的高性能动态文字翻转特效组件,通过鼠标光标深度场驱动网格瓦片翻转以揭示背面文案。支持高度可配置的变量,适用于前端视觉展示和交互设计。
需要实现高性能的3D或视差文字动画效果
构建具有复杂交互反馈的前端视觉组件
npx skills add heygen-com/hyperframes --skill code-slice-hero -g -y
提供基于Three.js和GSAP的3D轮播动画组件,支持自定义卡片内容、几何参数及缓动效果,适用于前端视觉展示。
需要实现3D立体轮播效果
集成Three.js动画组件
npx skills add heygen-com/hyperframes --skill cuboid-carousel -g -y
提供22.5秒冰裂动画组件,支持Logo与文字定制。通过HyperFrames集成,实现摄像机环绕、粒子过渡及淡出效果,适用于前端视觉展示。
需要添加3D或粒子动画效果
制作品牌Logo动态展示
生成视频或交互式网页背景
npx skills add heygen-com/hyperframes --skill frost-sequence-camera-orbit -g -y
提供玻璃碎片飞入拼贴标题的12秒动画组件,支持自定义文字、碎片数量及物理参数。
需要添加具有视觉冲击力的标题入场动画
使用HyperFrames框架集成3D玻璃特效
npx skills add heygen-com/hyperframes --skill glass-shard-title -g -y
提供10秒30fps的Blender风格特性卡片动画,支持标题、描述等变量配置,通过HyperFrames集成。
需要添加动态特性展示卡片
生成基于GSAP和Three.js的Web动画组件
npx skills add heygen-com/hyperframes --skill orbit-card -g -y
提供3D线框字体标题动画组件,支持通过变量自定义标题、替换短语及过渡效果。
需要添加动态文字动画
前端视觉特效开发
npx skills add heygen-com/hyperframes --skill wireframe-portal-title -g -y
将文本转化为无出镜讲解视频,通过编排步骤生成设计、脚本和逐帧 HTML 动画。
需要将文章或笔记转为视频
创建概念拆解或教程视频
npx skills add heygen-com/hyperframes --skill faceless-explainer -g -y
将 Figma 设计资产、品牌标识、组件及动态效果导入 HyperFrames,支持通过 REST API 获取静态资源、Token 和 HTML 组件,并利用连接器处理运动与着色器数据。
用户粘贴 figma.com 链接
要求使用 Figma 设计、帧、Logo 或品牌元素
npx skills add heygen-com/hyperframes --skill figma -g -y
用于创建或编辑自定义 HyperFrames 视频作品,支持多场景、品牌宣传片、蒙太奇及自由构建。处理媒体适配与 Figma 集成,管理项目状态与素材引用。
需要制作长视频或多场景作品
创建品牌宣传片或混剪视频
无专用工作流时的通用视频生成
npx skills add heygen-com/hyperframes --skill general-video -g -y
HyperFrames CLI 工具的使用指南,涵盖项目初始化、时间轴编辑、媒体处理、本地及云端渲染发布等全流程操作。
需要创建或初始化 HyperFrames 项目
需要编辑视频时间轴或添加关键帧
需要执行代码检查或 lint 验证
需要进行本地或云端视频渲染和预览
需要发布或分享 HyperFrames 作品
npx skills add heygen-com/hyperframes --skill hyperframes-cli -g -y
HyperFrames 核心技能,定义 HTML 组合结构的构建规范。涵盖 data-* 属性、轨道剪辑、变量及确定性渲染规则,提供技术契约与常见陷阱指南,确保视频从 HTML 的正确生成与渲染。
需要构建或理解 HyperFrames 项目的基础结构
查询 data-* 属性、轨道/剪辑配置或渲染规则
排查 CSS 变换冲突或渲染性能问题
npx skills add heygen-com/hyperframes --skill hyperframes-core -g -y
提供 HyperFrames 视频的非动画创意方向,包括品牌、节奏、风格、旁白和构图。处理设计规范、调色板、排版及节拍规划,确保视觉输出符合品牌规范且避免网页化空洞感。
需要确定视频的品牌风格或配色方案
请求生成或解析设计规格文件
进行视频画面的构图与节拍规划
调整视觉风格以匹配特定情绪或预设
npx skills add heygen-com/hyperframes --skill hyperframes-creative -g -y
定义 HyperFrames 关键帧技能,处理缩放、平移、镜头运动等视觉动画及 CSS/SVG 动画实现,明确与剪辑组装的边界,提供具体机制指导。
需要制作推拉镜头或 Ken Burns 效果
生成 CSS 或 JS 动画关键帧代码
执行 hyperframes keyframes 诊断
npx skills add heygen-com/hyperframes --skill hyperframes-keyframes -g -y
提供HyperFrames可视化素材库的检索与安装指南,支持通过catalog搜索和add命令快速集成预设块与组件,涵盖转场、图表等效果。
需要快速添加视频转场或特效
查找并安装预设视觉组件
使用HyperFrames构建动态内容
npx skills add heygen-com/hyperframes --skill hyperframes-registry -g -y
HyperFrames技能,用于通过HTML生成视频。涵盖项目初始化、编辑、动画、渲染及合规检查,支持字幕、图表等元素,遵循特定时间轴与媒体播放契约。
需要将HTML转换为视频
创建解释性视频或演示影片
对现有视频进行编辑或重新渲染
npx skills add heygen-com/hyperframes --skill hyperframes -g -y
HyperFrames媒体管理技能,用于解析或生成视频所需的各类媒体资产。支持音乐、音效、图像、语音及视频剪辑等,可调用HeyGen服务或本地工具,并处理媒体色调与转录。
需要为视频生成背景音乐或音效
需要创建或搜索图像、图标和Logo
需要生成语音旁白或虚拟人视频
需要对视频素材进行转写或背景移除
npx skills add heygen-com/hyperframes --skill media-use -g -y
将音乐曲目转化为节拍同步视频,支持歌词、幻灯片或动态宣传视频。通过自动分析音频节拍,编排并生成逐帧合成文件,最终渲染为完整视频作品。
用户需要将音频转换为视频
需要制作音乐节拍同步的视频内容
基于音乐节奏自动生成视觉素材
npx skills add heygen-com/hyperframes --skill music-to-video -g -y
将 GitHub PR 代码变更转化为解释性视频。作为编排器,按步骤摄入 PR 差异、设计故事板与脚本、生成帧并渲染最终视频,适用于代码变更展示场景。
用户请求将 GitHub Pull Request 转换为视频
需要基于代码 Diff 和提交记录制作功能或修复说明视频
npx skills add heygen-com/hyperframes --skill pr-to-video -g -y
将产品或营销内容转化为推广视频,涵盖需求捕获、品牌设计、脚本分镜及帧级制作。作为编排者,按步骤引导用户完成从brief到最终视频的生成流程,支持Figma源和多媒体资源调用。
需要制作产品发布或推广视频
要求展示网站功能或进行应用演示
提供产品URL、脚本或简报以生成宣传物料
npx skills add heygen-com/hyperframes --skill product-launch-video -g -y
将 Remotion、Motion Canvas 等动画源码或渲染视频迁移至 HyperFrames,支持代码翻译与媒体导入,并通过逐帧比对验证还原度。
需要将现有 Remotion 或其他动画项目迁移到 HyperFrames
需要验证迁移后的内容与原视频是否一致
npx skills add heygen-com/hyperframes --skill remotion-to-hyperframes -g -y
将任意视频文件重建为可编辑的 HyperFrames 项目,逐帧还原图层、音频和特效,支持反向、复制和重制视频内容。
用户要求反转或复制视频
需要将视频转换为可编辑项目
要求逐帧重建视频内容
npx skills add heygen-com/hyperframes --skill reverse-any-video -g -y
用于构建 HyperFrames 交互式幻灯片演示,支持场景切换、片段揭示、分支热点及演讲者模式。适用于需要可导航演示文稿而非视频导出的场景。
用户希望创建或转换交互式演示文稿
需要将现有页面转换为幻灯片结构
请求使用 presenter mode 或 speaker notes
npx skills add heygen-com/hyperframes --skill slideshow -g -y
为现有口播视频添加同步字幕的定制图形卡片(标题、数据标注等),生成MP4。适用于需包装视频内容而非纯字幕的场景。
graphic overlays
on-screen graphics
package / dress up my video
npx skills add heygen-com/hyperframes --skill talking-head-recut -g -y
定义视频字幕覆盖策略,规定字幕为叠加层而非预留区域。通过丢弃、轨道或嵌入三种模式处理台词,确保构图居中且保留完整画面,适用于讲解类视频的字幕设计与排版。
添加视频字幕时
决定台词处理方式(丢弃/轨道/嵌入)时
设计带字幕的视频构图时
npx skills add heygen-com/hyperframes --skill captions-overlay -g -y
定义7种运动图形转场与入场技巧(如Cut the Curve、Waterfall等),规范速度匹配、Z轴符号规则及模糊逻辑,指导动态文本和组运动的无缝衔接。
需要制作动态转场效果
设计Kinetic Text或标题卡入场动画
调整元素组的位置过渡
npx skills add heygen-com/hyperframes --skill cut-the-curve -g -y
定义动画连贯性核心法则,确保多场景视频呈现单一连续镜头感。涵盖向量定律、运动方向匹配及无缝衔接规范,指导动画编排以避免视觉断层与无效晃动。
需要制作多场景动画或视频时
处理场景间过渡与衔接逻辑时
npx skills add heygen-com/hyperframes --skill motion-doctrine -g -y
提供MacOS风格超大光标的动画规范,用于视频场景引导视线、触发转场及打破静态画面。涵盖尺寸、品牌化样式、入场退出法则及CSS/JS实现细节。
视频制作中需要引导观众视线
UI场景启动或鼠标点击动作
转场或动画序列的触发点
场景显得静止乏味需增加动态
npx skills add heygen-com/hyperframes --skill oversized-cursor -g -y
规范 HyperFrames 视频场景过渡的渲染前置条件,解决白闪与透明度问题。指导主时间线组装、注入器逻辑及模板占位符处理,确保过渡合成正确性。
主时间线组装
场景接缝出现白闪
分析过渡透明度异常
验证渲染侧混合机制
npx skills add heygen-com/hyperframes --skill seam-craft -g -y
定义视频字幕覆盖策略,采用叠加而非预留空间原则。规范字幕模型(丢弃/轨道/嵌入),确保构图居中且内容不被挤压,适用于口播或解说视频的字幕添加与排版决策。
为视频添加字幕
决定字幕是否保留、显示为普通文本或高亮强调
进行包含字幕的视频画面构图
npx skills add heygen-com/hyperframes --skill captions-overlay -g -y
提供七种高级视频转场与动效技术(如Cut the Curve、Waterfall等),涵盖速度匹配、Z轴方向规则及模糊逻辑,用于指导Kinetic Text和场景过渡的精确实现。
需要制作电影感转场
Kinetic Text动画设计
标题卡入场效果
npx skills add heygen-com/hyperframes --skill cut-the-curve -g -y
定义动画连贯性核心法则,确保多场景视频呈现单一连续镜头感。涵盖矢量定律、当前流及无缝过渡规则,指导如何消除独立动画间的动量断裂与无效晃动,为后续具体技术实现提供高层决策依据。
需要设计多场景动画转场
解决动画间动量不连贯问题
制定整体运动风格规范
npx skills add heygen-com/hyperframes --skill motion-doctrine -g -y
提供 macOS 风格超大光标在 HyperFrames 发布视频中的视觉规范,涵盖尺寸、样式及入场/点击动画逻辑,用于引导视线并增强场景动态感。
制作涉及鼠标或指针操作的 UI 场景
需要为静态画面添加高收益动态元素
执行变形、过渡或打字机效果的触发
npx skills add heygen-com/hyperframes --skill oversized-cursor -g -y
定义场景过渡的渲染正确性规范,确保主时间轴合成无误。解决白闪问题,处理重叠包装器、轨道分配及模板代码生成,是过渡机制的基础层。
组装主时间轴时
出现白色闪光或过渡不连贯时
验证重叠场景包装器的混合逻辑时
npx skills add heygen-com/hyperframes --skill seam-craft -g -y
为单人说话视频添加字幕,支持标准、电影感和主题特效三种风格。通过本地流程完成转录、抠像和合成,不修改原始素材,按视觉标识路由。
需要为视频添加字幕或标题
要求生成电影感或VFX风格的嵌入字幕
npx skills add heygen-com/hyperframes --skill embedded-captions -g -y
HyperFrames动画技能,提供原子运动规则、多阶段场景蓝图、转场及运行时适配器(GSAP等)。用于组合动画、加载模板或查询API。
需要实现UI动效或场景过渡
查找特定运行时(如GSAP/Lottie)的API用法
重构或审计现有动画编排逻辑
npx skills add heygen-com/hyperframes --skill hyperframes-animation -g -y
处理 HyperFrames 中已放置音频的混音,包括淡入淡出、交叉淡化、音量自动化、侧链压缩及 EQ/压缩等效果链应用。
需要对已放置音频进行混音处理
调整轨道增益或音量自动化
应用 EQ、压缩、混响等音频效果
解决多轨道间的频率冲突
npx skills add heygen-com/hyperframes --skill hyperframes-audio -g -y
定义 HyperFrames Studio 项目构建规范,包括时间轴布局、子组合结构及字幕轨道规则。区分编辑与对话场景,指导如何规划新影片及遵循现有文件约定。
用户询问或请求修改 HyperFrames 视频项目的结构或布局
需要规划新影片的 storyboard 和构建顺序
讨论时间轴中元素轨道的组织和安全区域设置
npx skills add heygen-com/hyperframes --skill hyperframes-studio -g -y
用于生成短时长、无旁白的设计导向动态图形,涵盖动效排版、数据可视化及UI动画等。支持从Figma导入资产,通过自主工作流完成素材获取、镜头规划与渲染输出,强调设计驱动与品牌一致性。
需要制作10秒内的动态Logo或品牌锁屏
生成动态数据图表或统计数字动画
创建网页滚动效果或UI交互演示动画
制作社交媒体覆盖层或动态地图
npx skills add heygen-com/hyperframes --skill motion-graphics -g -y


