VNVE（全称 Visual Novel Video Editor，视觉小说视频编辑器）是一款开源、基于Web的视觉小说视频制作工具。它的定位并非传统的互动游戏引擎，而是一个专门为视觉小说（Visual Novel / Galgame）内容设计的视频化工具，旨在帮助创作者将文字脚本快速、低成本地转化为视频。
基本信息
| 项目 | 内容 |
|---|---|
| 名称 | VNVE（Visual Novel Video Editor） |
| 开发者 | vnve 团队 |
| 类型 | 视觉小说视频编辑器 / 视频生成工具 |
| 编程语言 | TypeScript |
| 渲染引擎 | PixiJS + WebCodecs |
| 运行平台 | Web 浏览器（桌面/移动端均可访问） |
| 许可协议 | 开源 |
| 官方网站 | https://vnve.net |
| GitHub 仓库 | https://github.com/vnve/vnve |
| 项目状态 | 活跃维护中（2.0版本已发布） |
概述
VNVE 的核心理念是 “文字优先” （Text First）——让创作者回归视觉小说创作的本质，即文本内容本身。它并非一个用于制作可交互游戏的引擎，而是一个将视觉小说文本快速转化为视频的编辑器。
“无需剪辑，只需要在浏览器上编写你的故事，配上素材，就可以一键快速制作出视频”——这是 VNVE 最简洁的定位描述。它降低了视频制作的技术门槛，让没有视频剪辑经验的创作者也能产出视觉小说风格的视频内容。
核心特点
-
浏览器即用，无需安装：打开浏览器访问 vnve.net 即可开始创作，无需下载安装任何软件。
-
AI 辅助生成：集成 DeepSeek、OpenAI 等 API，支持一键生成视觉小说视频。
-
文本驱动，操作简单：只需编写故事文本、配置素材，即可快速生成视频，告别复杂的视频剪辑软件。
-
纯前端实现：基于 TypeScript 开发，使用 PixiJS 进行 2D 渲染，WebCodecs 进行视频编码，完全在浏览器端运行。
-
npm 包支持程序化创建：除在线编辑器外，还提供
@vnve/core和@vnve/template两个 npm 包，开发者可通过代码编程方式生成视频。 -
模板系统：内置标题场景（
TitleScene）、对话场景（DialogueScene）等预设模板，提高创作效率。
技术架构
VNVE 的核心技术栈包括：
| 组件 | 说明 |
|---|---|
| PixiJS | 高性能 2D 渲染引擎，负责画面渲染 |
| WebCodecs | 浏览器原生视频编码 API，负责将渲染内容编码为 MP4 |
| TypeScript | 纯前端 TypeScript 实现 |
| npm 包 | @vnve/core（核心功能）、@vnve/template（预设模板） |
通过 WebCodecs，VNVE 能够在浏览器端直接生成 MP4 视频文件，无需服务器端处理。
使用方法
在线编辑器（推荐）
-
在浏览器中编写故事脚本
-
配置角色立绘、背景、音乐等素材
-
一键生成视觉小说视频
程序化创建（npm 包）
对于有编程需求的开发者，可通过 npm 包以代码方式生成视频：
import { Creator, Scene, Img, Text, Sound, PREST_ANIMATION } from "@vnve/core"; const creator = new Creator(); // 创建一个场景 const scene = new Scene({ duration: 3000 }); // 添加元素 const img = new Img({ source: "图片地址" }); const text = new Text("VNVE", { fill: "#ffffff", fontSize: 200 }); const sound = new Sound({ source: "音频地址" }); scene.addChild(img); scene.addChild(text); scene.addSound(sound); // 添加动画 text.addAnimation(PREST_ANIMATION.FadeIn); // 生成视频 creator.add(scene); creator.start().then(videoBlob => { // 得到 MP4 文件 URL.createObjectURL(videoBlob); });
模板使用
使用预设模板可进一步简化创作：
import { Creator } from "@vnve/core"; import { TitleScene, DialogueScene } from "@vnve/template"; const creator = new Creator(); // 标题场景 const titleScene = new TitleScene({ title: "VNVE", subtitle: "Make video programmatically", backgroundImgSource: "背景图地址", duration: 3000, }); // 对话场景 const dialogueScene = new DialogueScene({ lines: [ { name: "角色A", content: "角色A的台词..." }, { name: "角色B", content: "角色B的台词..." }, ], backgroundImgSource: "背景图地址", }); creator.add(titleScene); creator.add(dialogueScene);
主要应用场景
| 场景 | 说明 |
|---|---|
| 视觉小说视频化 | 将文字内容快速转化为视觉小说风格的视频 |
| B站互动视频 | 配合 Bilibili 的互动视频功能，实现类似 Galgame 的游玩体验 |
| 小说宣传片/预告 | 为小说制作视频预告或宣传素材 |
| 短视频剧集 | 制作短篇视觉小说风格的视频内容 |
| 同人/二创视频 | 快速制作同人作品的视频版本 |
与视觉小说引擎的区别
VNVE 与传统的视觉小说引擎（如 Ren’Py、KiriKiri）有本质区别：
| 对比维度 | VNVE | 传统视觉小说引擎 |
|---|---|---|
| 输出形式 | 视频（MP4 文件） | 可交互的游戏程序 |
| 交互性 | 无交互（或依赖平台互动视频功能） | 完整的选项分支、变量系统 |
| 开发门槛 | 极低，浏览器即可操作 | 需学习脚本语言或使用编辑器 |
| 定位 | 视频创作工具 | 游戏开发引擎 |
正如项目文档所述：“定位只是一个为视觉小说量身定制的视频创作工具，如果你想创建分支逻辑、数值和其他更像游戏的行为，可以去使用 Bilibili 互动视频”。
外部链接
-
在线编辑器（桌面端和移动端均可访问）
评论0