VibeApps

中文 | English

想象一下，一个驻留在浏览器中的桌面系统——以及一个懂得如何操作其中所有应用的 AI。

官方网站 · X / Twitter

https://github.com/user-attachments/assets/adb176a3-02db-41e0-ba71-c9f9cece13d5

什么是 VibeApps？

VibeApps 将完整的桌面体验带入你的浏览器中——你可以拖动、缩放窗口，可以并排打开多个应用，一切都包裹在简洁的 macOS 风格界面中。但它与众不同之处在于内置的 AI Agent。

无需在菜单中点击寻找，只需告诉它你想要什么：

“播放一些爵士乐” —— 音乐应用随即开始播放。

“写一篇关于今天徒步旅行的日记” —— 日记应用打开，并创建了一篇新记录。

“我们下盘棋吧” —— 棋盘已经准备就绪。

该 Agent 不仅仅是启动应用，它还能操作应用。通过每个应用都支持的结构化 Action 系统，它可以读取数据、触发动作并更新状态。

一切都在你的浏览器中本地运行。无需后端，无需账号，没有繁琐的设置。你的数据保留在 IndexedDB 中，存放在它该在的地方。

内置应用

开箱即用，你将获得一系列可供探索的应用：

应用	描述
🎵 音乐	功能齐全的播放器，支持播放列表、播放控制和专辑封面
♟️ 国际象棋	具备完整规则校验的经典象棋游戏
⚫ 五子棋	五子连珠——规则简单，策略深远
🃏 空当接龙	一款全凭技巧、无关运气的纸牌游戏
📧 电子邮件	收件箱、已发送、草稿——熟悉的邮件体验
📔 日记	带有心情记录功能的日记本，捕捉你的生活点滴
🐦 Twitter	一个真正由你掌控的社交信息流
📷 相册	浏览并整理你的照片集
📰 CyberNews	聚合精选新闻，让你随时了解最新资讯

每个应用都与 AI Agent 深度集成，这意味着你可以通过自然语言与它们中的任何一个进行交互。

入门指南

前置要求

工具	版本	检查命令	安装
Node.js	18+	`node -v`	nodejs.org
pnpm	9+	`pnpm -v`	`npm install -g pnpm@9`

在中国境内？ 取消 .npmrc 中镜像源行的注释，以便通过 npmmirror 加速下载。

60 秒内运行起来

# 克隆并进入项目
git clone https://github.com/MiniMax-AI/OpenRoom.git
cd OpenRoom

# 安装依赖
pnpm install

# (可选) 设置环境变量
cp apps/webuiapps/.env.example apps/webuiapps/.env

# 启动
pnpm dev

打开 http://localhost:3000 — 你将看到一个带有应用图标的桌面。双击即可打开任何应用。

认识 AI Agent (应用内聊天)

点击右下角的 聊天图标。一个面板会滑出——这就是你的 Agent。

用自然语言输入：“播放下一首歌”、“显示我的邮件”、“开始一局新棋”。Agent 会判断该与哪个应用沟通、采取什么行动，并自动完成这一切。

注意： 你需要一个 LLM API Key。请在聊天面板的设置中进行配置。

这个聊天面板用于操作现有的应用。如需创建新应用，请参考下方的 Vibe 工作流部分——该功能在 Claude Code CLI 中运行。

构建你自己的应用——只需描述它们

这才是最有趣的地方。通过 Vibe 工作流，你只需描述你想要的功能，即可生成一个完整且深度集成的应用。没有样板代码，无需繁琐的脚手架搭建——Claude Code 将处理整个过程。

重要提示： Vibe 工作流运行在 Claude Code (CLI 终端) 中，而不是浏览器内的聊天面板。应用内聊天面板用于操作现有应用；创建新应用是在开发环境中完成的。

从零创建

/vibe WeatherApp Create a weather dashboard with 5-day forecasts and temperature charts

在后台，工作流会经历 6 个阶段 —— 每个阶段都建立在前一个阶段的基础之上：

需求分析   →  我们到底在构建什么？
架构设计   →  组件、数据模型、状态结构
任务规划   →  将其拆解为可执行的块
代码生成   →  编写实际的 React + TypeScript 代码
资源生成   →  创建图标和图像
项目集成   →  注册应用，使其显示在桌面上

完成后，你的新应用即可投入使用——并且自带 AI Agent 集成。

迭代现有应用

已经有一个应用但想要更多功能？描述你的需求：

/vibe MusicApp Add a lyrics panel that shows synced lyrics during playback

这将触发一个专注的 4 阶段变更工作流：影响分析 → 规划 → 实现 → 验证。

恢复或重做

# 从上次中断的地方继续
/vibe MyApp

# 跳转到特定阶段
/vibe MyApp --from=04-codegen

MiniMax-AI/OpenRoom