看图
一张效果图能打动人，却说不清它和整套户型、动线与收纳的关系。
AI INTERIOR DESIGN · PRODUCT CASE
栖居 Qiju
在装修之前，
先住进未来的家。
一个 AI 装修设计产品：从一张户型图出发，经过需求简报与方案生成，最终交付一个可以亲手探索的 3D 方案。
- 角色
- 产品设计 / 交互 / 3D 与渲染 / 前端
- 形态
- Web 产品原型 + 3D 交付查看器
- 样例
- 120㎡ 两卧电竞之家（示例项目数据）
- 技术
- Blender · Cycles · glTF · Three.js · Vite
01 · WHY装修沟通的难点，
装修沟通的难点，
不在画面，而在空间。
改图
换个风格就要重新沟通、重新出图，比较几种方向的成本很高。
想象
业主需要自己在脑中拼出完整的家，决定往往建立在猜测之上。
栖居的回答：同一套模型贯穿识别、生成、出图与 3D 交付，任何一步的选择都能在完整的家里被看见。
02
PRODUCT FLOW
四步，从户型到理想生活。
01
户型导入
上传户型图，或从示例户型开始。系统识别 13 个空间的边界与面积，叠加在原始建筑图上逐个标注，给出外轮廓与套内面积。
- 13 个空间自动分区
- 面积表与原图对齐
- 外轮廓 10.80 × 9.40 m
02
需求简报
用材质板而不是形容词表达风格；再用生活需求标签补充“怎么住”——独立电竞房、四人用餐、充足收纳、柔和夜间照明。
- 三种风格材质板
- 生活需求标签
- 一句话补充说明
03
生成方案
生成过程被拆成户型解析、空间分区、家具布置、材质与灯光、渲染出图五个阶段，每个阶段都展示真实的中间结果和对应日志。
- 五阶段可视化
- 同机位中间产物
- 可随时跳过
04
方案预览
按所选风格查看全屋总览与各空间效果图，一键进入完整方案页或 3D 漫游；需求不满意时，回到上一步调整即可。
- 按风格出图
- 逐空间切换
- 直达方案与 3D
03
GENERATION
“生成过程”里的每一帧，
都是真实的中间结果。
同一机位依次输出白模、体块布局、材质与最终光照。产品里的生成动画直接使用这些帧，而不是装饰性的加载效果。
04
THREE STYLES
同一个家，三种生活表情。
风格不是滤镜：木作、织物、石材与五金分别替换，家电与卫浴金属保持原色。拖动滑块比较任意两种风格。
05
DELIVERABLE
交付的不是一张图，
而是一个可以走进去的家。
方案页汇总 16 个空间的效果图、面积表、材质与软装清单和设计说明；3D 方案在浏览器中直接打开，可切换风格、聚焦房间、进入室内视角和夜间氛围。
交付成果 · 3D 方案预览全屏打开 ↗
模型约 4.3 MB · 三种风格 · 13 个空间 · 日夜切换
06 · PIPELINE一份场景数据，
一份场景数据，
驱动出图与 3D。
13空间统一建模
3风格方案
28张写实效果图
4.3MB交付模型体积
- 01Blender 场景
13 个空间统一建模，16 个固定机位，PBR 材质分组
- 02Cycles 渲染
OptiX GPU · 160 samples · AgX；三种风格由同一份 styles.json 驱动
- 03glTF 交付
1,151 个网格按房间与材质合并为 154 个；Meshopt + WebP，28 MB → 4.3 MB
- 04Web 查看器
Three.js 运行时套用风格材质；房间聚焦、室内机位、日夜氛围
先看见它，先走进它，
再决定它。
← 返回项目归档交互原型 · 示例项目数据 · 材质 Poly Haven CC0