Yesterday I added new creeps to Mazebert TD: Rats!
As I do not have the 3D skills to create, animate and render 3D models myself, I am using existing resources from the internet. My one and only source by now is the isometric sprites section of Reiner's Tilesets. For each character, various animations like walking, running, fighting, tipping over, etc. are available. Also each animation is rendered in 8 isometric directions! Reiner, thank you so much for sharing your great work! Without your site, there would be no creeps to kill in Mazebert TD. Well, there might be creeps, but killing them would really be a lot of less fun.
After downloading the ZIP file from Reiner's website, I end up with a lot of images like the one shown above. First thing I do is to remove the animation sequences I don't need. Right now I only use three animations: Running, Stunned, Dying. In the next step I remove all rendered directions I do not need. Currently creeps can only move diagonal, so I end up with: North-east, North-west, South-east, South-west.
Now it's time to prepare the remaining sprites. The desired information for my isometric rendering engine is:
A diffuse light pass
A shadow pass
For that, I wrote a little batch script, that extracts this information from the remaining bitmaps. It uses the mogrify command from the great image processing library Image Magick.
@echo off
echo Preparing sprites.
echo Diffuse aspect...
rd diffuse /s /q
mkdir diffuse
mogrify
-path diffuse
-transparent "#5e4229"
-transparent "#0c0905"
-format png *.bmp
echo Shadow aspect...
rd shadow /s /q
mkdir shadow
mogrify
-path shadow
+transparent "#0c0905"
-channel RGB
-evaluate set 0 +channel -channel A -blur 2x2
-evaluate multiply 0.5 +channel
-format png *.bmp
cd shadow
for %%j in (*) do (
rename "%%j" "shadow_%%j"
)
echo Done.
pause
The first mogrify statement in the script extracts the diffuse information from the images. The brown background color is turned transparent as well as the color of the casted shadow on the ground (in this example #5e4229 and #0c0905).
In the second mogrify statement the shadow color is extracted from the input images, the rest is turned transparent. Plus, a little blur is applied to the shadow so that the resulting shadows in the game are not that hard.
With the help of Texture Packer I bundled the output of the script in two texture atlases. I can really, really recommand Texture Packer if you are creating sprite based games. It costs just a few bucks and it works very, very well and saves you lots of troubles holding your assets together. Plus, it works out of the box with Starling.
Diffuse texture atlas
Shadow texture atlas.
After postprocessing.
For the diffuse part I used the cool "inner padding" feature of Texture Packer, so that a few pixels are added to the sprite region of each diffuse creep image. In a little postprocessing step I add an comic-like outline stroke and some light overlay to the images. With the stroke each image gets a few pixels bigger, but that's okay as we added those pixels up front with the inner padding!
And there are rats :-)
After downloading the ZIP file from Reiner's website, I end up with a lot of images like the one shown above. First thing I do is to remove the animation sequences I don't need. Right now I only use three animations: Running, Stunned, Dying. In the next step I remove all rendered directions I do not need. Currently creeps can only move diagonal, so I end up with: North-east, North-west, South-east, South-west.
Now it's time to prepare the remaining sprites. The desired information for my isometric rendering engine is:
Diffuse texture atlas
Shadow texture atlas.
After postprocessing.
For the diffuse part I used the cool "inner padding" feature of Texture Packer, so that a few pixels are added to the sprite region of each diffuse creep image. In a little postprocessing step I add an comic-like outline stroke and some light overlay to the images. With the stroke each image gets a few pixels bigger, but that's okay as we added those pixels up front with the inner padding!
And there are rats :-)