# Airshelf 页面流程定稿记录 > 本文件用于记录和用户逐页确认后的产品页面流程。 > PRD 只作为功能边界参考,页面布局与交互以本文件后续定稿为准。 维护日期:2026-05-28 --- ## 0. 总体原则 - 创作视频是产品主线任务。 - 当前版本单条生成视频的时长上限是 15s。 - AI 图片创作是附加能力,用于辅助商品图、人物、场景等素材生产,不抢视频主线。 - 页面跳转尽量少,能在当前页面完成的操作尽量不跳转。 - 操作尽量简单,第一次使用 AI 产品的用户也应该能理解。 - 5 个 Stage 是步骤引导,不是强制锁定流程。 - 用户可以在脚本、基础资产、故事板、视频、拼接导出之间自由跳转。 - 如果某个 Stage 缺少前置内容,页面给提示和快捷补全入口,不做硬锁死。 - 暂不做复制项目、归档、审核、待审核、待我确认等复杂项目管理概念。 --- ## 1. 视频项目页 `/projects` ### 页面定位 视频项目页是视频生产任务列表,帮助用户看清每个视频项目做到哪一步,以及下一步能点什么。 ### 不做内容 - 不做复制项目。 - 不做归档。 - 不做审核 / 待审核 / 待我确认。 - 不做草稿分类。 - 不做复杂批量操作。 - AI 图片创作不作为顶部主按钮。 ### 状态分类 只保留: - 全部 - 进行中 - 生成中 - 已完成 - 失败 ### 页面结构 1. Page Head - 标题:视频项目 - 主按钮:新建视频项目 2. 状态概览 / Tab - 全部 - 进行中 - 生成中 - 已完成 - 失败 3. 工具栏 - 搜索项目 / 商品名 - 商品筛选 - 状态筛选 - 最近更新排序 - 可选:列表 / 卡片视图切换 4. 项目列表 - 默认列表行,不默认大卡片。 - 每行展示: - 9:16 缩略图 - 项目名 - 关联商品 - 当前阶段 - 5 段进度:脚本 / 资产 / 故事板 / 视频 / 导出 - 更新时间 - 状态 - 主操作:继续 / 查看进度 / 查看成片 / 重试 5. 空状态 - 没有商品:引导新建商品。 - 有商品但没有项目:引导新建视频项目。 --- ## 2. 新建视频项目页 `/projects/new` ### 页面定位 新建项目页只负责创建项目壳子,并绑定商品。 脚本怎么生成、脚本风格、任务设定等全部放到 Stage 1 脚本页。 ### 交互原则 - 一个页面内完成,不做多步跳转。 - 只问用户:为哪个商品创建视频。 - 创建后直接进入项目流水线的 Stage 1 脚本页。 ### 字段 必选: - 商品 可选: - 项目名称 - 默认自动生成,例如:商品名 + 短视频 + 日期。 不展示: - 创作方式 - 脚本风格 - 任务设定 - 商品卖点选择 - 预估消耗 ### 卖点选择归属 商品卖点不放在新建项目页。 商品卖点选择放到 Stage 1 脚本页,作为“本条视频重点”配置项,从商品库自动带出。 --- ## 3. Stage 1 脚本页 ### 页面定位 脚本页是 AI 脚本工作台。 用户通过 AI 输入和启动卡片完成脚本来源选择、卖点选择、风格设定、任务设定,并在中间区域查看完整读秒流分镜脚本。 ### 核心原则 - 脚本是用户最关注的内容,必须放在中间最大区域。 - 脚本不按 15s 大段展示。 - 脚本按完整读秒流分镜展示,适合短视频细看。 - AI 聊天不是主内容,而是脚本修改和生成记录。 - AI 输入框放页面底部固定,作为当前 Stage 的全局指令入口。 ### 页面布局 顶部: - 项目面包屑 - 商品名 / 项目名 - 5 Stage 自由切换导航:脚本 / 基础资产 / 故事板 / 视频 / 拼接导出 主体: - 左侧窄栏:商品信息 / 卖点 / 人物 / 场景等辅助信息 - 中间主栏:读秒流分镜脚本 - 右侧窄栏:AI 对话记录 / 操作历史 底部固定栏: - AI 输入框 - 页面操作按钮,例如重新生成全部、进入下一步 ### 空状态引导 脚本来源不做 Tab。 脚本未生成时,中间主区域展示启动卡片: - AI 帮我写 根据商品信息自动生成完整读秒流分镜。 - 我有脚本 粘贴已有口播稿,AI 帮你整理成分镜结构。 - 一句话生成 输入一句视频方向,AI 生成完整分镜。 - 复刻爆款 暂未开放或后续版本处理。 用户选择后进入对应模式。生成脚本后,中间区域切换为完整读秒流分镜。 ### 读秒流分镜结构 每个分镜以卡片 / 行卡展示: - 镜头编号 - 时间段,例如 0-5s、5-10s - 画面描述 - 对白 / 旁白 - 可选:镜头类型、场景、人物 用户可以: - 直接编辑某个分镜文字。 - 用底部 AI 输入框修改某个分镜。 - 重新生成全部。 - 调整整体时长、口吻、卖点重点等。 ### 商品卖点 - 从商品库自动带出。 - 在脚本页展示为“本条视频重点”。 - 默认选中前 2-3 个,或默认使用全部卖点。 - 用户可点选 / 取消。 - 用户也可以直接在 AI 输入框里说重点突出哪些卖点。 --- ## 4. Stage 2 基础资产页 ### 页面定位 基础资产页用于为当前视频准备视觉资产。 它不是资产库,也不是完整 AI 图片创作页。 ### 总体原则 - 默认 AI 自动生成,用户只在效果不好时调整。 - 脚本确定后,AI 自动识别需要的商品、人物、场景,并生成图片提示词。 - 页面优先让用户看默认生成效果。 - 不满意时再修改提示词、上传参考图、从资产库选择或重新生成。 - 商品是最重要的,优先展示商品资产。 ### 页面布局 - 左侧:资产清单 - 中间:当前资产工作台 / 生成结果 - 右侧:AI 操作记录 / 生成记录 - 底部:AI 输入框 ### 资产顺序 1. 商品资产 2. 人物 3. 场景 ### 商品资产 商品三视图是一张 16:9 图,包含正面、侧面、背面。 它不是三张图,也不拆分成三个槽位。 不提供: - 上传三视图 - 使用现有商品图 原因: - 用户一般不会有适合生成视频的白底三视图。 - 如果不生成三视图,系统本来就只能默认使用商品图继续,不需要多给一个“使用现有商品图”的操作。 推荐交互: - 展示当前商品图。 - 展示商品三视图状态:未生成 / 生成中 / 已生成。 - 说明:生成 16:9 商品三视图可以提升商品角度稳定性。 - 主操作:生成商品三视图。 - 不生成三视图也可以继续,只做弱提示。 生成规则: - 商品三视图属于结构转换型。 - 默认一次生成 1 张。 - 不满意可重新生成或用 AI 输入框调整提示词。 - 商品三视图支持保留历史版本,用户可以在历史版本中选择满意的一版采用。 ### 人物资产 命名为“人物”,不叫“模特”。 人物指脚本中需要出现的角色,用户要确定这个角色的形象。 默认流程: 1. AI 根据脚本自动识别人物。 2. AI 为每个人物自动生成图片提示词。 3. 默认生成 4 张人物立绘候选。 4. 用户选择 1 张满意的立绘。 5. AI 基于选中的立绘生成 1 张 16:9 人物三视图。 6. 用户采用此人物资产。 不满意时,用户可以: - 修改描述。 - 上传自己的模特 / 参考图。 - 从人物库选择。 - 重新生成立绘。 - 从历史立绘里再选一张生成三视图。 - 重新生成人物三视图。 - 从人物三视图历史版本中选择满意的一版采用。 人物调整不放抽屉。 点击人物后,中间区域直接切换为人物工作台。 人物工作台需要一步到位承载: - 人物库选择 - 上传参考图 - 描述生成 - 直接使用自己的模特 - AI 生成多张立绘 - 从立绘生成三视图 - 从历史立绘再选再生成三视图 ### 场景资产 默认流程: 1. AI 根据脚本识别场景。 2. AI 自动生成场景图提示词。 3. 默认一次生成 4 张候选。 4. 用户选择 1 张。 不满意时,用户可以: - 修改描述。 - 重新生成。 - 上传替换。 ### 候选生成规则 创意选择型:一次生成 4 张。 - 人物立绘 - 场景图 结构转换型:一次生成 1 张。 - 商品三视图 - 人物三视图 三视图版本规则: - 商品三视图和人物三视图都可以重跑。 - 每次重跑产生一个历史版本。 - 用户可以在历史版本中回选满意的一版。 - 采用某一版后,该版本成为当前项目使用版本。 ### 资产复用 人物默认是项目内资产,不自动进入团队人物库,避免资产库变乱。 采用人物时可以勾选: - 保存到人物库 保存后: - 进入团队共享人物库。 - 后续项目可复用。 - 记录来源:项目内生成 / AI 生成 / 上传参考图等。 --- ## 5. Stage 3 故事板页(已确认原则,待细化) ### 页面定位 故事板页是可选的预览步骤,不是视频生成的必经步骤。 ### 已确认原则 - 故事板不是一定要生成。 - 用户可以跳过故事板,直接进入视频生成。 - 故事板的价值是提前预览视频大致画面和内容。 - 故事板有时会固定最终视频画面,反而可能让视频生成效果不如不使用故事板。 - 因此故事板不能作为强制前置条件。 - Stage 3 应该提供“生成故事板预览”和“跳过,直接生成视频”两条路径。 - 如果用户跳过故事板,Stage 4 直接基于脚本和基础资产生成视频。 - 故事板提示词直接在原提示词基础上修改。 - 暂不做独立 AI 辅助输入框或 AI 聊天式提示词修改。 - 故事板绑定资产需要展示,但只做轻量引用说明。 - 绑定资产默认不展示缩略图。 - 绑定资产用文字标签 / 资产引用标签展示。 - Hover / Popover 时展示资产详情。 - Stage 3 不直接编辑资产,修改资产需要回到 Stage 2。 - 如果绑定资产在 Stage 2 被替换,Stage 3 显示“绑定资产已更新,建议重新生成故事板”。 ### 绑定资产展示 绑定资产展示的是引用关系,而不是图片预览。 示例: - 商品:补水面膜 - 人物:女主、同事 - 场景:卫生间、书桌 或以标签形式展示: - 商品 · 补水面膜 - 人物 · 女主 - 人物 · 同事 - 场景 · 卫生间 Hover 详情示例: - 商品 · 补水面膜 - 商品图数量 - 商品三视图状态 - 来源:商品库 - 操作:查看 / 去基础资产修改 - 人物 · 女主 - 当前立绘状态 - 人物三视图状态 - 来源:项目内 / 人物库 - 操作:查看 / 去基础资产修改 ### 提示词编辑 - 用户直接在原本提示词基础上修改。 - 提示词就是重新生成故事板的依据。 - 第一版不做 AI 辅助修改提示词。 - 可保留恢复原始提示词、重新生成等基础操作。 ### 待继续确认 - 故事板是否进入页面后自动生成,还是由用户点击生成。 - 生成视频时,已生成故事板是否默认作为参考,还是由用户选择是否使用。 - 故事板历史版本如何展示。 --- ## 6. 待继续确认页面 - Stage 5 拼接导出页 - 商品库 / 商品详情 - 资产库 - AI 图片创作 - 人物库 - 工作台 - 团队 - 消费 - 设置 --- ## 7. Stage 5 拼接导出页 ### 页面定位 拼接导出页是最终成片工作台。 它负责把 Stage 4 采用的 AI 视频片段、用户上传的视频、资产库视频等素材自由拼接,并完成字幕、BGM、转场和导出。 ### 布局方向 参考剪映 / CapCut 的基础剪辑布局,但只保留轻量功能。 页面区域: - 顶部:项目名、Stage 导航、导出状态 - 左侧:素材池 - 中间上方:成片预览播放器 - 右侧:属性设置 - 底部:时间线 ### 素材池 素材池包含: - AI 生成视频片段 - 上传视频 - 批量上传视频 - 从资产库选择视频 上传视频时支持勾选: - 保存到资产库,供以后复用 默认不勾选,避免资产库变乱。 ### 时间线 第一版只做单主轨轻剪辑。 支持: - 自动放入 Stage 4 当前采用的 AI 视频片段,按顺序排列 - 拖拽排序 - 添加上传视频 - 删除片段 - 替换片段 - 裁剪起止点 不做: - 多轨自由叠加 - 关键帧 - 复杂音频混音 - 速度曲线 - 画中画 - 蒙版 - 贴纸 / 复杂特效 ### 裁剪 需要支持裁剪。 选中时间线片段后,右侧属性区显示: - 开始时间 - 结束时间 - 当前片段时长 - 应用裁剪 时间线片段两侧可保留轻量拖拽手柄。 ### 字幕 字幕默认自动添加。 规则: - 进入 Stage 5 后,系统根据脚本台词 / 旁白自动生成字幕。 - 字幕默认开启。 - 用户可以关闭字幕。 - 用户可以编辑字幕文字和时间。 - 第一版不强制支持识别用户上传视频语音生成字幕。 右侧属性区默认展示: - 字幕开关 - 字幕来源:脚本台词 - 字幕样式 - 编辑字幕入口 字幕编辑使用轻量面板,不做复杂字幕工作台。 示例: - 00:00 - 00:03 熬夜后皮肤干到起皮? - 00:03 - 00:06 这片补水面膜我最近一直在用。 - 00:06 - 00:10 敷完脸会明显更透亮。 ### BGM / 转场 / 导出 右侧属性区包含: - BGM 开关 - BGM 选择 - 原声 / BGM 音量 - 转场开关 - 转场类型 - 导出比例,默认 9:16 - 清晰度,默认 1080P - 格式,默认 MP4 BGM 默认开启,用户可修改或关闭。 转场默认开启,用户可修改或关闭。 ### 导出成功 导出成功后不新增独立页面。 在 Stage 5 当前页面展示导出成功状态 / 结果面板。 导出中: - 显示导出进度。 导出成功后展示: - 成片预览播放器 - 下载 MP4 - 复制链接 - 查看成片资产 - 继续编辑 - 返回视频项目 导出成功后: - 项目状态标记为已完成。 - 成片自动进入项目资产。 后续如果接入平台发布能力,再增加发布入口;第一版不做独立发布页。 --- ## 6. Stage 4 视频页 ### 页面定位 视频页只用于 AI 生成视频片段。 用户上传视频、使用自己的视频、与 AI 视频混合拼接,都放到 Stage 5 拼接导出页处理。 ### 核心原则 - 视频生成以片段为单位。 - 每段视频独立生成。 - 单个视频生成片段上限是 15s。 - 长视频由多个 15s 内的视频片段组成,后续在 Stage 5 拼接。 - 视频一次只生成 1 条候选。 - 首次进入视频页后,AI 可以自动生成视频,不需要用户手动点击生成。 - 视频有自己的生成提示词。 - 用户可以直接修改视频提示词。 - 用户可以不改提示词直接重跑。 - 每次重跑保留历史版本。 - 用户可以从历史版本中回选满意的一版。 ### 视频来源 Stage 4 只展示和管理 AI 生成视频片段。 每个 AI 片段的视频来源是: - 当前采用的 AI 生成版本 - AI 历史版本中的某一版 ### 故事板使用 如果当前片段有故事板,默认使用故事板生成视频。 原因: - 对小白用户来说,“使用 / 不使用故事板”解释成本高。 - 用户既然生成了故事板,视频结果和故事板不一致时容易产生困惑。 Stage 4 可以允许用户修改是否使用故事板,但默认不主动要求用户选择。 ### 页面结构初稿 左侧: - 片段列表 - 每段显示时间范围、来源、生成状态、当前采用版本 中间: - 当前片段视频预览 / 生成状态 - 视频播放器 - 当前采用版本标识 右侧: - 视频提示词编辑器 - 故事板使用状态 / 可修改 - 绑定输入资产引用 - 视频历史版本 底部: - 重新生成 - 采用当前版本 - 进入拼接导出 ### 待继续确认 - 视频历史版本如何展示。