跳转到使用指南
Video to Superprompt作者 MengTo

Video to Superprompt Skill.

将参考视频转为具体的设计与动效重建提示词。

  • 视频分析
  • 镜头提示词
源文件解读 · video-to-superpromptSKILL.md
任务 将参考视频转为具体的设计与动效重建提示词。 产出 一份详细、可直接粘贴的重建或借鉴提示词。 开始前的准备 提供可检查的录屏,说明是希望近似复刻还是借鉴改编。附上目标框架和可用素材,让需求区分可用文件与缺失参考。
编辑摘要 · 源文件核查于 2026-11-02 · 非生成示例

01 功能说明

将参考视频转为具体的设计与动效重建提示词

分析参考视频的布局、素材、转场和滚动行为,生成可交给构建工具的提示词,涵盖响应式与动效降级方案。

基于来源的工作流并非执行基准测试

工作方法

video-to-superprompt 将可访问的参考视频转成可供其他构建工具使用的详细需求。它检查画面顺序、屏幕布局、字体、素材与动效机制,再将观察到的行为写成具体实现指令。默认交付物是可直接粘贴使用的提示词。

源文档区分精确复刻与借鉴改编。精确复刻时,它要求智能体在相关 HTML、CSS 或 JavaScript 可用时检查这些源码。素材清单区分真实路径与占位符;提示词必须描述移动端行为、减少动态效果和各板块时序,不能只写“类似的动画”等泛泛描述。

预期交付物

  • 一份详细、可直接粘贴的重建或借鉴提示词。
  • 包含真实文件名、源 URL 及明确标记缺失素材的素材清单。
  • 可选的文章、实现需求说明或独立素材生成提示词。
查看示例简报

从简报到审查

  1. 01
    定位并探查录屏

    确认参考可访问。对于本地视频,检查时长、尺寸与帧率,并在有意义的变化前后提取帧。

  2. 02
    描述可见机制

    分别整理叙事、布局、视觉处理和动效。只在录屏有依据时识别固定板块、蒙版、滚动驱动进度或镜头变化。

  3. 03
    编写可供构建的需求

    按板块组织提示词,包含素材、交互、响应式行为和降级方案。检查引用文件是否存在,否则明确标记为占位符。

02 适用场景

适合什么场景

提供可检查的录屏,说明是希望近似复刻还是借鉴改编。附上目标框架和可用素材,让需求区分可用文件与缺失参考。

适合的场景

  • 动效参考难以解释流程将录屏转为有名称的视觉机制与可讨论、可重建的顺序。
  • 实现前需要设计交接适合先准备有用的需求说明,再选择构建工具或实现技术栈。

需要检查的限制

  • 视频必须可检查无法访问的 URL 不能支持关于观察到的布局或时序的结论。缺失源素材应明确保留为缺口。
  • 交付物是提示词写出需求不代表已实现页面,也不能证明原作使用了所建议的技术。

请提供这些输入

  • 参考录屏提供可访问的本地视频或 URL,并指出最重要的部分。
  • 复刻边界说明是尽量准确地复现视觉行为,还是改编为不同品牌与内容。
  • 目标项目描述框架、可用素材、移动端要求和最终体验目标。

03 关键决策

影响结果的关键选择

  1. 让动效可执行

    固定面板或视频进度控制等明确机制,能告诉构建工具具体需要实现什么。

  2. 素材来源明确

    素材清单将已有资料与仍需制作的图像或视频分开。

  3. 把降级方案写入需求

    在桌面端动效编排旁,同时写明移动端和减少动态效果的行为。

04 示例任务

从一份具体的需求开始

以下示例任务说明尚未经过测试。使用前请检查该技能的设置。

查看源文件和环境要求

提供可访问的本地视频或 URL,并指出最重要的部分。

上游源文件
https://github.com/MengTo/Skills/blob/ef5f85130d083d33e08cb19f6ee23cdde2d406ab/agent-skills/codex/video-to-superprompt/SKILL.md

下方链接会打开上游使用说明。使用前请查看仓库的环境配置要求;这不是安装命令。

先完成一项明确的交付物

运行该技能之前,请根据需要调整此需求中的范围、来源材料和约束。

示例简报
使用 video-to-superprompt 分析提供的 25 秒产品网站录屏。我想为日程安排应用做借鉴改编,保留固定的功能板块以及滚动位置与视频进度之间的关系。检查开场、板块边界和最终状态,并区分实际观察与实现猜测。输出一份可直接粘贴的构建提示词,包含素材清单、板块结构、动画时序、键盘与移动端行为,以及减少动态效果的替代方案。将不可用素材标记为占位符。不要实际构建网站,也不要在没有源码确认时宣称原作使用了某个特定库。

检查结果

根据以下可观察标准检查实际输出。

  • 确认代表性帧覆盖所有重要转场。
  • 检查全部素材引用,并标记未知实现细节。
  • 确保每项主要交互都明确移动端行为和减少动态效果的方案。

OpenDesign 为编码智能体提供本地设计工作区。此条目并不表示该技能已内置,也不表示其中包含其外部工具、凭据和软件依赖项。

05 来源与许可证

来源与许可证

本页面描述的是下方链接所指向的固定来源修订版本。上游行为和要求可能会发生变化。

来源所有者
MengTo
技能文件
SKILL.md
许可证
MIT
已审查的快照
2026-11-02 · ef5f85130d08
编辑来源摘要
将参考视频转为具体的设计与动效重建提示词。

由 OpenDesign 根据所链接来源撰写的原创摘要。仓库星标数只是带有时间属性的受欢迎程度指标,并不代表技能使用量或质量评分。

06 开始前的问题

开始前可能想问

会自动复刻网站吗?

默认输出是提示词。实现、文章或素材包属于需要另行提出的输出模式。

能识别原作使用的动画库吗?

它可以建议合适的机制并检查可用源码。仅凭录屏不能证明效果由哪个库生成。

为什么不只均匀抽帧?

短暂转场可能落在等间距缩略图之间而被遗漏。源文档优先关注时间轴节拍、板块变化以及起止状态。

OpenDesign

让需求和设计工作保存在一起。

将简报、来源材料和设计工作集中保存在本地工作区中。将该技能添加到工作流程前,请检查其自身的设置说明。

上游源文件
https://github.com/MengTo/Skills/blob/ef5f85130d083d33e08cb19f6ee23cdde2d406ab/agent-skills/codex/video-to-superprompt/SKILL.md