乐于分享
好东西不私藏

Day182:我做了一个2.5D地图编辑器,你的“模拟城市”创作工具

Day182:我做了一个2.5D地图编辑器,你的“模拟城市”创作工具

今天是我365天独立开发挑战的第182个作品。

这次做的是一个2.5D地图编辑器。灵感来自那些可以拖拽建筑、道路、人物、设备到网格上的等距视角设计工具,但我更想把它做成一个偏“模拟城市”方向的创作工具。

它的核心不是做一张静态图,而是做一个可以不断扩展的地图系统。

打开工具后,左侧是素材库,里面有草地、道路、住宅、写字楼、工厂、办公园区、物流厂房、树木、人物、车辆等素材。中间是一个无限延展的等距网格画布。用户点击左侧素材后,就可以在画布上连续绘制,不需要每放一个都重新选择素材。

这点很重要。真正的编辑器应该像画笔一样顺手,而不是每一步都打断用户。

我一开始做的是固定大小的网格,后来发现这不符合地图编辑器的直觉。画布应该是可以一直扩展的。所以现在网格会根据视口动态生成,用户可以把内容放到很远的位置,也可以使用负坐标。它更像一个无限画布,而不是一张固定尺寸的纸。

另一个重点是2.5D的吸附关系。最开始我犯了一个错误:素材是吸附到网格交叉点上的。后来我发现这不对,建筑的底面应该正好对应菱形格子。现在每个素材都有自己的占格信息,比如1×1、2×1、1×2、2×2。放置时会按照真实占地footprint对齐网格,这样建筑看起来才像真正长在地图上。

左侧菜单也做了调整。之前只是色块加文字,现在改成了素材的缩略图,并且显示占格大小。这样用户在选择素材时,可以直接看到它的形状和尺寸。

我还尝试过给工厂加烟雾、写字楼加灯光闪烁、车辆加轻微移动。但实际测试后发现,在当前阶段这些动态效果会影响流畅度。所以今天先全部取消。独立开发里有一个很现实的判断:不是所有“看起来高级”的东西都应该马上保留。流畅、稳定、好用,优先级更高。

目前这个工具已经具备了一个地图编辑器的基础骨架:

可以连续绘制,可以无限扩展画布,可以吸附等距网格,可以放置不同尺寸的建筑,可以调整对象坐标、层级、缩放和朝向,也可以保存、导入、导出JSON。

接下来我想继续完善素材系统。每天新增一些小图标、小建筑、小设施,让它像一个不断生长的城市素材库。等基础能力更稳之后,再慢慢加入道路连接、区域规划、建筑状态、生产活动、人口流动等“模拟城市”元素。

第182天的收获是:工具类产品最重要的不是功能堆得多,而是交互逻辑要顺。一个编辑器是否好用,往往就藏在这些小细节里。