feat(world-sketcher): 增加高度标注和连通关系,AI分析改为读JSON
- sketch.html: 双击命名弹窗增加高度(m)输入和连通多选 - sketch.html: 新增defaultHeightForType()按画笔类型设默认高度 - sketch.html: 连通关系双向同步,JSON输出增加height_m/connections - sketch.html: restoreScene恢复新字段,保存/加载流程不受影响 - SKILL.md: 步骤3从vision分析PNG改为读取JSON结构化数据 - SKILL.md: 布局解读文档模板增加高度和连通列 - README.md: 画笔图例增加默认高度,更新JSON示例和AI流程说明 Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -8,9 +8,12 @@
|
||||
1. 双击 `sketch.html` 在浏览器中打开(推荐 Chrome / Edge)
|
||||
2. 左侧设置场景名称和世界尺寸(米)
|
||||
3. 选择画笔,在画布上绘制
|
||||
4. **双击** 已绘制区域 → 为该区域命名
|
||||
5. 勾选「可进入」→ 创建下级详图(L1 → L2)
|
||||
6. 保存 PNG + JSON
|
||||
4. **双击** 已绘制区域 → 弹出命名对话框:
|
||||
- 输入名称(如"家"、"小卖部")
|
||||
- 设置**高度**(建筑/区域/不可通行类型时显示,默认 3m)
|
||||
- 勾选**连通到**其他已命名区域(建立区域间连接关系)
|
||||
- 勾选「可进入」→ 创建下级详图(L1 → L2)
|
||||
5. 保存 ZIP(含 PNG + JSON)
|
||||
|
||||
---
|
||||
|
||||
@@ -32,15 +35,15 @@
|
||||
|
||||
## 画笔图例
|
||||
|
||||
| 画笔 | 颜色 | 用途 | 对应 UE 材质 |
|
||||
|------|------|------|-------------|
|
||||
| 道路 Road | 灰 `#909090` | 道路、马路、小路 | MI_DevGray |
|
||||
| 建筑 Building | 橙 `#E07020` | 建筑物 | MI_DevOrange |
|
||||
| 水域 Water | 天蓝 `#40A0D0` | 河流、水塘、水体 | MI_DevSkyBlue |
|
||||
| 植被 Greenery | 绿 `#40B040` | 树木、草地、绿化带 | MI_DevGreen |
|
||||
| 不可通行 Blocked | 棕 `#A07040` | 山体、围墙、不可达区域 | MI_DevBrown |
|
||||
| 区域 Zone | 红 `#D04040` | 区域边界、地块划分 | MI_DevRed |
|
||||
| 橡皮擦 Eraser | — | 擦除 | — |
|
||||
| 画笔 | 颜色 | 用途 | 对应 UE 材质 | 默认高度 |
|
||||
|------|------|------|-------------|---------|
|
||||
| 道路 Road | 灰 `#909090` | 道路、马路、小路 | MI_DevGray | — |
|
||||
| 建筑 Building | 橙 `#E07020` | 建筑物 | MI_DevOrange | 3m |
|
||||
| 水域 Water | 天蓝 `#40A0D0` | 河流、水塘、水体 | MI_DevSkyBlue | — |
|
||||
| 植被 Greenery | 绿 `#40B040` | 树木、草地、绿化带 | MI_DevGreen | 2m |
|
||||
| 不可通行 Blocked | 棕 `#A07040` | 山体、围墙、不可达区域 | MI_DevBrown | 3m |
|
||||
| 区域 Zone | 红 `#D04040` | 区域边界、地块划分 | MI_DevRed | 3m |
|
||||
| 橡皮擦 Eraser | — | 擦除 | — | — |
|
||||
|
||||
**L1 层**主要用:区域、道路、水域
|
||||
**L2 层**主要用:建筑、道路、植被、水域、不可通行
|
||||
@@ -89,7 +92,7 @@
|
||||
```json
|
||||
{
|
||||
"scene_name": "城郊小街",
|
||||
"version": "v01",
|
||||
"version": "v02",
|
||||
"origin": "SW corner, X+ East, Y+ North",
|
||||
"brush_legend": { "色值": { "type": "类型", "mi_material": "MI_Dev*" } },
|
||||
"levels": {
|
||||
@@ -98,16 +101,25 @@
|
||||
"canvas_size_px": [1000, 800],
|
||||
"scale_m_per_px": 0.5,
|
||||
"elements": [
|
||||
{ "id": "el_xxx", "type": "zone", "name": "城郊小街", "has_detail": true, "detail_ref": "L2-el_xxx" }
|
||||
{ "id": "el_001", "type": "zone", "name": "家", "height_m": 3,
|
||||
"connections": ["el_003"], "has_detail": false },
|
||||
{ "id": "el_002", "type": "zone", "name": "小卖部", "height_m": 3,
|
||||
"connections": ["el_003"], "has_detail": false },
|
||||
{ "id": "el_003", "type": "zone", "name": "主街道", "height_m": 3,
|
||||
"connections": ["el_001", "el_002", "el_004"], "has_detail": true, "detail_ref": "L2-el_003" }
|
||||
],
|
||||
"regions": [
|
||||
{ "id": "r_001", "type": "zone", "name": "家",
|
||||
"bounds_world_m": [5.0, 5.0, 12.5, 15.0], "area_px": 15000 }
|
||||
]
|
||||
},
|
||||
"L2-el_xxx": {
|
||||
"L2-el_003": {
|
||||
"world_size_m": [80, 60],
|
||||
"elements": [
|
||||
{ "id": "el_yyy", "type": "building", "name": "家", "has_detail": true }
|
||||
{ "id": "el_yyy", "type": "building", "name": "家", "height_m": 3, "connections": [], "has_detail": false }
|
||||
],
|
||||
"parent_level": "L1",
|
||||
"parent_element": "el_xxx"
|
||||
"parent_element": "el_003"
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -133,17 +145,20 @@ AI 布局解读文档 (场景名-layout-vXX.md)
|
||||
|
||||
### AI 解读流程
|
||||
|
||||
1. 用户在工具中画好布局,保存 PNG + JSON
|
||||
2. 将 PNG 提供给 AI(Claude vision)
|
||||
3. AI 分析颜色区域,结合 JSON 中的比例尺和命名信息
|
||||
4. AI 产出结构化布局解读 Markdown(区域表、连通关系、待确认问题)
|
||||
1. 用户在工具中画好布局,命名区域,设置高度和连通关系,保存 ZIP
|
||||
2. AI 读取 JSON 布局数据(elements + regions + connections + height_m)
|
||||
3. AI 交叉参考场景设计案的氛围描述,将 JSON 数据与场景概念建立映射
|
||||
4. AI 产出结构化布局解读 Markdown(区域表、连通关系、高度、待确认问题)
|
||||
5. 用户确认后,策划基于解读文档产出关卡执行案
|
||||
|
||||
> **说明**:PNG 文件保存在 ZIP 中用于画布的保存/加载,AI 分析以 JSON 结构化数据为准,不依赖 PNG 像素分析。
|
||||
|
||||
---
|
||||
|
||||
## 设计原则
|
||||
|
||||
- **强制使用预定义画笔**:无自由拾色器,保证每个像素都映射到已知地形类型
|
||||
- **结构化数据优先**:高度和连通关系由用户直接输入,AI 无需从图像推断
|
||||
- **层次化设计**:L1 定大局,L2 定细节,L3 预留
|
||||
- **人机共读**:PNG 供人和 AI 视觉分析,JSON 供程序化解析
|
||||
- **人机共读**:PNG 供人视觉确认,JSON 供 AI 和程序化解析
|
||||
- **与 Level Builder 一致**:画笔颜色直接映射 MI_Dev* 标识色材质
|
||||
|
||||
Reference in New Issue
Block a user