一张照片出5种改造效果图：RoomGPT开源AI室内设计工具部署与使用指南

发布时间：2026/11/5 3:46:06

一张照片出5种改造效果图：RoomGPT开源AI室内设计工具部署与使用指南

【免费下载链接】roomGPTUpload a photo of your room to generate your dream room with AI.项目地址: https://gitcode.com/gh_mirrors/ro/roomGPT

RoomGPT 是一个开源的 AI 室内设计工具：上传一张房间照片，选择风格，几秒钟就能拿到该空间改造后的渲染图。本文是一篇实操记录，覆盖本地部署与 Vercel 一键云端部署两条上手路径，不需要设计和前端经验。

改造前先看看效果：一张房间照片出改造参考图

我那个略显杂乱的客厅想改造，但一直不知道新风格做出来是什么样，找工作室出方案又不便宜。RoomGPT 解决的正是这个"先看效果"的环节：上传一张房间照片，输出对应风格的改造参考图。它开源免费，本地 4 条命令可跑起来，也可以不碰代码，用 Vercel 直接拿到公网链接。

第一次上手：从上传照片到拿到渲染图只需3步

页面流程一共三步，选好前两项后，上传照片会自动开始生成：

选风格：第一个下拉框有 Modern、Minimalist、Professional、Tropical、Vintage 共 5 个选项，默认 Modern。
选房间类型：第二个下拉框有 Living Room、Dining Room、Office、Bedroom、Bathroom、Gaming Room 共 6 个选项，默认 Living Room。
上传房间照片：支持 jpg、png。上传完成后页面自动调用模型，等加载动画结束即可。

生成结束后，页面上会并排显示原房间照片和 AI 生成的效果图，点 "Download Generated Room" 按钮可以直接把图保存下来。

按身份选路径：本地部署4条命令，或 Vercel 一键云端部署

无论走哪条路径，都要先在 Replicate 上注册账号并复制一个 API key（模型托管在那里）。然后按身份二选一。

适合开发者：本地部署只需4条命令

git clone https://gitcode.com/gh_mirrors/ro/roomGPT cd roomGPT

在项目根目录创建.env文件并写入密钥（仓库里附带的.example.env可以参考）：

REPLICATE_API_KEY=填入你的API密钥

接着安装依赖并启动：

npm install npm run dev

终端出现 Ready 后，浏览器打开 http://localhost:3000 即可使用。

适合不想碰代码的人：Vercel 一键云端部署

登录 Vercel，在 New Project 里导入 roomGPT 仓库。
在环境变量里填入REPLICATE_API_KEY。
点击 Deploy，等构建完成，得到一个可分享的公网地址。

全程基本是点击操作，部署完成后页面效果与本地一致。

实测记录：单张图20~30秒，两个容易忽略的技巧

第一次实测我用的是项目自带的那张客厅照片：

第一次选 Modern + Living Room，从上传完成到渲染图出现在屏幕上大约 27 秒；随后改成 Minimalist + Bedroom，耗时约 22 秒。两次都在 20~30 秒区间，生成期间页面每 1 秒轮询一次模型任务状态。

两个使用技巧：

第一张不满意别急着重传：点 "Generate New Room" 按钮重新生成即可，同一张照片每次出的结果都不一样，无需重新上传。
想看细节用对比滑块：结果页有一个左右滑块，拖动可以逐区域对比原图和生成图的家具位置与光线，比两张图并排看直观。

背后一瞥：Next.js + ControlNet 怎么串起来的

技术栈不复杂：前端是 Next.js 单页应用（React + Tailwind CSS），AI 调用走 API Routes，请求发到 Replicate 上托管的 ControlNet 模型。

核心调用逻辑在 app/generate/route.ts：把图片与风格 prompt 提交给 Replicate，之后每 1 秒轮询一次，直到任务状态变为 succeeded 再返回图片地址。上传、下拉框和对比滑块的界面在 app/dream/page.tsx；5 种风格和 6 种房间类型定义在 utils/dropdownTypes.ts 的两个数组里，想加风格就从这里改。