You don’t have to be in game development long to realize the need for a good level editor. For my 2D game, I experimented with quite a few tools. There are definitely some great 2D level editors out there, like Tiled, which I still use for simple things like static collision detection and tile types. However, like usual, I wanted a little more power. Here are a few features that I really wanted, but are difficult to find in most 2D level editors:

• Non tile-based
• The ability to resize/scale/flip/crop sprites
• The ability to re-color/tint/erase portions of a sprite
• Supports drawing paths (for moving npcs)
• Can preferably set per-node or per-segment data (for defining wander radius, speed, loiter time, etc)

While there are a few solutions that come close, such as GLEED2D, for my needs, I felt it was still lacking. I spent a good chunk of time trying to find the perfect level editor, and then I had an epiphany – Photoshop does all of this already!

In fact, there are a few other indie developers that came to the same conclusion I did, and use Photoshop as a level editor. However, Photoshop obviously falls short in the fact that it’s not designed for exporting xml data. For that, I’d have to write some code.

Several years ago, when I first started tinkering with Photoshop as a level editor, there were a handful of interesting scripts available for exporting level data, most similar to the one discussed in the link I provided above. However, most of the solutions and scripts I found were weren’t very robust. They were either too specific for my needs, or too unstable. Thus, I started working on a solution of my own, with a few goals in mind:

• Provide a UI that allowed pausing, aborting, viewing progress, and setting various configuration options.
• Allow a batch build, for building multiple levels at once
• Image consolidation (only save one image if used multiple times in the same level).
  Allow my level to be opened and modified within Tiled. Perhaps this won’t be necessary now that I’m in Unity, but in XNA I used Tiled to:
• Configure light sources (radius, brightness, animation name)
• Level entrances/exits/portals
• Static collision detection (tile based)
• Tile types – forest, path, water, etc (tile based)

Essentially, I wanted to build my level in Photoshop, and configure it within Tiled. Over the course of about a month, I was able to cobble together a working solution in my spare time. It started out as simple javascript, and eventually became a full-on WPF project. The World Builder has been through quite a few revisions over the past few years, but here’s what it looks like today.

World Builder

Build in progress. And Dave. Making obscene gestures.

Build complete. Any errors or warnings are displayed.

Several things are generated during the build:

• An objects folder, containing all images that were visible in the .psd document. These are optionally consolidated.
• Various screenshots. The background/terrain layer, roof layer, water layer, etc.
• Various xml files. Currently there are only two – one containing npc pathing data, and one for use in Tiled (.tmx file, containing xml).

Level data. The archives, data, objects, and screens directories are generated by World Builder.

Objects folder

Data folder

Screens folder

Each level takes a decent amount of time to build, so I’ve also included the option of just rebuilding the data files if desired (.tmx and .xml). This can be useful for keeping .tmx files consistent across multiple zones. Rebuilding .tmx files will do nothing more than add missing layers and re-order existing layers. In the future I may add the option to rebuild npc movement data without performing a full build. However, now that I’ve moved away from XNA, I’m planning on moving my my NPC pathing logic into Unity, making this feature unnecessary.

For reference, my first zone is 2100×1300 pixels, with about 250 individual object layers, and it takes about 5 minutes to build. It’s not lightning fast, but it’s acceptable. Results will vary, of course, as the build time is dependent on the speed of the computer.

After a build is completed, you can immediately open the file in tiled, and get to work. If you want to run another build in the future, you can do so with relative safety. The build is as non-destructive as possible, and will not overwrite object or tile layers you have created manually in Tiled. In addition, unless overwrite is specified, copies of all output directories will be made and stored in an “archives” directory.

Archives. Nothing is overwritten by default.

The result, opened in Tiled.

Overall, I have to say this has been a pretty interesting project. It was quite the lesson on Photoshop integration, and ultimately enabled me to create some other useful Photoshop automation tools. Hopefully one of these day I’ll be able to put all of them to good use, and actually finish a game!