Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

A different tile animation system #811

greggman opened this issue Oct 28, 2014 · 9 comments

A different tile animation system #811

greggman opened this issue Oct 28, 2014 · 9 comments


Copy link

greggman commented Oct 28, 2014

I just wanted to throw out this idea.

Currently, AFAIK, the tile animation system is kind of broken and limited and I wanted to try to suggest an easier solution.

Many years ago some friends and I wrote a tile editor back in the MS-DOS days called tUME. We didn't have many of the features of Tiled and we didn't support tile animation in the editor directly. Instead we ran post processing tools, converters, on the data made in tUME depending on the game and what that game needed.

tUME supported multiple maps per file (we called them "rooms") and each room was assigned a "type". Using that type a post processing converter could decide how to use that "room" to generate data. A room of type "level" might be the game level where as a room of type "animation" might be used to create tile animation. These "types" were user defined and just meta data passed to the converters.

Anyway, that's probably all beside the point.

The idea I wanted to pass on was that what one of the converters did for tile animation was it would look at any room of type "tile animation". Going down each column it would look for rows of tiles and then a line of no tiles, followed but a row of matching size, etc. From this it would make generate tile animations.

If I'm not making sense, imagine I have a tileset that looks like this


I then make a map that looks like this


The simple algorithm scans down each column of tiles, looking for a blank tile. That becomes one frame. The next set of files below that until the next blank tile becomes the next frame and so on. The advantage to this style is that it's super easy to specify tile animation of any number of frames. Each animation can have a different number of frames. There's no need to call out individual tiles to specify the animation as you can paste whole blocks of tiles. On top of that no special UI is required. You just use the existing map editor.

The only thing that might need to be added if you want to see the animations live is a way to specify a speed for each animation. The easiest way to separate animations would be by a blank column. So in the example above there are 3 tiles animations because they are separated by a tile. You could also assume if a column as a different number of frames than the previous column it is starting a new animation.

Anyway, of course I can use this style of tile animation in Tiled already, I just don't get a live preview. But I thought I'd pass on the idea because rather than spending time making a custom tile animation UI you might find you'd get a lot more features out of this seemingly simpler to implement system. All you need is a list of speeds and some way to specify which Tiled file(s) should be used as the tile animation map for the current file being edited

Copy link

Ablu commented Oct 29, 2014

Hm. I do not understand how your system covers features that the current one does not? Additionally the way I understood this system would require a very specific setup while the editor is really intuitive...

So what would be the gain of this? How does it cover more features?


Copy link

greggman commented Oct 29, 2014

I guess I don't understand how the current one works then. As far as I could tell every tile had to be placed separately in the current one. If you have a 4x4 block of tiles that has 4 frames of animation in this one I'm proposing that takes like 4 seconds to setup. In the current Tiled one that would take 20-30 minutes of painstakingly placing the first tile of the first frame, then first tile of the second frame, then the first tile of the 3rd frame, then the first tile of the 4th frame, repeat 16 times, all in a really hard to use UI. On top of that I can't see how the current one supports more than one animation. Maybe my version is missing something. This is what I see


As far as I can tell in the current Tiled animation editor you only get one animation which mean you can't actually animate a block of tiles. A 4x4 block of tiles requires 16 tile animations.

The one I'm proposing one supports infinite animations and easily. You want one tile animation with 4 frames, another with 7, yet another with 2, it's easy.

I suppose the current one lets you set a speed for each frame but I'd be willing to bet there isn't a game in existence that needs that feature. Certainly no Sega Genesis, SNES or NES game ever made uses that feature. At the same time, if you just need to repeat a frame you can do it using the system I'm suggesting. Instead of putting down tiles like ABCD you just repeat frames. ABCCDDD makes an animation that is 1 frame of A, 1 of B, 2 of C, 3 of D repeat. The duration of a frame is up to the game.

I'd argue the system I'm proposing is vastly more flexible, vastly easier to use, and vastly more intuitive.

Copy link

bjorn commented Oct 29, 2014

Hmm, how strange that I was never aware of tUME, even though its goals are so similar to Tiled and it predates the first Tiled release (Java version) by 15 years. Apparently it was open-sourced around 2000? What a shame it was discontinued since it seems to have more nice features like support for sparse arrays. I played many of the games of which the levels were made with tUME.

Actually I just ran through the demo and it seems to have everything I thought was relatively special about Tiled compared to most other map editors. The block-select from tileset and map, the tile flipping with x/y, supporting any tile size and number of layers, zooming, etc. And then it has all these neat special features like drawing tiles with different palettes and color palette based animations.

But, about this issue in particular, the tile animation support. I entirely agree about the tediousness of the current approach in Tiled. I tried to make it as easy as possible by allowing to drag over multiple frames at a time, but still going over each animated tile to set up its animation is way too much work for use-cases such as yours. And I don't think such use-cases are rare.

The strange thing is, I somehow feel like editing a totally free map should not be the most convenient way of defining animations. Some of my reasonings:

  • You will need to specify exactly how this map will be interpreted (so you need a manual or an example).
  • The user could be doing all kind of things wrong that causes it to not work properly.
  • I considered the frame duration a necessary part and don't really know a nice way of specifying that in this format (though maybe you're right that it's not much used, and actually the way it is done currently is also tedious).
  • When done this way each library supporting Tiled maps would need to implement the algorithm used to determine the tile animations, unless they are also written in their current form in addition.
  • For the simple case of a single animated tile, it is less convenient than the tile animation editor currently in Tiled.

Yet, I can totally see how your proposal is more convenient as soon as you have multiple tiles involved in the same animation. Of course, you're free to draw this kind of maps and derive your animations accordingly, but then the animations won't show up in Tiled.

I wonder if there's any way to marry the two approaches...

Copy link

greggman commented Oct 29, 2014

It was discontinued because it's a DOS program. Porting it to a windowed system would have been more work than it was worth I think. It's so old it had to deal with near pointers, far pointers, huge pointers, EMS, XMS etc just to run. Tiled is great. I'm so glad I found it 😄

You could just make a script that given a map like I described generates tile animations. You could run the script again to update them. That would be one simple way.

Ideally it could derive some more meta data from the scanning. So for example in the image above there are a total of 56 tile animations. 36 for the first blue stuff, 16 for the red, 4 for the green. It would be nice if there was some way that meta data (that these 36 tiles are part of 1 group of tile animations, these 16 another, and those 4 another) was some how put in meta data and updated if the room was re-scanned.

Maybe I can find time to download the source and add that feature. Or maybe embed python or lua or JavaScript so I could just write scripts without having to recompile the app? Just throwing out ideas.

Copy link

karai17 commented Jan 21, 2015

I think a better approach would be to simply be able to grab a group of tiles and add them to a single frame, rather than having the animation screen only allow single tile animations. Dynamically size the animation window to allow how ever many tiles were added, and assume all frames thereafter are that size. Scale up or down as necessary.

  • Grab a 4x4 group of tiles and drag them into the animation window
    • Frame 1 becomes a 4x4 grid
  • Grab a 5x5 group of tiles and drag them into Frame 2
    • Frame 1 and Frame 2 become 5x5 grids (Frame 1 is adjusted based on where you dragged the tiles in Frame 2 to, so it might expand up, down, left, or right, accordingly)
  • Remove the top row of tiles from frames 1 and 2
    • Frames 1 and 2 are now 5x4 grids
  • Click "Save"
  • Tiled creates an Animation Group (similar to a tile group) with the animation metadata including the tileset or tilegroup it is related to
    • This allows you to create many animations without having to overwrite tiles
    • Stores all animation data in a single reference table
    • Tile index data could switch the 28th bit so a Tiled library can detect if it is an animation and knows where to find it

A dynamic animations window would be very useful and I think my 3am idea could improve upon it significantly.

Edit: I think this could also be useful for other similar windows such as the Collision Editor. Being able to select a group of tiles for adding metadata to is a surprising omission.

Copy link

mlemaudit commented Feb 29, 2016


Sorry if this is not the right place to tell you about it but ...

Do you know these 2 pieces of software ?

There are probably interesting ideas to get from them about animation and some other features as well.

I hope this will help you in your search.


Copy link

Tyyppi77 commented Mar 2, 2016

I'm pretty sure that Tiled has a neat tile animation system these days.

Copy link

bjorn commented Mar 5, 2016

Actually the animation system hasn't changed since this issue was opened, and still has the same problems when considering use-cases brought up by @greggman, namely when you have multiple tiles that are involved in the same animation.

I think though that one of the last things @greggman pointed out is probably the way foward:

Or maybe embed python or lua or JavaScript so I could just write scripts without having to recompile the app? Just throwing out ideas.

Scripting capabilities in Tiled are already planned (#949), and would allow implementing a script that builds up the current tile animation definitions based upon a map showcased in the first post.

Copy link

bjorn commented Dec 13, 2020

In the meantime, Tiled gained the above mentioned scripting functionality in the form of an embedded JavaScript engine (since Tiled 1.3). Using the scripting API, @SergKr has written a Bulk Animation Extension for quickly animating a group of tiles!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
None yet
None yet

No branches or pull requests

6 participants