跳到正文
网页珍奇柜Web Curio

我的三维房间

My Room in 3D,Bruno Simon,2021 年

正在布展…

本柜的现场复刻:按原作的技术思路从零编写,不含原作的代码和素材。为什么不直接展出原作:原作仓库没有 LICENSE(package.json 标注 UNLICENSED),模型与烘焙贴图均不可收录;这里用 three.js 程序化搭了一间等距小书房,并在挂载时于浏览器内逐顶点“烘焙”环境光遮蔽、窗外日光、台灯(软阴影)和显示器溢光四层光照,着色器按开关混合——点台灯、显示器或窗户即可开关灯、切换昼夜,鼠标带来轻微视差。原作请点上方「去看原作」。

它是怎么做的

  1. 第 1 步Blender 中把漫反射光照烘焙成白天、夜晚、台灯等多张光照贴图
  2. 第 2 步自定义着色器按 uniform 权重混合多张烘焙贴图,实现“动态”换灯
  3. 第 3 步屏幕使用 VideoTexture,电脑/显示器内容在播放
  4. 第 4 步OrbitControls 受限角度 + 缓动,保持构图

复刻配方

一段技术配方,可以直接交给 AI 编程助手,也可以自己照着写。想指定技术栈、位置和性能预算,就把它加入实现方案。

Model a small diorama room in Blender and bake three separate lightmaps: neutral daylight, night, and a single lamp contribution. Load all three as textures on one ShaderMaterial and mix them in the fragment shader with uniforms such as nightMix and lampStrength, multiplying the lamp layer by a tint color. Use a VideoTexture on the monitor mesh for life, and restrict OrbitControls to a narrow azimuth range with damping so the composition always reads well.

档案

能不能拿来用

原作不是开源许可(unknown (no LICENSE file; package.json says UNLICENSED)):只能作为视觉参考,不要复制它的代码或素材,自己按技术思路实现。

性能开销

视觉强度

实现难度

尺度为策展判断(1 到 5),用于比较和推荐。

核实记录:Demo loads (200); repo exists, no LICENSE file (package.json: UNLICENSED) — treat as inspiration only.