cc
/
AI.Demo
2
1
Fork 0
Code Pull Requests Actions Releases Activity
AI.Demo/.codebuddy/plans/video-generation-flow-updat...

2.7 KiB
Raw Permalink Blame History

name overview todos
video-generation-flow-update 修改 VideoExplanation.vue 的视频生成流程，新增阶段二（调用 nano-banana 生成首尾帧图片），然后用首尾帧图片调用万相模型生成视频
id content status
import-config 导入 GRS_API_KEY，添加 storyboardImages 状态和 phase 枚举扩展 completed
id content status dependencies
add-image-functions 新增 generateImageForShot 和 generateImagesFromStoryboard 函数 completed
import-config
id content status dependencies
modify-video-api 修改 generateSingleClip 为万相首尾帧视频 API 调用 completed
import-config
id content status dependencies
update-main-flow 修改 generateVideoFromScript 整合三个阶段 completed
add-image-functions
modify-video-api
id content status dependencies
update-ui 更新 UI 阶段指示器、进度显示和图片预览 completed
update-main-flow

用户需求

将视频生成流程修改为三阶段：

  1. 阶段一（保持不变）：解析试题，生成讲解文案 + 分镜脚本
  2. 阶段二（新增）：根据分镜调用 nano-banana 生成首尾帧分镜图片
  • 每个分镜生成 2 张图片（首帧 + 尾帧）
  • prompt 直接使用 storyboard[].visual
  • 使用 nano-banana-pro 模型
  1. 阶段三（修改）：根据首尾帧图片调用万相 API 生成视频
  • 使用万相首尾帧视频模型 wan2.2-kf2v-flash
  • 视频时长固定 5 秒

关键变更

  • storyboard 新增 firstFrameUrl、lastFrameUrl 字段存储图片
  • phase 新增枚举值：firstFrame、lastFrame、video
  • 视频时长从 15 秒改为 5 秒（万相模型限制）
  • progress 重新分配：脚本 0-15%，首帧 15-40%，尾帧 40-65%，视频 65-98%

技术栈

  • Vue3 Composition API
  • axios HTTP 客户端
  • Vite 代理（已配置 dashscope-api）

实现方案

新增状态

  • storyboardImages: 存储每个分镜的首尾帧图片 URL 列表

新增/修改函数

  1. generateImageForShot(shot, frameType): 调用 nano-banana 生成单张图片
  2. generateImagesFromStoryboard(): 遍历分镜生成所有首尾帧图片
  3. generateSingleClip(): 改为调用万相首尾帧视频 API（wan2.2-kf2v-flash）

API 调用

  1. nano-banana 图片生成：
  • URL: https://grsai.dakka.com.cn/v1/draw/nano-banana
  • 参数: model="nano-banana-pro", prompt=visual, aspectRatio="16:9", imageSize="1K"
  1. 万相首尾帧视频：
  • URL: /dashscope-api/api/v1/services/aigc/image2video/video-synthesis
  • 参数: model="wan2.2-kf2v-flash", first_frame_url, last_frame_url
  • resolution: "720P"

配置

  • 复用 src/config/index.js 中的 GRS_API_KEY