用最简单的方式设计游戏地图——画格子图，让 AI 帮你转成代码

修改于04/22123 浏览开发心得

前言

在开发魔塔类游戏时，地形设计是最核心也最繁琐的环节之一。一张 13×13 的网格地图，手写代码要定义 169 个格子的状态，写 38 张不同地图就是上千行重复劳动。我找到了一个更直觉的方式：用图片画格子，让 AI 读图后自动转成游戏数据。最终我用这个方法，从 38 张手绘格子图生成了 114 个地形模板（每张图扩展为 3 个变体），直接用在了游戏里。整个过程不需要写任何转换脚本，也不需要专业的地图编辑器。

整体流程

手绘格子图 → 发给 AI 读取 → AI 输出文本地图 → 扩展概率门变体 → 写入代码文件

分为 5 个步骤：

设计格子图 — 用任意绘图工具画出墙壁布局
批量发送给 AI — 把图片发到对话中
AI 视觉识别 — AI 逐像素读取，输出文本格式的地图
概率门扩展 — 每张基础地图生成 3 个随机门变体
写入代码 — 自动生成可直接运行的 Lua 数据文件

第一步：设计格子图画图规则

使用任意支持网格绘制的工具（像素画工具、Excel、甚至手机上的绘图 App），按以下规则画图：颜色含义黑色/深色格子墙壁（不可通行）绿色/浅色格子空地（可通行）格子尺寸我的游戏使用 13×13 的网格：

外圈（第 1 行/列和第 13 行/列）：固定为墙壁，形成地图边界
内部 11×11 区域：自由设计的可玩空间

保证连通性 — 所有空地区域必须相互连通，不能出现完全封闭的孤立区域
留出走廊和咽喉 — 狭窄通道是后续放置「概率门」的理想位置
考虑对称性 — 对称布局看起来更美观，也更容易让 AI 准确识别
墙壁数量适中 — 内部墙壁建议占 30%~50%，太少缺乏策略性，太多行走空间不足

第二步：批量发送给 AI

把画好的格子图直接截图或导出为 PNG，然后发送到 AI 对话中。我的实际操作我一次性发送了 38 张格子图，并告诉 AI：“这些是我设计的 13×13 魔塔地形图，请读取每张图的墙壁布局，用 # 表示墙壁、. 表示空地，输出为文本格式。”注意事项

图片要清晰 — 格子边界要分明，黑白/深浅对比要明显
一张图一个地图 — 不要把多个地图画在同一张图里
网格要对齐 — 格子大小要一致，不要有歪斜
可以批量发 — AI 能同时处理多张图片，一次发完比逐张发更高效

第三步：AI 视觉识别

AI 收到图片后，会逐格识别每个格子的颜色，转换为文本符号：识别过程

定位网格 — AI 先识别图片中的网格结构，确定行列数（13×13）
逐格判断 — 对每个格子判断：深色 → #（墙壁），浅色 → .（空地）
输出文本 — 生成用空格分隔的符号矩阵

格子图本身就是离散的网格结构，不存在模糊边界
只有两种状态（墙/空），判断逻辑简单
对比度足够高（黑色 vs 绿色），不会混淆

第四步：概率门扩展

基础地图只有墙壁和空地，为了增加游戏的策略性和重玩价值，我让 AI 在每张基础地图上生成 3 个概率门变体。什么是概率门？概率门是放置在空地上的特殊元素，用符号 i 表示。运行时会随机变成：结果概率效果消失（空地）50%路径畅通，不消耗资源黄色门43%需要 1 把黄钥匙开启蓝色门6.5%需要 1 把蓝钥匙开启红色门0.5%需要 1 把红钥匙开启放置规则AI 按照以下规则放置概率门：