你看到的区域 音频解析结果表
-
主要源码 AudioIntakePanel / AudioIntakeStatus in web/components/ad-recreation-board.tsx；复用 triggerTranscribe 和 AudioScript。
-
适合怎么描述 “原视频播放、连续响度波形、逐句时间轴滚动、高亮和跳转联动还需要怎么调整”。
+
主要源码 AudioIntakePanel / AudioIntakeStatus / SourceReferenceBuildPanel in web/components/ad-recreation-board.tsx；复用 triggerTranscribe、AudioScript、analyzeJob 和 generateSubjectAssets。
+
适合怎么描述 “原视频播放、12 张关键帧选择、相似主角 6 白底视图、连续响度波形、逐句时间轴滚动、高亮和跳转联动还需要怎么调整”。
你看到的区域 信息流复刻分镜工作台
-
主要源码 AudioStoryboardPlanPanel、ProductReferenceCard、MissingProductViewSlot、buildAudioStoryboardRows、selectProductItemsForRow、buildStoryboardSceneFromAudioRow、StoryboardVideoSlots in web/components/ad-recreation-board.tsx；逐行定向抽帧复用 onAddManualFrameForJob，产品白底图上传复用 uploadStoryboardAsset，视角自动识别调用 analyzeProductViews，缺角度自动补图调用 generateProductAngleAsset，单条生成复用 onGenerateVideo 和 PUT /frames/{idx}/storyboard。
+
主要源码 AudioStoryboardPlanPanel、ProductReferenceCard、MissingProductViewSlot、buildAudioStoryboardRows、selectProductItemsForRow、buildStoryboardSceneFromAudioRow、StoryboardVideoSlots in web/components/ad-recreation-board.tsx；产品白底图上传复用 uploadStoryboardAsset，视角自动识别调用 analyzeProductViews，缺角度自动补图调用 generateProductAngleAsset，单条生成按全局关键帧池匹配当前句时间点，复用 onGenerateVideo 和 PUT /frames/{idx}/storyboard。
适合怎么描述 “按音频逐句生成产品分镜、每行怎样改写口播、产品素材池识别/补图后的备注是否准确、单条生成该选哪几张产品图、生成的视频应该回显到哪一行”。
@@ -858,7 +858,7 @@ SubjectAsset {
创建任务 POST /jobscreateJob提交 TK 链接，后台开始下载；前端“开始”队列会在 downloaded 后自动触发音频解析。 上传视频 POST /jobs/uploaduploadJob保存 source.mp4，然后同样进入下载完成状态；当前上传后也加入第一步队列，下载完成后自动解析音频。 删除输入视频 DELETE /jobs/{id}deleteJob从任务队列、URL 和磁盘 jobs/<id> 目录移除整个 job，包括源视频、关键帧、元素提取图和生成视频。
-
解析视频 POST /jobs/{id}/analyze?frames=&target=&mode=&quality=analyzeJob后续阶段保留的抽帧能力。默认 frames=12；target 支持透明骨架人、综合、清晰主体、转场变化、表情瞬间、动作峰值。当前第一步主流程不自动调用该接口。
+
解析视频 POST /jobs/{id}/analyze?frames=&target=&mode=&quality=analyzeJob后续阶段保留的抽帧能力。默认 frames=12；target 支持透明骨架人、综合、清晰主体、转场变化、表情瞬间、动作峰值。当前第一步主流程不自动调用该接口；原版视频旁的“抽取 12 帧”会显式用 target=motion、quality=accurate、mode=replace 重新生成全局关键帧池。 音频文案轨 POST /jobs/{id}/transcribetriggerTranscribe若尚未拆轨，先从 source.mp4 提取 audio.wav 并回填 source_audio_url；随后用 ASR 提取原始文案，翻译成中文，写入 audio_script.source_text、source_zh 和逐句 transcript。远端 ASR_MODEL 失败后先走本机 LOCAL_ASR_BIN/LOCAL_ASR_MODEL（默认 mlx_whisper），再尝试 ASR_FALLBACK_MODEL。后端会拒绝重复文本、逐秒假字幕或覆盖率过低的结果，不再把不可听的多模态输出写进时间轴。再用 ASR_FALLBACK_MODEL 多模态音频分析讲话人、语速节奏、停顿、背景音乐/环境声/音效，写入 speaker_profile、rhythm_profile、background_audio_profile。当前第一步不默认生成 SKG 新口播和 MiniMax 配音。 分镜脚本改写 POST /jobs/{id}/script/rewriterewriteStoryboardScript根据原参考文案、当前新口播、分镜角色、时间段和作者想法改写中文口播。mode=segment 只改一段；mode=all 一次改完整片，要求整片前后连贯。接口只返回 items[index,text]，前端暂存在当前页面状态里，生成本条视频时写入 StoryboardScene.action。 原始音频文件 GET /jobs/{id}/audio.wavsourceAudioUrl返回拆轨得到的 wav；当前主界面不再渲染底部吸附音频条，右侧复刻工作表会读取该文件生成参考图式横向响度波形，并和原视频、逐句时间轴联动。
@@ -870,7 +870,7 @@ SubjectAsset {
应用清洗 POST /cleanup/applyapplyCleanedFrame物理覆盖 frames/{idx}.jpg，并备份原图。 元素增改删 POST/PATCH/DELETE /elementsaddElement/updateElement/deleteElement让用户修正 Vision 错误，避免候选结果锁死。 元素提取 POST /elements/{element_id}/cutoutcutoutElement调用图像模型生成独立白底素材图，每次累积一张 cutout。
-
主体资产包 POST /elements/{element_id}/subject-assetsgenerateSubjectAssets根据参考帧重新绘制一个统一主体资产包；前端默认把全部关键帧作为 source_frame_indices，如果用户手动选择了关键帧则只传已选帧，后端拼参考板。人物默认输出六张身份标准图，另有表情补充和动作补充分组可选；纯白/黑背景，不含其他元素，并裁去空白让主体占满画面。
+
主体资产包 POST /elements/{element_id}/subject-assetsgenerateSubjectAssets根据参考帧重新绘制一个统一主体资产包；前端默认把全部关键帧作为 source_frame_indices，如果用户手动选择了关键帧则只传已选帧，后端拼参考板。新增 subject_style=source_actor 与 reconstruction_mode=similar 用于信息流相似主角：最多读取 12 张已选关键帧，生成 6 张白底新演员视图，保留角色气质、动作词汇、机位和服装类别，但不复刻源人物身份或像素。旧透明骨架人流程仍默认走 subject_style=transparent_human。 首尾帧资产 POST /frames/{idx}/scene-assetgenerateSceneAsset同一接口兼容旧场景图和新首尾帧；新流程传 asset_role=first_frame/last_frame，后端走文字生图，参考帧只用于理解透明骨架人形象、比例、机位和光线，生成结果仍保存在 scene_assets 并自动填入产品融合镜头。 产品图库 GET /product-library/skglistProductLibrary读取内置 SKG 白底图库 manifest，返回产品标题、品类、尺寸、白底评分和预览图 URL。 产品图入库到 job POST /jobs/{id}/assets、POST /jobs/{id}/assets/product-libraryuploadStoryboardAsset、copyProductLibraryAsset上传产品图或把内置产品图库条目复制为当前 job 的普通 asset。后端统一生成最长边 1600px、JPEG 92 的 AI 工作副本，透明底铺白，过大/过小图片会在 ImageRef.asset_meta 里返回转换动作和风险；黑底/白底背景本身不强行转换。
@@ -985,6 +985,19 @@ SubjectAsset {
变更记录
这个记录不是 git log 的替代品。它记录“产品理解发生了什么变化、影响了哪些源码、你以后描述需求时该怎么说”。后续每次改功能都要补一条。
+
+
+ 2026-05-17 · 参考帧改为原视频旁全局关键帧与相似主角
+ API
+ UI
+ Workflow
+
+
+
问题： 分镜行里的“参考帧 / 关键元素”会把抽帧、人物参考和单条生成混在每一行里，占空间，也容易让用户误解为要逐行抽取并复刻源视频人物。
+
改动： AudioIntakePanel 在原版视频旁新增 SourceReferenceBuildPanel：一键重新抽取 12 张关键帧，人工选择主角参考后生成 6 张白底相似主角视图；AudioStoryboardPlanPanel 移除每行参考帧/关键元素列，生成视频时按全局关键帧池匹配当前句时间点。generateSubjectAssets 新增 subject_style=source_actor 与 reconstruction_mode=similar，用于生成类似但不复刻的正常广告演员。
+
影响： api/main.py、web/lib/api.ts、web/components/ad-recreation-board.tsx、docs/source-analysis.html。旧透明骨架人主体资产仍保留默认模式；信息流主流程的相似主角不走透明骨架人 prompt，也不做像素提取或精确身份复刻。
+
2026-05-17 · 分镜脚本支持单段和整片 AI 改写
diff --git a/web/components/ad-recreation-board.tsx b/web/components/ad-recreation-board.tsx
index 91dbe26..f8434ae 100644
--- a/web/components/ad-recreation-board.tsx
+++ b/web/components/ad-recreation-board.tsx
@@ -1197,20 +1197,199 @@ function AudioIntakePanel({
)
}
+function SourceReferenceBuildPanel({
+ job,
+ selectedFrames,
+ onToggleFrame,
+ onJobUpdate,
+}: {
+ job: Job
+ selectedFrames: Set
+ onToggleFrame: (idx: number) => void
+ onJobUpdate: (job: Job) => void
+}) {
+ const [extracting, setExtracting] = useState(false)
+ const [subjectBusy, setSubjectBusy] = useState(false)
+ const frames = useMemo(() => [...job.frames].sort((a, b) => a.timestamp - b.timestamp), [job.frames])
+ const selectedReferenceFrames = useMemo(
+ () => frames.filter((frame) => selectedFrames.has(frame.index)),
+ [frames, selectedFrames],
+ )
+ const actorSource = useMemo(() => {
+ const pool = selectedReferenceFrames.length ? selectedReferenceFrames : frames
+ for (const frame of pool) {
+ const element = frame.elements?.find(isSimilarActorElement)
+ if (element?.subject_assets?.length) return { frame, element }
+ }
+ for (const frame of pool) {
+ const element = frame.elements?.find(isSimilarActorElement)
+ if (element) return { frame, element }
+ }
+ return null
+ }, [frames, selectedReferenceFrames])
+ const actorAssets = actorSource?.element.subject_assets ?? []
+
+ const extractKeyframes = async () => {
+ setExtracting(true)
+ try {
+ for (const frame of job.frames) {
+ if (selectedFrames.has(frame.index)) onToggleFrame(frame.index)
+ }
+ const updated = await analyzeJob(job.id, 12, "motion", "replace", "accurate")
+ onJobUpdate(updated)
+ toast.info("已开始重新抽取 12 张关键帧，完成后在这里人工选择参考。")
+ } catch (e) {
+ toast.error("12 张关键帧抽取失败：" + (e instanceof Error ? e.message : String(e)))
+ } finally {
+ setExtracting(false)
+ }
+ }
+
+ const generateSimilarActor = async () => {
+ if (!selectedReferenceFrames.length) {
+ toast.warning("请先从 12 张关键帧里选择主角参考帧。")
+ return
+ }
+ const baseFrame = selectedReferenceFrames[0]
+ if (!baseFrame) return
+ setSubjectBusy(true)
+ try {
+ let workingJob = job
+ let workingFrame = workingJob.frames.find((frame) => frame.index === baseFrame.index) ?? baseFrame
+ let element = workingFrame.elements?.find(isSimilarActorElement)
+ if (!element) {
+ workingJob = await addElement(job.id, baseFrame.index, {
+ name_zh: "相似主角",
+ name_en: "similar ad actor",
+ position: "source-video main presenter selected from global keyframes",
+ source: "manual",
+ })
+ onJobUpdate(workingJob)
+ workingFrame = workingJob.frames.find((frame) => frame.index === baseFrame.index) ?? workingFrame
+ element = workingFrame.elements?.find(isSimilarActorElement)
+ ?? workingFrame.elements?.[workingFrame.elements.length - 1]
+ }
+ if (!element) throw new Error("similar actor element missing")
+
+ const updated = await generateSubjectAssets(job.id, baseFrame.index, element.id, {
+ subject_kind: "living",
+ subject_style: "source_actor",
+ reconstruction_mode: "similar",
+ background: "white",
+ size: "1024",
+ source_frame_indices: selectedReferenceFrames.slice(0, 12).map((frame) => frame.index),
+ views: ["front", "back", "left", "right", "three_quarter_left", "three_quarter_right"],
+ prompt: "Create a new similar information-feed ad presenter, not a replica of the source person. Keep the creator-ad energy, pose vocabulary, wardrobe category, shot readability, and commercial realism. White background six-view reference sheet output, consistent actor identity across views.",
+ })
+ onJobUpdate(updated)
+ toast.success("相似主角 6 张白底视图已生成")
+ } catch (e) {
+ toast.error("相似主角重构失败：" + (e instanceof Error ? e.message : String(e)))
+ } finally {
+ setSubjectBusy(false)
+ }
+ }
+
+ return (
+
+
+
+ {frames.length ? `${frames.length} 张` : "待抽帧"} · 已选 {selectedReferenceFrames.length}
+
+
+
+
+ void extractKeyframes()}
+ disabled={!job.video_url || extracting || job.status === "splitting"}
+ className="inline-flex h-7 items-center justify-center gap-1 rounded-md border border-white/10 bg-white/[0.055] px-2 text-[10.5px] font-semibold text-white/66 transition hover:border-cyan-300/35 hover:text-cyan-100 disabled:cursor-not-allowed disabled:opacity-35"
+ >
+ {extracting || job.status === "splitting" ?
+ void generateSimilarActor()}
+ disabled={!selectedReferenceFrames.length || subjectBusy}
+ className="inline-flex h-7 items-center justify-center gap-1 rounded-md bg-white px-2 text-[10.5px] font-semibold text-black transition hover:bg-white/90 disabled:cursor-not-allowed disabled:opacity-40"
+ >
+ {subjectBusy ?
+
+
+
+ {frames.slice(0, 12).map((frame, index) => {
+ const selected = selectedFrames.has(frame.index)
+ return (
+
onToggleFrame(frame.index)}
+ className={`group relative h-12 overflow-hidden rounded border bg-black transition ${
+ selected ? "border-emerald-300/70" : "border-white/10 hover:border-cyan-300/40"
+ }`}
+ title={`关键帧 ${index + 1} · ${frame.timestamp.toFixed(1)}s`}
+ >
+ {String(index + 1).padStart(2, "0")}
+
+ {selected ?
+
+ )
+ })}
+ {!frames.length && (
+
+ 点击“抽取 12 帧”后，这里会展示原视频关键画面。
+
+ )}
+
+
+
+
+ 相似主角白底视图
+ {actorAssets.length}/6
+
+ {actorAssets.length ? (
+
+ {actorAssets.slice(-6).map((asset) => (
+
+
+ ))}
+
+ ) : (
+
+ 选择能代表主角状态的关键帧后，用图像模型生成“类似但不复刻”的 6 张白底视图。
+
+ )}
+
+
+
| void
- onOpenFrame?: (idx: number) => void
+ selectedFrames: Set
onJobUpdate?: (job: Job) => void
onGenerateVideo?: (frameIdx: number, scene: StoryboardScene, model: string) => Promise | void
}) {
- const [busyRow, setBusyRow] = useState(null)
const [videoBusyRow, setVideoBusyRow] = useState(null)
const [productItems, setProductItems] = useState([])
const [productUploading, setProductUploading] = useState(false)
@@ -1222,6 +1401,11 @@ function AudioStoryboardPlanPanel({
const productFileRef = useRef(null)
const rows = useMemo(() => buildAudioStoryboardRows(job), [job])
const orderedFrames = useMemo(() => job ? [...job.frames].sort((a, b) => a.timestamp - b.timestamp) : [], [job])
+ const selectedReferenceFrames = useMemo(
+ () => orderedFrames.filter((frame) => selectedFrames.has(frame.index)),
+ [orderedFrames, selectedFrames],
+ )
+ const rowReferencePool = selectedReferenceFrames.length ? selectedReferenceFrames : orderedFrames
useEffect(() => {
setProductItems([])
@@ -1245,23 +1429,12 @@ function AudioStoryboardPlanPanel({
current_text: copyForRow(row),
})
- const framesForRow = (row: AudioStoryboardRow) =>
- orderedFrames.filter((frame) => frame.timestamp >= row.start - 0.2 && frame.timestamp <= row.end + 0.2).slice(0, 3)
+ const referenceFrameForRow = (row: AudioStoryboardRow) =>
+ closestFrameForTime(rowReferencePool, clampNumber((row.start + row.end) / 2, 0, Math.max(job?.duration || row.end, row.end)))
- const videosForRow = (refs: KeyFrame[]) => {
- const refIndices = new Set(refs.map((frame) => frame.index))
- return (job?.generated_videos ?? []).filter((video) => refIndices.has(video.frame_idx))
- }
-
- const addReferenceFrame = async (row: AudioStoryboardRow) => {
- if (!job || !onAddFrame) return
- const t = clampNumber((row.start + row.end) / 2, 0, Math.max(job.duration || row.end, row.end))
- setBusyRow(row.index)
- try {
- await onAddFrame(job.id, t)
- } finally {
- setBusyRow(null)
- }
+ const videosForFrame = (frame: KeyFrame | null) => {
+ if (!frame) return []
+ return (job?.generated_videos ?? []).filter((video) => video.frame_idx === frame.index)
}
const itemSourceForRef = (ref: ImageRef) => productItems.find((item) => sameImageRef(item.ref, ref))?.source ?? "upload"
@@ -1459,9 +1632,8 @@ function AudioStoryboardPlanPanel({
}
}
- const generateRowVideo = async (row: AudioStoryboardRow, refs: KeyFrame[]) => {
- if (!job || !refs.length || !onGenerateVideo) return
- const frame = refs[0]
+ const generateRowVideo = async (row: AudioStoryboardRow, frame: KeyFrame | null) => {
+ if (!job || !frame || !onGenerateVideo) return
const nextFrame = orderedFrames.find((item) => item.timestamp > frame.timestamp) ?? null
const scene = buildStoryboardSceneFromAudioRow({ ...row, skgCopy: copyForRow(row) }, frame, nextFrame, productItems)
setVideoBusyRow(row.index)
@@ -1483,7 +1655,7 @@ function AudioStoryboardPlanPanel({
} title="信息流复刻分镜工作台" />
-
每条分镜纵向排列；行内从左到右完成原内容、新文案、画面/产品、参考帧和生成视频。
+
每条分镜纵向排列；行内完成原内容、新文案、画面/产品和视频候选。关键帧选择与相似主角重构在原版视频旁统一处理。
0} detail={rows.length ? `${rows.length} 条` : "待音频"} />
@@ -1596,15 +1768,14 @@ function AudioStoryboardPlanPanel({
{rows.map((row) => {
- const refs = framesForRow(row)
- const rowVideos = videosForRow(refs)
- const busy = busyRow === row.index
+ const referenceFrame = referenceFrameForRow(row)
+ const rowVideos = videosForFrame(referenceFrame)
const generating = videoBusyRow === row.index
const copyText = copyForRow(row)
return (
{row.start.toFixed(1)}-{row.end.toFixed(1)}s
@@ -1642,45 +1813,15 @@ function AudioStoryboardPlanPanel({
-
- {refs.length ? (
-
- {refs.map((frame) => (
-
onOpenFrame?.(frame.index)}
- className="h-14 w-9 shrink-0 overflow-hidden rounded border border-white/10 bg-black/45 transition hover:border-cyan-300/40"
- title={`参考帧 ${frame.timestamp.toFixed(1)}s`}
- >
-
- ))}
-
{row.referencePlan}
- )}
-
-
- {row.keyElements}
+
+
+ {referenceFrame ? `参考 ${referenceFrame.timestamp.toFixed(1)}s · 可多次生成候选` : "先在原版视频旁抽取 12 帧"}
addReferenceFrame(row)}
- disabled={!onAddFrame || busy}
- className="mt-1.5 inline-flex h-7 w-full items-center justify-center gap-1 rounded-md border border-white/10 bg-white/[0.055] px-2 text-[11px] text-white/70 transition hover:border-white/25 hover:bg-white/[0.1] disabled:cursor-not-allowed disabled:opacity-45"
- >
- {busy ?
-
-
-
- 0} />
- generateRowVideo(row, refs)}
- disabled={!refs.length || !onGenerateVideo || generating}
+ onClick={() => generateRowVideo(row, referenceFrame)}
+ disabled={!referenceFrame || !onGenerateVideo || generating}
className="mt-1.5 inline-flex h-8 w-full items-center justify-center gap-1 rounded-md bg-white px-2 text-[11px] font-semibold text-black transition hover:bg-white/90 disabled:cursor-not-allowed disabled:opacity-40"
>
{generating ?
- {enabled ? `候选 ${visible.length + index + 1}` : "先抽参考帧"}
+ {enabled ? `候选 ${visible.length + index + 1}` : "先抽 12 帧"}
))}