ClipSketch AI：你的 AI 视频内容创作工作台，一键生成手绘故事板与社交文案！

ClipSketch AI（剪辑·素描） 是一款面向视频创作者、社交媒体运营者和二创爱好者的 AI 内容创作工作台。它能解析 Bilibili 和小红书的分享链接，将视频中的精彩画面精确定位，再通过 Google Gemini 多模态模型，自动生成手绘风格的故事板和适配社交平台的多种文案格式。

对比传统“截图 + 修图 + 手写文案”的人工流程，ClipSketch AI 将采集、标记、绘图、文案和导出整合在一个界面里，极大地提升了效率。它更适合做系列内容、教程类视频、剧情向短片和种草内容。

适合谁使用 ClipSketch AI

• 短视频创作者：想做故事化内容的短视频创作者。

• 社交媒体运营者：需要高频输出图文、视频内容的运营者。

• 二创博主：喜欢对 B 站、小红书视频进行二创剪辑的博主。

• 导演与策划：需要用分镜脚本与视觉草图和团队沟通的策划人员。

前提：只需有 Gemini API Key 和基础的 Node.js 环境，就可以在本地跑起来，作为日常创作的“分镜与文案工作台”。

核心功能亮点

视频采集与播放体验

• 多源解析：支持解析 Bilibili 和小红书的分享链接，即使是短链接和带有文字说明的混合文案也能识别。

• 精准控制：支持键盘快捷键（空格播放/暂停，方向键调整进度）实现毫秒级标记，并支持 T 键快捷打点，操作节奏贴合剪辑习惯。

• 导出方式：支持导出 TXT 时间轴标签，或将标记帧打包为 ZIP 图片包，方便后期剪辑或归档。

AI 手绘故事板与文案工作室（Powered by Gemini）

• 智能故事板生成：基于 gemini-3-pro-image-preview 模型，将多个标记帧整合成一张连贯的手绘风格故事板，画风偏可爱与叙事感。

• 多风格种草文案：利用 gemini-3-pro-preview 模型，围绕视觉内容自动生成三种不同风格的社交文案（如情感故事型、干货教程型、短句精简型）。

• IP 角色融合：支持上传自定义角色或头像，AI 会将角色融合到故事板画面中，非常适合打造个人 IP 或品牌形象。

• 批量精修：支持分镜批量重绘与优化，可配置使用 Batch API 控制成本，对系列内容或长项目友好。

导出与分享

• 素材下载：下载生成的故事板图片和封面素材，以及打包导出所有标记帧、故事板和封面。

• 一键复制：一键复制生成的文案，用于小红书、微博、X（Twitter）等平台发布。

使用流程概览

1. 环境准备：安装 Node.js (v18+) 和有效的 Google Gemini API Key。

2. 安装与启动：克隆项目仓库，安装依赖 (npm install)，配置环境变量 (.env.local 文件设置 GEMINI_API_KEY)，运行开发服务器 (npm run dev)。

3. 导入视频链接：复制 B 站或小红书的分享链接，粘贴导入。

4. 标记精彩画面：在播放器中，使用快捷键 T 键标记关键帧。

5. 开启 AI 工作室：标记结束后，点击“下一步：AI 绘图”，进行 AI 绘图。

6. 生成故事板与文案：AI 分析视频步骤与画面内容，生成手绘故事板、高清重绘图和多种风格的社交媒体文案及封面方案。

7. 导出结果并发布：下载素材包，一键复制文案到目标平台完成发布。

技术栈与实现细节

• 核心框架：React 19 + TypeScript，样式采用 Tailwind CSS。

• AI SDK：使用 Google GenAI SDK (@google/genai)。

• 本地存储：数据存储于 IndexedDB，用于本地状态持久化和标记记录保存。

• 适配性：前端采用响应式设计，适配 PC 宽屏、iPad 平板与手机竖屏。

使用注意事项

• API 权限：使用 AI 绘图功能时，API Key 需要具备访问 gemini-3-pro-image-preview 等模型的权限。

• 隐私与版权：在使用平台视频进行创作时，请务必遵守内容平台的版权与使用规则，合理使用公开内容。

• 开源项目：项目源码托管于 GitHub 仓库 RanFeng/clipsketch-ai，欢迎二次开发、定制化集成与团队协作。

附件内容