艺术的箱庭小镇 THreeJS 开源

「28-艺术的箱庭小镇 THreeJS」

/~c56c3aJTRg~:/

链接：https://pan.quark.cn/s/880f0bb75172

🏰 3D 箱庭小镇 (3D Miniature Town)

一个精致、生动且充满探索乐趣的 3D 箱庭沙盘项目。项目采用低多边形（Low Poly）艺术风格，注重地形的起伏层次与建筑的疏密节奏，旨在打破传统"小方块堆砌"的呆板感，为用户提供一个兼具视觉美感与交互体验的虚拟小镇世界。

✨ 核心亮点

1. 丰富的地形与错落有致的城市规划

• 告别平面化：通过精心设计的地形高度图，实现了从海滨沙滩、缓坡丘陵到平坦广场的自然过渡，创造出高低错落的视觉层次。

• 分区明确：小镇被巧妙地划分为海港商业区、山地观景区、中央游乐场和休闲居民区，蜿蜒的道路与桥梁自然地连接各个地块，形成有机的整体。

• 建筑多样性：融合了现代简约住宅、复古欧式洋房、特色红砖厂房以及标志性的灯塔，避免了千篇一律的重复感。

2. 沉浸式的昼夜变化系统

• 动态时间流转：右侧控制面板支持从"黎明"到"深夜"的多时段一键切换，模拟真实世界的光线色彩变化。

• 智能环境光：随着时间推移，天空盒背景与全局环境光（Ambient Light）会自动调整色温，清晨透着冷色调的微光，正午明亮通透，夜晚则笼罩在静谧的蓝紫色调中。

• 自动昼夜循环：开启后，太阳会模拟真实轨迹在天空中移动，配合阴影长度的实时计算，带来极强的沉浸感。

3. 生动的动态元素与微交互

• 活跃的小镇居民：道路上点缀着行走的行人，游乐园里有人在排队等候，港口停泊着随风轻微摇晃的帆船，赋予了静态模型生命力。

• 环境动态体：摩天轮与旋转木马带有独立的旋转动画；树木和草丛集成了基于物理的风力摆动效果；云层也会随时间缓慢飘动。

• 交互式探索：点击特定建筑（如灯塔、风车）可触发独特的视角运镜或弹窗介绍，增强用户的参与感。

🛠️ 技术实现细节

本项目基于 Unity Engine​ 构建，利用现代渲染管线实现了高品质的视觉输出：

• 地形系统 (Terrain System)：使用 Unity Terrain 工具雕刻自然地貌，并通过多层纹理混合（Texture Splatting）实现沙滩、草地、岩石的无缝衔接。

• 光影系统 (Lighting)：采用混合光照模式，主光源（Directional Light）产生硬阴影以确立空间结构，辅以大量的烘焙光照探针（Light Probes）和反射探针（Reflection Probes），确保动态物体（如行人、车辆）也能获得真实的环境反光。

• 后处理堆栈 (Post-Processing)：应用了 Bloom（泛光）提升光源质感，Vignette（暗角）聚焦视觉中心，以及 Color Grading（色彩分级）统一整体画面的冷暖对比。

• UI/UX 设计：右侧的半透明玻璃拟态（Glassmorphism）控制面板集成了时间轴、区域筛选、画质调节和截图功能，交互直观且不遮挡核心景观。

🎮 操作指南

操作方式	功能说明
鼠标拖拽​	自由旋转视角，全方位观赏小镇全貌
鼠标滚轮​	缩放视角，拉近观察建筑细节或拉远查看整体布局
右键拖拽​	平移视角，快速切换观赏区域
右侧面板​	调节时间流速、切换昼夜模式、筛选特定区域（如仅显示海港或游乐场）

📦 项目结构建议

Assets/
├── Art/
│   ├── Models/          # 存放低多边形风格的FBX模型（建筑、树木、道具）
│   ├── Materials/       # 自定义材质球（包含手绘纹理和Shader）
│   └── Textures/        # 贴图资源（Albedo, Normal, Metallic等）
├── Scenes/
│   └── Main.unity       # 主场景文件
├── Scripts/
│   ├── GameManager.cs   # 游戏主逻辑控制（昼夜循环、全局状态）
│   ├── CameraController.cs # 相机视角控制脚本
│   └── UIController.cs  # 右侧控制面板的交互逻辑
├── Settings/
│   └── PostProcessingProfile.asset # 后处理配置文件
└── StreamingAssets/     # 存放外部配置文件或大型资源

🚀 如何运行

1. 确保已安装 Unity 2022.3 LTS​ 或更高版本。

2. 克隆本仓库至本地：git clone https://github.com/your-repo/miniature-town.git

3. 双击打开 Scenes/Main.unity场景文件。

4. 点击顶部工具栏的 Play​ 按钮，即可进入箱庭小镇的奇妙世界！