2.5D Graphics:A TileD Map Editor Guide

● ARCHIVED · READ-ONLY
Started by toasttoasttoast 4 posts View original ↗
  1. I've been using the TileD Map Editor in conjunction with @Jesse - PVGames 's fantastic new 2.5D modular building pieces. I was PM'd today with questions about how I got everything working for use in TileD, and realized perhaps that it might be helpful to post a brief tutorial on how to get things set up in TileD, just in case folks aren't sure. It took me a bit of fiddling about with it to figure things out, but it turned out to be pretty simple.

    Note that this guide will not cover how to use the RPG Maker MV+TileD plugin, which you can find over at https://forums.rpgmakerweb.com/index.php?threads/tiled-plugin-version-1-3-0-released.50752/ It will only cover how to make tilesets using these resources, and how I use the program in combination with GIMP for editing purposes.

    First off, we need to import our tile images into TileD. The program supports standard tilemaps as a single image, but we don't want that. Jesse's modular pieces and other objects vary in size, so we'll need to choose to import a collection of images to form our tileset.

    Go to File>New>New Tileset and you'll be presented with a dialogue box:
    upload_2019-6-12_18-12-58.png

    Name your tileset something that will be easy to identify at a glance, and click the dropdown next to "Type" and change it to "Collection of images". A popup will allow you to save the tileset somewhere on your PC. After saving, you'll automatically be brought to a blank tileset in the program.

    upload_2019-6-12_18-17-15.png
    Tileset>Add Tiles will present you with a navigation window. For ease of use and organization purposes, I recommend keeping things in their main directories(Buildings, Interior, Flora, etc) and separate the actual tile objects in subfolders based on their type(roofs, stone, fieldstone and so on). Navigate to the folder containing the tiles you want to add to the tileset, and either hit CTRL+A to quickly select them all, or CTRL+left click on individual images to add them selectively.

    You should have your tiles displaying in the window now, and TileD will automagically determine the size of each tile object based on its image size, so you don't have to do any work here. As far as I can tell, the Properties panel on the lefthand side of the screen doesn't need to be adjusted and can be left with its default values. I have no idea if switching the Orientation has any impact or not; as far as I can tell it hasn't made a difference.

    upload_2019-6-12_18-22-11.png
    File>Save and you're done! You should have a working tileset now. Create a few more for the different kinds of modular tiles, decorations, and even the trees and plants if you're so inclined. I prefer to do my decorating and terrain in GIMP, so I'll be showing you how I handle that later.

    upload_2019-6-12_18-47-54.png

    The only thing that really matters here is setting your grid to 32x32. You can set the Orientation to Orthogonal or Isometric and still achieve the same result with these tiles. I prefer Isometric because the grid will match the angle of the modular building pieces better.

    I always start with my floor. Per Jesse, there's an order you'll want to do things in if you want to save yourself a bit of a headache and make this process smoother. Be sure to keep the floor on its own layer, along with "North Walls" and "South Walls". I'll explain those two things in a moment.

    Spoiler
    upload_2019-6-12_18-36-14.png
    So I have my floor, and I'll start working on my "North Walls" layer, which should be positioned above the floor layer. Always work your way down from the topmost point. The cardinal directions in this perspective are a bit different, but we're going to (confusingly) consider North to be where it normally would be.

    Spoiler
    upload_2019-6-12_18-38-43.png
    This is where my "North Walls" layer ends for now. Create a new layer for the "South Walls". Everything positioned on this layer will essentially be walls the player needs to be able to walk behind in RPG Maker MV. If the walls would obscure your character, they belong here.

    So we wind up with this:
    Spoiler
    upload_2019-6-12_18-41-5.png

    The remaining wall pieces go on "North Walls", since they will be at the back of the room. This sets you up to easily add interior walls and objects as well, since you only have to position layers above/under one wall layer or the other. There may be some exceptions that are annoying to deal with, and I leave it up to you to figure those out. Play with the editor a bit, mess around with layering, and discover what works best when you're confronted with a layering issue. Doing things this way certainly makes it less common to have an issue where a tile sticks out over one where it should not.

    Spoiler
    upload_2019-6-12_18-44-15.png

    So now I'm done with my little building. I won't be bothering with a roof in this case, because it's a fair bit effort for an example. Just use new layers as necessary and position them above the wall layers accordingly.

    Now, I usually finish things out in GIMP. To make this super easy, we'll go to our layer panel in TileD and click the visibility icon(the eye) on all but the floor layer. Go to File>Export As Image, and be sure "Only Include Visible Layers" is checked. Save the file, and do this for the other layers. You want to export each layer individually, so you can assemble them in GIMP.

    I won't be including any additional screenshots, since this is already image heavy, but there is one more thing I recommend checking. Sometimes you wind up with very large images for small buildings like the above example and it's a good idea to drop each layer in GIMP, line up everything correctly on a 32x32 grid, and crop the images down to just the content to reduce your file size. The reason the exported layers wind up larger has to do with the map size chosen in TileD at the beginning of the process. The program will tell you what the exported map size will be in pixels right underneath of Width and Height in the New Map window.

    A bit more advice, do not click and drag your tile pieces in TileD. They will overlap one another and break the grid spacing, creating some weird looking walls/floors like so:

    upload_2019-6-12_18-53-29.png

    I have no idea how to fix this, and it's really obnoxious when you want to make a larger structure layout because you'll be clicking a LOT. But it's ultimately worth the effort.
    Another tidbit, if your tiles aren't showing up on the righthand side of the screen, click Map>Add External Tileset and find the tilesets you've saved to your PC. The tiles should just be available by default though when you make a new map.


    Hopefully this helps, I apologize if it's a bit long or too heavy on images.
  2. Good guide for what has become a very useful tool for planning buildings.

    One thing I have found useful even though it sounds crazy at first: I actually lay out my Furniture layers for a room before building any walls.

    This way I know what size the room needs to be, instead of ending up too cramped or too open then having to keep resizing the room.

    Maybe others can plan better, but Im not sure how many times I re-built my first test maps for this reason before I started doing this way on new ones.
  3. Lol. I definitely see the benefit there, because more often than not I wind up with too much space myself. I need to remember to place a character sprite somewhere for scale. Hopefully Jesse comes out with some rug tiles :D to help bring some rooms together. Hehe. Some of that space would fill in a bit more.
  4. Yes, I will whip up some rugs in the not too distant future (was thinking about this already) :)

    Rugs really do tie the room together :)

    What I do for my own buildings is I start with the floor first and don't put up walls right away. I make the entire outline only with the floor (and you could add furniture here and there to make sure it's to the scale you want). Only after that do I add the walls.