2.5D Modeling Tool

I quite like Lost Garden and was intrigued by his 2.5D modeling tool idea and finally having some free time over the holidays I decided to give it a quick go.

Click to try:

I took a few shortcuts to get something working quickly so there are a couple of changes to his basic design:

  • To make the rendering and boolean type operations simple to code I made it so every X/Z slice has to be rectangular. This means there are no N/E Ramps and no rounded N/S edges.
  • Rather than incorporating any rotation it seemed easier to just have the different rotations available as primitives.
  • Having only six handles for re-sizing leads to the middle set being confusing as it is unclear which face they are for re-sizing. I found adding a second pair allows for all scaling operations intuitively.
  • Implementing rounded edges for all the shape types was tricky and you really need to be able to selectively round different edges, instead I just added two types of fixed/rounded boxes as an example of what could be achieved with a more complete tool.


  • You can change the palette by double-clicking on a color.
  • The list on shapes on the right can be re-arranged by dragging.
  • Holes effect only shapes below them in the list.
  • Dragging the front face moves the shape up/down and left/right.
  • Dragging the top face moves the shape forward/back and left/right.
  • Models are compact enough to be URL encoded, so use that for saving/sharing.
  • The rendering engine needs a bit of work, better lighting/shadows and textures will make it look a lot better.
  • The rendering code is pretty simple and this could easily be implemented in JavaScript/HTML

Source code now available here: lgmodeler

7 Responses to “2.5D Modeling Tool”

  1. Kyro Says:

    Very cool, Need to open up the color palette somewhat though. Might have a play with this for prototyping graphics before getting the art design team engaged.

  2. admin Says:

    You can modify any color in the palette by double clicking on it. Having a small palette made it so models were small enough to URL encode, 15 colors should allow for a pretty broad range of models.

  3. Mystic Says:

    It’s an awesome tool! Thank you very much for your work!
    Surely it can help many beginners at game development to build their game prototypes.

    I hope you will find it interesting enough to continue the development of this tool. It would be very nice to have a possibility to change the rendered model size, for example.

  4. MikePote Says:

    You’ve done a really nice job! I’ve been looking all over for decent tilesets, I may just make some myself rather.

    I’d love to port this to pure javascript, it’s such a disappointment what they’ve done to Java apps on the net :(

  5. Lastern Says:

    Hello am i able to use that tool?

  6. qichunren Says:

    Will you give a video tuturial about how to create a tile image as you created in the post? Thank you very much.

    I tried many times, but failed create as you did.

  7. yupswing Says:

    LGModeler is awesome and I’ve thought it was a good idea not to make it die.

    I’ve forked this project and created a multi-platform (win,mac and linux) tool based on LGModeler.

    TileCraft is alive, written in Haxe, fast and it will improve a lot.
    You can find it on github here https://github.com/yupswing/TileCraft


Leave a Reply