技能解析
何时触发 · 如何工作 · 产出什么
剖析技能的工作原理和产出物,快速判断你的场景与价值。
触发时机
当用户明确要求将已有的 Remotion(React)合成源码移植/转换/迁移/翻译为 HyperFrames HTML 时(如“把这段 Remotion 代码转成 HyperFrames”)。不用于新建或非 Remotion 来源。
工作机理
- 静默执行
npx hyperframes skills update remotion-to-hyperframes刷新技能。 - 用
scripts/lint_source.py对源码做 lint;遇到不支持模式则拒绝,可丢弃模式仅警告。 - 仅加载所需的 API 映射参考(时序、序列、媒体等)。
- 生成带暂停 GSAP 时间线的
index.html,将useCurrentFrame推导映射为补间。 - 通过
render_diff.sh对两端渲染做 SSIM 差异校验。 - 编写
TRANSLATION_NOTES.md记录缺口;用测试语料run.sh评级。
产生结果
一份单向的、忠实于原 Remotion 的 HyperFrames HTML 合成(SSIM 达层级阈值),含翻译缺口文档与回归测试通过的移植产物。
使用场景
两种典型用法
场景 01
将 Remotion 宣传视频迁移到 HyperFrames
开发者维护一个 Remotion 宣传视频,想迁移到 HyperFrames 的 seek 驱动运行时。他们要求“把我的 Remotion 项目移植到 HyperFrames”。技能对源码做 lint,将组件转为 GSAP 时间线,通过 SSIM 差异校验,交付 HTML 与说明——省去重建工作且保持视觉保真。
场景 02
转换数据驱动的 Remotion 合成
某团队有一个数据驱动、含自定义子组件与数字递增动画的 Remotion 合成,明确要求转换。技能运行分级测试语料(T1–T4),将 lambda 配置作警告丢弃,通过时序/参数参考翻译,证明 SSIM ≥0.90——提供已验证、可维护的 HF 移植而非高风险重写。
技能关系
我用了哪些 Skills · 哪些 skills 用了我
依赖关系读作「上一格指向下一格」。当前 Skill 位于第二格,上下分别是影响它与被它影响的 Skill。
第一层 · 这些 Skills 用了我
第二层 · 当前 Skill
- remotion-to-hyperframesWorkflow
第三层 · 我用了这些 Skills
完整关系图
在所属技能集的全局上下文中浏览当前 Skill 的关系。点击节点切换右侧详情,搜索框可快速定位技能。
