技术栈 FastAPI Vue3 Redis MySQL Docker Compose。 开发周期2026 年暑期项目实训。一、项目概述Indigo Nebula AI 是一个面向短视频创作者的AI 漫剧制作平台目标是把灵感→小说→角色→分镜→图片→视频→配音→成片这七步流程全部用一个大模型工作流串起来实现一句话生成短视频。1.1 业务背景传统短视频生产里编剧、分镜、美术、剪辑、配音往往需要多人协作而这个项目试图让个人创作者只输入一段故事灵感或主题系统就能自动生成小说大纲与章节从小说中抽取角色把小说拆成分镜脚本根据分镜生成图片把图片生成视频片段给视频配上 AI 语音最终合成 MP4 成片。1.2 核心体验全流程覆盖7 步工作流在一个平台闭环完成可编辑可干预每一环节的 AI 产出都能人工修改、重生成、上下文联调模型可替换用户可在后台配置自己的大模型 API Key智谱、阿里、OpenAI 兼容等。二、技术选型2.1 后端技术用途说明FastAPIWeb 框架异步接口、自动 OpenAPI 文档MySQL主数据库用户、作品、角色、分镜、历史记录等Redis队列 缓存小说生成队列、任务进度SQLAlchemy裸 SQL 连接池数据访问用 pymysql DBUtils 做连接池python-jose / passlibJWT 密码加密用户鉴权python-multipart文件上传素材上传imageio-ffmpeg视频合成后端自带 ffmpeg 二进制无需系统安装edge-ttsAI 配音微软 Edge 神经语音免费可用2.2 前端技术用途Vue 3 Vite单页应用TypeScript类型安全Pinia状态管理Tailwind CSS 3.4原子化样式Sass全局主题变量Material Symbols图标系统2.3 部署技术用途Docker容器化Docker Compose四服务编排MySQL / Redis / Backend / FrontendNginx前端静态服务 反代/api、/static三、系统架构3.1 后端模块划分app/api路由层按业务模块拆分app/services业务逻辑层app/repositories数据访问层裸 SQLapp/providers外部 AI 服务抽象文本生成、文生图、视频、TTSapp/workers异步任务工作线程小说生成队列、导出守护进程。3.2 前端目录结构src/views页面src/components组件布局 UI 业务src/storesPinia 状态src/features按业务域拆分的状态与逻辑。四、核心功能实现4.1 小说生成步骤 1早期前端写死走了本地 mock生成的章节内容全是水稿同一段话重复 N 次。后来改成真实调用后端POST /api/novel/create后端用 Redis 队列排队worker 线程逐章调用智谱 GLM-4-Flash生成真实小说内容。关键修改点前端stores/novel.ts新增真实生成与轮询进度后端NovelCreateRequest的枚举与前端 6 个风格选项对齐prompt 中约束标题不再带第 X 章前缀避免章节名重复。4.2 角色管理步骤 2用智谱 GLM-4-Flash 从小说正文中抽取角色名、外貌、性格、声线等字段。抽取后人工可编辑保存到角色库。4.3 分镜设计步骤 3把小说章节按场景拆成若干 shot镜头。每个 shot 包含场景描述、台词、运镜、画面描述、时长。支持批量出图、批量出视频。4.4 图片生成步骤 4默认走阿里通义千问 qwen-image-2.0-pro候选智谱 CogView-3。根据 shot 的画面描述生成对应图片并回写到 shot 上。4.5 视频生成步骤 5默认走智谱 CogVideoX-Flash免费通道。把图片 prompt 送进视频模型生成短视频片段。这个环节是性能瓶颈单镜生成可能耗时 30s ~ 180s早期是同步 HTTP 阻塞后续已识别为需异步队列改造。4.6 配音剪辑步骤 6用edge-tts把台词转成 MP3按 shot 顺序拼接音频再与视频片段对齐合成。4.7 预览导出步骤 7用FFmpeg把音频、视频片段、转场合成为最终 MP4存放在/app/static/exports通过 Nginx/static路径对外访问。五、部署方案Docker Compose 全栈为了把项目搬到腾讯云服务器2C2G / 40G SSD / Ubuntu 24.04 / Docker 27.5.1我编写了一整套 Docker Compose 部署配置。5.1 生成的部署文件文件说明docker-compose.yml/compose.yaml四服务编排MySQL / Redis / backend / frontendbackend/Dockerfilepython:3.12-slim非 root 用户阿里云 PyPI 镜像front-end/Dockerfilenode:22-alpine 多阶段构建front-end/nginx.confnginx-main.confNginx 反代/api、/staticSPA 回退mysql-init/01-create-databases.sql自动创建ai_studio库.env.example部署变量模板docs/Docker Compose 部署教程.md完整操作教程5.2 资源限制服务器只有 2GB 内存Compose 里对每个服务做了mem_limit和cpus限制并加了 Redis 内存上限。2GB 机器上建议额外创建 2GB Swap否则同时构建前后端会 OOM。5.3 构建顺序同时构建前后端容易把内存吃满教程建议5.4 安全与凭证.env已加入.gitignore用户自管 API Key 用 Fernet 加密落库MySQL 端口只绑127.0.0.1公网只暴露 80/443。六、前端 iOS 风格重构最近一轮把前端从 Material Design 3 全面切换为iOS 原生设计语言但功能与页面结构完全不变。6.1 设计 Token 替换没有改 Tailwind 类的名字否则全站几十处视图要重写而是把 token 的值全部替换成 iOS 系统值主色#007AFFsystemBlue背景#F2F2F7systemGroupedBackground卡片#FFFFFF 圆角 16px / 20px字体-apple-system/SF Pro Text/Display阴影iOS 三级轻阴影毛玻璃backdrop-filter: blur(20px)bg-white/706.2 布局改造侧栏 → 底部 Tab Bar毛玻璃、图标 文字、选中 systemBlue、底部安全区顶栏 → iOS 大标题导航栏34px 大标题 滚动收缩为 17px inline卡片 → 分组列表/圆角卡片更轻量、留白更大。6.3 组件层改造了 5 个基础组件并新增 5 个 iOS 组件已有组件改造新增 iOS 组件BaseButtonGroupedListBaseCardListRowBaseModalIosSwitchBaseEmptyStateIosNavBarBaseSpinnerSegmentedControlPullToRefresh6.4 下拉刷新Pull-to-Refresh针对素材资源库视图接入了 iOS 风格下拉刷新阻尼 0.5、阈值 64px、顶部下拉触发、松手回弹。该组件为通用组件其它列表页直接包裹即可复用。七、遇到的问题与解决方案7.1 前端生成的是水稿内容重复现象小说正文生成把同一段话重复 N 遍。根因前端stores/novel.ts写死走了本地 mock且调用的后端接口不存在404 后回退 mock。解决前端改为真实调用POST /api/novel/create并轮询进度后端补齐枚举对齐与 prompt 约束。7.2 requirements.txt 依赖缺失现象本地能跑但 Docker 容器启动后报ModuleNotFoundError。根因原requirements.txt只列了 9 个包缺python-dotenv、cryptographyFernet 加密、DBUtils连接池、pydantic、edge-tts、pillow。解决补全依赖容器构建与运行全部通过。7.3 vite 8 / rolldown 实验版的 SFC 解析 bug现象本地npm run build报错main.css:114:16等但 CSS 和 SFC 结构完全合法。根因项目原用vite ^8rolldown 实验版解析含style的 Vue SFC 时会错乱地把 script 内容当 CSS 解析。解决把package.json中的 vite 降级到稳定版^5.4.10配套vitejs/plugin-vue ^5、vue-tsc ^2、typescript ^5.6容器内全新安装后构建正常。7.4 容器内权限问题现象后端容器用非 root 用户启动后应用无法创建/app/runtime目录。根因Dockerfile中/app目录仍属 root非 root 用户无写权限。解决Dockerfile 里chown -R app:app /app确保运行时目录、静态目录、缓存目录均可写。7.5 导出 URL 与静态资源路径现象配音/成片文件能生成但前端播放时 URL 404。根因后端用EXPORT_PUBLIC_BASE_URL拼接成片 URL需要与 Nginx 的/static/反代路径一致。解决.env中设EXPORT_PUBLIC_BASE_URLhttp://114.132.239.20Nginx 把/static反代到后端后端静态目录挂持久卷。八、项目现状与下一步8.1 已就绪✅ 小说、角色、分镜、图片、视频、配音、导出 7 步主链路跑通✅ 后端 Docker 化 依赖补全✅ 前端 iOS 设计语言全面替换 下拉刷新组件✅ Docker Compose 全栈部署配置与教程8.2 仍需优化视频生成异步化当前单镜出视频仍是同步 HTTP需改成任务队列 持久化作业表解决超时、并发、断点续跑。续写 / 单章重生成后端暂无对应接口仍走前端 mock。图片出图参数尺寸、数量、风格强度等 UI 已画但后端未真正读取。HTTPS 域名目前用公网 IP后续可配 Nginx SSL 证书。九、总结这个项目让我完整走了一次AI 产品从业务设计到部署上线的链路。最深的体会是AI 项目难的不是调模型而是把模型的不确定性封装成稳定的工程流程。小说生成、视频生成、TTS、FFmpeg 合成每一个环节都可能因为 API 超时、格式不兼容、资源不足而卡住真正要做的是队列、重试、状态机、资源隔离。前端方面不改类名、只换 token 值是我做的最正确的设计决策它让 iOS 重构在几天内覆盖全站而不是逐页重写。这也说明好的设计系统Design System是重构的前提。如果你也在做类似的 AI 内容生成平台欢迎在评论区交流模型选型、队列设计、前端组件化、Docker 部署都可以聊。 技术栈 FastAPI Vue3 Redis MySQL Docker Compose。 开发周期2026 年暑期项目实训。一、项目概述Indigo Nebula AI 是一个面向短视频创作者的AI 漫剧制作平台目标是把灵感→小说→角色→分镜→图片→视频→配音→成片这七步流程全部用一个大模型工作流串起来实现一句话生成短视频。1.1 业务背景传统短视频生产里编剧、分镜、美术、剪辑、配音往往需要多人协作而这个项目试图让个人创作者只输入一段故事灵感或主题系统就能自动生成小说大纲与章节从小说中抽取角色把小说拆成分镜脚本根据分镜生成图片把图片生成视频片段给视频配上 AI 语音最终合成 MP4 成片。1.2 核心体验全流程覆盖7 步工作流在一个平台闭环完成可编辑可干预每一环节的 AI 产出都能人工修改、重生成、上下文联调模型可替换用户可在后台配置自己的大模型 API Key智谱、阿里、OpenAI 兼容等。二、技术选型2.1 后端技术用途说明FastAPIWeb 框架异步接口、自动 OpenAPI 文档MySQL主数据库用户、作品、角色、分镜、历史记录等Redis队列 缓存小说生成队列、任务进度SQLAlchemy裸 SQL 连接池数据访问用 pymysql DBUtils 做连接池python-jose / passlibJWT 密码加密用户鉴权python-multipart文件上传素材上传imageio-ffmpeg视频合成后端自带 ffmpeg 二进制无需系统安装edge-ttsAI 配音微软 Edge 神经语音免费可用2.2 前端技术用途Vue 3 Vite单页应用TypeScript类型安全Pinia状态管理Tailwind CSS 3.4原子化样式Sass全局主题变量Material Symbols图标系统2.3 部署技术用途Docker容器化Docker Compose四服务编排MySQL / Redis / Backend / FrontendNginx前端静态服务 反代/api、/static三、系统架构3.1 后端模块划分app/api路由层按业务模块拆分app/services业务逻辑层app/repositories数据访问层裸 SQLapp/providers外部 AI 服务抽象文本生成、文生图、视频、TTSapp/workers异步任务工作线程小说生成队列、导出守护进程。3.2 前端目录结构src/views页面src/components组件布局 UI 业务src/storesPinia 状态src/features按业务域拆分的状态与逻辑。四、核心功能实现4.1 小说生成步骤 1早期前端写死走了本地 mock生成的章节内容全是水稿同一段话重复 N 次。后来改成真实调用后端POST /api/novel/create后端用 Redis 队列排队worker 线程逐章调用智谱 GLM-4-Flash生成真实小说内容。关键修改点前端stores/novel.ts新增真实生成与轮询进度后端NovelCreateRequest的枚举与前端 6 个风格选项对齐prompt 中约束标题不再带第 X 章前缀避免章节名重复。4.2 角色管理步骤 2用智谱 GLM-4-Flash 从小说正文中抽取角色名、外貌、性格、声线等字段。抽取后人工可编辑保存到角色库。4.3 分镜设计步骤 3把小说章节按场景拆成若干 shot镜头。每个 shot 包含场景描述、台词、运镜、画面描述、时长。支持批量出图、批量出视频。4.4 图片生成步骤 4默认走阿里通义千问 qwen-image-2.0-pro候选智谱 CogView-3。根据 shot 的画面描述生成对应图片并回写到 shot 上。4.5 视频生成步骤 5默认走智谱 CogVideoX-Flash免费通道。把图片 prompt 送进视频模型生成短视频片段。这个环节是性能瓶颈单镜生成可能耗时 30s ~ 180s早期是同步 HTTP 阻塞后续已识别为需异步队列改造。4.6 配音剪辑步骤 6用edge-tts把台词转成 MP3按 shot 顺序拼接音频再与视频片段对齐合成。4.7 预览导出步骤 7用FFmpeg把音频、视频片段、转场合成为最终 MP4存放在/app/static/exports通过 Nginx/static路径对外访问。五、部署方案Docker Compose 全栈为了把项目搬到腾讯云服务器2C2G / 40G SSD / Ubuntu 24.04 / Docker 27.5.1我编写了一整套 Docker Compose 部署配置。5.1 生成的部署文件文件说明docker-compose.yml/compose.yaml四服务编排MySQL / Redis / backend / frontendbackend/Dockerfilepython:3.12-slim非 root 用户阿里云 PyPI 镜像front-end/Dockerfilenode:22-alpine 多阶段构建front-end/nginx.confnginx-main.confNginx 反代/api、/staticSPA 回退mysql-init/01-create-databases.sql自动创建ai_studio库.env.example部署变量模板docs/Docker Compose 部署教程.md完整操作教程5.2 资源限制服务器只有 2GB 内存Compose 里对每个服务做了mem_limit和cpus限制并加了 Redis 内存上限。2GB 机器上建议额外创建 2GB Swap否则同时构建前后端会 OOM。5.3 构建顺序同时构建前后端容易把内存吃满教程建议5.4 安全与凭证.env已加入.gitignore用户自管 API Key 用 Fernet 加密落库MySQL 端口只绑127.0.0.1公网只暴露 80/443。六、前端 iOS 风格重构最近一轮把前端从 Material Design 3 全面切换为iOS 原生设计语言但功能与页面结构完全不变。6.1 设计 Token 替换没有改 Tailwind 类的名字否则全站几十处视图要重写而是把 token 的值全部替换成 iOS 系统值主色#007AFFsystemBlue背景#F2F2F7systemGroupedBackground卡片#FFFFFF 圆角 16px / 20px字体-apple-system/SF Pro Text/Display阴影iOS 三级轻阴影毛玻璃backdrop-filter: blur(20px)bg-white/706.2 布局改造侧栏 → 底部 Tab Bar毛玻璃、图标 文字、选中 systemBlue、底部安全区顶栏 → iOS 大标题导航栏34px 大标题 滚动收缩为 17px inline卡片 → 分组列表/圆角卡片更轻量、留白更大。6.3 组件层改造了 5 个基础组件并新增 5 个 iOS 组件已有组件改造新增 iOS 组件BaseButtonGroupedListBaseCardListRowBaseModalIosSwitchBaseEmptyStateIosNavBarBaseSpinnerSegmentedControlPullToRefresh6.4 下拉刷新Pull-to-Refresh针对素材资源库视图接入了 iOS 风格下拉刷新阻尼 0.5、阈值 64px、顶部下拉触发、松手回弹。该组件为通用组件其它列表页直接包裹即可复用。七、遇到的问题与解决方案7.1 前端生成的是水稿内容重复现象小说正文生成把同一段话重复 N 遍。根因前端stores/novel.ts写死走了本地 mock且调用的后端接口不存在404 后回退 mock。解决前端改为真实调用POST /api/novel/create并轮询进度后端补齐枚举对齐与 prompt 约束。7.2 requirements.txt 依赖缺失现象本地能跑但 Docker 容器启动后报ModuleNotFoundError。根因原requirements.txt只列了 9 个包缺python-dotenv、cryptographyFernet 加密、DBUtils连接池、pydantic、edge-tts、pillow。解决补全依赖容器构建与运行全部通过。7.3 vite 8 / rolldown 实验版的 SFC 解析 bug现象本地npm run build报错main.css:114:16等但 CSS 和 SFC 结构完全合法。根因项目原用vite ^8rolldown 实验版解析含style的 Vue SFC 时会错乱地把 script 内容当 CSS 解析。解决把package.json中的 vite 降级到稳定版^5.4.10配套vitejs/plugin-vue ^5、vue-tsc ^2、typescript ^5.6容器内全新安装后构建正常。7.4 容器内权限问题现象后端容器用非 root 用户启动后应用无法创建/app/runtime目录。根因Dockerfile中/app目录仍属 root非 root 用户无写权限。解决Dockerfile 里chown -R app:app /app确保运行时目录、静态目录、缓存目录均可写。7.5 导出 URL 与静态资源路径现象配音/成片文件能生成但前端播放时 URL 404。根因后端用EXPORT_PUBLIC_BASE_URL拼接成片 URL需要与 Nginx 的/static/反代路径一致。解决.env中设EXPORT_PUBLIC_BASE_URLhttp://114.132.239.20Nginx 把/static反代到后端后端静态目录挂持久卷。八、项目现状与下一步8.1 已就绪✅ 小说、角色、分镜、图片、视频、配音、导出 7 步主链路跑通✅ 后端 Docker 化 依赖补全✅ 前端 iOS 设计语言全面替换 下拉刷新组件✅ Docker Compose 全栈部署配置与教程8.2 仍需优化视频生成异步化当前单镜出视频仍是同步 HTTP需改成任务队列 持久化作业表解决超时、并发、断点续跑。续写 / 单章重生成后端暂无对应接口仍走前端 mock。图片出图参数尺寸、数量、风格强度等 UI 已画但后端未真正读取。HTTPS 域名目前用公网 IP后续可配 Nginx SSL 证书。九、总结这个项目让我完整走了一次AI 产品从业务设计到部署上线的链路。最深的体会是AI 项目难的不是调模型而是把模型的不确定性封装成稳定的工程流程。小说生成、视频生成、TTS、FFmpeg 合成每一个环节都可能因为 API 超时、格式不兼容、资源不足而卡住真正要做的是队列、重试、状态机、资源隔离。前端方面不改类名、只换 token 值是我做的最正确的设计决策它让 iOS 重构在几天内覆盖全站而不是逐页重写。这也说明好的设计系统Design System是重构的前提。如果你也在做类似的 AI 内容生成平台欢迎在评论区交流模型选型、队列设计、前端组件化、Docker 部署都可以聊。 
