# Rainy Night Convenience Store

**Repository Path**: boheweb/RainyNightConvenienceStore

## Basic Information

- **Project Name**: Rainy Night Convenience Store
- **Description**: 一个纯前端的日式雨夜便利店街角微缩景观。打开 `index.html` 即可观看，无需安装、无需后端、无需启动本地服务器。

- **Primary Language**: Unknown
- **License**: MIT
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-09-29
- **Last Updated**: 2026-11-03

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 雨夜便利店 · 街角微缩模型

一个纯前端的日式雨夜便利店街角微缩景观。打开 `index.html` 即可观看，无需安装、无需后端、无需启动本地服务器。

## 体验方式

- **拖拽**：旋转观察整个微缩模型
- **滚轮 / 双指捏合**：缩放
- **双击**：回到默认观景角度
- 页面没有任何界面元素，所有内容都在三维场景内

## 场景特性

- 完整的正方形收藏底座、分层基座与黄铜铭牌
- 日式便利店外观：发光招牌、竖式霓虹灯箱、玻璃橱窗、自动门、屋檐雨棚、门垫、海报栏
- 店内细节：饮料冷柜、零食与杯面货架、杂志架、收银台、咖啡机、关东煮、便当、饭团、热食柜、后场门、吊牌与地贴
- 街角配套：自动贩卖机、自行车、雨伞架、分类垃圾桶、路灯、电线杆与电线、路牌、护栏、停车位、排水沟、斑马线、小巷入口、空调外机、报刊栏、停靠的轻型车
- 三渲二材质、深色描边、暖色室内与冷色雨夜对比
- 持续降雨、屋檐滴水、玻璃雨水滑落、积水涟漪、湿地反光、招牌闪烁、自动门周期开合、红绿灯变化
- 开场时底座与散件由下向上逐层组装成完整场景，并带有一场轻微的黑场淡入
- 一只在自动贩卖机上躲雨的小黑猫
- 可选细节：湿路面霓虹反光、远景城市灯光、雨雾、猫咪尾巴与呼吸动画

## 文件说明

- `index.html` — 页面入口（全屏画布 + 视觉暗角，无 UI）
- `scene.js` — 已打包的浏览器运行文件（Three.js 已内联打包，直接用浏览器打开即可）
- `main.js` — 可读的 Three.js 源码
- `preview.png` — 默认视角预览图
- `preview-detail.png` — 近景细节预览图

## 重新构建（可选）

```bash
npm install
npm run build
```

`scene.js` 会重新生成；构建使用 esbuild，源码依赖 Three.js r164。

## 技术栈

Three.js、WebGL、Canvas 程序化贴图、自定义 toon ramp、UnrealBloom 后处理、调色 ShaderPass、全局裁剪面装配动画、静态网格合并优化。