Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Sign in to follow this  
Phobus

[Tutorial] Monster Spriting for Amatuers

Recommended Posts

(also posted at zdoom.org - I thought this'd be useful here too. I've had to have the images as urls, as there's too many for [img] tags, apparantly.)

Now I'm sure we've all seen spriters like Eriance and Vader, and said something along the lines of "Oh gosh, I'd never be able to do something like that". And you're probably right. Short of hidden artistic talent, you will never be as good as somebody who really is good at that sort of thing.

But wait! That doesn't mean you have to give up. Custom sprite-sets don't need to be amazing to be good, or useful. What this is here is me, an amatuer sprite artist with no real artistic talent, showing you how anybody can make sprite sets that at least get the job done without resorting to copy/paste and sprite hacking.

NOTE: You will need: Patience; time; music to help pass the time whilst spriting; MSPaint or a clear understanding of how to emulate what I'm showing in your editor of choice; A clear idea of what you want to create; A reasonable understanding of basic file organisation techniques for your OS (preferably windows, as that's what I have); XWE, or an alternative that you can use well enough to emulate what I'll be doing there; some understanding of DECORATE and other useful lumps such as SNDINFO or DECALDEF, as I'm not going to explain how to define monsters.

For the purpose of this tutorial I will show you how I made the Spore from Virus, and other such monsters, and will note on how to make more animated monsters, such as bipeds and the like afterwards. The tutorial is split into sections to make things simpler.

-----------------

STAGE 1: PREPARING

1. Ideally, if you are making a sprite set, it is for a project. So you should have a project folder to keep things organised. My approach is that, in my Doom folder, I have a folder called Personal Projects, and inside that I have a folder for each project. As sprite sets are usually a lot of images in one go, the best bet for you is to have a folder within the Projects folder called Sprites, and then have a folder inside that for every monster, like so (helps if you have the folder set to thumbnail view, so you can see the sprites at a glance):

http://www.phobus.servegame.com/T_spritefolders.png

2. So first, make your folder for your sprite set, and name it what you would like to call your monster (the example here being Spore). Really it helps if you have a good idea of what you want to sprite (perhaps even down to behaviour and the like, and a sketch of the monster can help too), otherwise the process will be very slow and somewhat (more) tedious.

3. Once you have the file structure and plan all set up, you will need to open up something such as Doom2.wad in XWE, find a sprite such as PLAYA1, and save it into your folder for your monster - the purpose being that you can use this sprite to set the pallette in MSPaint to the Doom pallette, saving you trouble later trying to get your monsters to look good in dooms restricted pallette. The easiest way to do this is as follows:

-Be in possession of XWE already
-Right click on DOOM2.WAD and click "Edit with XWE" (this should be an option - if not, open XWE first and load DOOM2.WAD from within XWE)
-Scroll down the list, or press "P" until you get to PLAYA1, then click on it
-Click on "Entry" on the toolbar
-Go to "Save As..." (as shown in the screenshot below)
-Save it to your folder

http://www.phobus.servegame.com/T_xwesave.png

4. Put your music on so you've got something in the background to help stave away boredom (spriting generally takes a while). Having all songs on with shuffle works well for me.

5. Open up PLAYA1 in MSPaint, zoom in to 6x magnification (best size IMO) and make the entire image cyan (it's not actually a blank colour in Doom, it's just used to represent transparency), by first right-clicking on the colour cyan on the pallette down the bottom (the same colour as the background to the sprite) and then using the eraser to remove all other colours from the image. Then resize the image using the attributes option in the images part of the tool bar (shown how to get to in the screenshot below) to the size you want your monster to be (it should be measured in pixels). In this case, I'm using width 39, height 32. The reason the width is odd is because it's easier to mirror things across an odd width than an even one, because the symmetry is marginally less obvious, and generally looks a little better on most sprites. Save the image before continuing (ctrl+s, or just click file, then click save)

http://www.phobus.servegame.com/T_attributes.png

6. You should now have a file which looks like this (it will most probably be a 256 colour bitmap, which is the simplest way to go, even if it isn't the most file-size friendly):

http://www.phobus.servegame.com/T_blank.png

Now you are ready to put in your monster's pallette. The trick is to decide the basic colours you want, then decide on 2-5 lighter and darker shades. So click on "Colors" on the task bar and then click "Edit Colors..." (it's the only option there). Now click on the button that says "Define Custom Colors >>". You should be met with a small window that looks like this:

http://www.phobus.servegame.com/T_colours.png

Here you can select any of the colours possible in the colour spectrum on the right. What you should do first is find the basic colours you want (ie. black, green, white and a dark grey, for my example monster), and get a "neutral" shade. Every time you select one, click add to custom colours, close the little window and click the colour onto the top left-hand corner of your image (depending on how many shades you want, these neutral colours will be 3-6 pixels down from the top, and will form a line across), then go select the next colour. Then get enough lighter and darker shades for your colours so that you feel you can shade your monster properly. The end result will be something like this (if you organise it from lightest down to darkest for each colour):

http://www.phobus.servegame.com/T_pallette.png

When you are happy with your colours, click File, then click Save As. It will have 256 colour bitmap selected, and that's fine, because it means it's stored the doom pallette into your image, so only colours that appear in Doom are useable for you. Save the image as ----Pallette, where the ---- is replaced by the sprite name (so for the Spore, it's SPORPallette; for the DoomImp it'd be TROOPallette, etc. You should be able to find a 4 letter combination for your creation). You can delete PLAYA1 if you like, or move it somewhere else for later use. You are now ready to start making your sprite set.

-----------------

STAGE 2: SPRITING A FRAME

1. A frame is pose that the sprite is in, complete with rotations. For example, there are generally 4 frames in a Doom monster's walking animation, each with 8 rotations. However, mirroring is used to reduce the number of sprites required. This section will show you how to sprite a frame using your pallette, complete with mirrored rotations. However, it is showing a simple monster with little in the way of animation. Later I'll make a few points on the creation of more animated sprites.

So to begin with, open up your Pallette image. This will be the base for every sprite you make from scratch (it is easier for some sprites to be made from edits of previous sprites, as will be shown later). I will now show you how I made SPORA1, which is the forward facing rotation (or rotation 1) of the first frame (the A frame) for the Spore.

2. This is where you having an idea of what you want to make already in your head (and perhaps on paper) comes in handy. You should already have guessed what size the sprites will be and adjusted the width and the height of the pallette image appropriately (generally aim for the dimensions of the front rotation, as those are generally the average). Now you're going to use the basic colours (and perhaps a shade or two to highlight different parts) to make a simple outline of your monster, making up it's basic shape. The simplest way to do this is to grab something such as the paintbrush, basic shape or pencil tools, and draw the rough shape of half of the monster with those before using the pencil tool to touch it up, and then copy/pasting the half you have drawn to make the whole shape (obviously flipped horizontally using the Image -> Flip/Rotate tools). Using the selection setting picked in the screenshot below (bottom left corner of the screenshot) allows the secondary selected colour (usually cyan whilst editing sprites, so you can correct mistakes by right clicking over them) to be transparent, so you can paste over things without blotting them out with the background colour - useful for situations where copy/pasting is in diffcult or complex areas. You should end up with something along the lines of this (notice it's got the basic features, such as eyes and gun drawn on, but only in one shade, and that the highlighted section flips precisely onto the other section, bar the pallette):

http://www.phobus.servegame.com/T_outline.png

Remember to save regularly in case anything unexpected goes wrong (first time, you must save it as ----A1, so you don't overwrite your pallette, after that you can use ctrl+s).

3. Now you have your basic outline, you can move onto basic shading. Firstly, shade the details, as they will usually have less colours. The general rule I follow when shading is to have it look like it's lit from above. This way there's a consistency to the shading throughout my monster sets. You can follow your own rule if you like, just remember that symmetry is easier when lit from above or below as opposed to any other angle (except perhaps the front or back). I also generally make sure anything that is further back is darker, to give the illusion of perspective. Once the smaller sections are done, pick the extremes of the main colour, and shade with those appropriately. The end result will looks something like this, most likely:

http://www.phobus.servegame.com/T_shading.png

Remember to keep saving!

4. Now you can finish off your A1 sprite by finalising the shading using your intermediate shades and the pencil tool, and removing the pallette from that sprite, to have a result that looks something like this:

http://www.phobus.servegame.com/T_sporefront.png

Save it one last time and there you are. One finished sprite!

5. Now that you have done the front sprite of a monster, the next sprite should be the back sprite (A5, in the case) The reason behind this is simple - you can edit the front sprite to make it the back! From behind, things will have the same sillhouette as they do from the front, so you already have the basic shape already, and most probably a fair chunk of the shading. If you're making an asymetric monster or it is in an asymetric pose, flipping horizontally will make behind correlate with the front, thus allowing you to edit anyway. The key here is to make sure it looks plausible. For example - it may have something on it's back that you can't see from the front, so draw that on if it does, and be sure to remove any hint of the details only visible from the front (unless of course they should be there, according to your design). The sprite below was made by doing what I've just described:

http://www.phobus.servegame.com/T_sporeback.png

Save this as ----A5, when you're done, so you've now got two sprites and the pallette.

6. Sadly not every sprite can be made by using the previous sprite. However, previous sprites are useful as reference for heights. The next rotation drawn for a monster is usually best off as the ----A3A7 sprite (drawn facing left, and using Dooms built in sprite-mirroring to save yourself having to copy/paste and horizontally flip the sprite yourself). A3A7 can be draw using the A1 and A5 sprites as reference for the heights of features (and even shading). You will notice that paint shows co-ordinates in the bottom right-hand corner of the window. This is usful for taking heights for rotations, but you will have to rely on yourself for positioning (draw out the rotations yourself on paper if it helps). You basically follow steps 1-4, but this time the sprite is called ----A3A7, and the monster generally isn't symmetrical (if it is, you can work with that too). The best approach is to draw this sprite with seperate instances of paint showing the A1 and A5 sprites, for easy reference. You may find that, when you are drawing this sprite it is wider or thinner than the pallette image that you are editing from. This is perfectly normal, and the simplest way out of this is to click the right-hand side of the picture when you have the pencil tool selected (on the little blue dot) and drag it to the correct width.

7. Now you are onto the diagonal frames. The best way to make these is to have the A3A7 sprite open in another instance, and either the A1 sprite (for the A2A8 sprite, facing forwards and left), or the A5 sprite (for the A4A6 sprite, facing backwards and left) for reference and then to follow steps 1-4, taking the information in step 6 into account where sizes are concerned. I'll admit these frames generally cause me problems, so I just try to do them as best I can and move on. Remember to save them with the right names.

8. Once you have done the above, you will have one whole frame, complete with rotations. Congratulate yourself, and probably take a break too - this stage generally takes over an hour, sometimes even 2 or more. When you are ready, move on to Stage 3.

-----------------

STAGE 3: FINISHING THE SPRITE SET

1. You will have made 1 frame, now you need to make the others. If you're making a simple monster, you made need pain animations, some movement animations and attack animations. Where possible, try to edit sprites to make these other ones. Otherwise, you will just have to keep doing Stage 2 for every frame (swapping A for the appropriate letters). Some frames may be asymmetric, where earlier frames were not. If this happens you have a choice. You can either take the approach I favour, and sacrifice the #2#8, #3#7 and #4#6 rotations accuracy (by which I mean leave the frames mirroring, even though they shouldn't be, because that'd mean the monster swaps hands for it's gun or whatever), or you can draw out the extra frames and have your work look more accurate but take longer overall.

Death animations are generally not rotated, and neither is the corpse frame. To do this, just make one sprite and call it ----#0. The 0 means that it faces all directions, like pickups, decorations and corpses do in Doom. If you wish however, you can rotate the corpses too.

2. When you have a simple finished sprite set, it will probably look something a bit like this (in windows explorer, with thumbnail view on):

http://www.phobus.servegame.com/T_spritesheet.png

Notice how the B, C, D and E frames all were edited from the A frame.

3. Now you have done this you will want to draw any extra sprites they need, such as projectiles. Drawing projectiles is generally simpler than monsters, and rotations and the like are usually determined on a frame by frame basis (most projectiles will not need rotations). The basic idea is still the same though, and following the tutorial for prokectiles will work just as well as for monsters.

4. Once projectile and other sprites are all done, you can get sounds if you need them, and implement the monster into your wad, which is breifly outlined in Stage 4, below. Feel free to delete the Pallette image(s) if you don't need it anymore, or copy it elsewhere for later use and editing if you're making more monsters.

-----------------

STAGE 4: IMPLEMENTING THE MONSTER

1. The first thing you will need to do is load your sprites into your wad. Generally you will want a resource wad seperate from your map wad, so as you'll only ever mess up one thing at a time (especially as resources can be loaded up again easily, wheras maps are generally not so easily restored if lost.). So open your resource wad in XWE, or make a new wad if you haven't got one, by opening XWE and clicking File, then clicking New (and naming the new wad something helpful, such as virus_resources.wad in my case).

Once you have the wad opened, you will need S_START and S_END markers. If these aren't already present in your wad, click Entry, then click New. In the box write S_START and click ok. This will make your S_START marker (move it where you want it to be in your lump order, if it's not in a good place, using ctrl+d and ctrl+u), then repeat, but name the new entry S_END. Make sure S_END is after S_START, and make sure you have S_START selected when loading your sprites.

Now click Entry, and then Load from the drop down menu. Find your sprites in your nice and organised file system and then click the one at the start of the list, then shift+click the last one in the list. This will select all entries. Then click load. What will most likely happen now is that all of your sprites will load in order, but the one that should be last will be first. Move this down to the end using ctrl+d.

2. When all of your sprites are ordered and loaded, you may find a problem. Clicking on them, you will see that they are aligned to PLAYA1's dimensions, thus off-centre. What you have to do now is go through all of your sprites and set the offsets correctly. Generally the offsets are half of the width, and the height -3 or -4, depending on how low you want it to offset into the floor in software mode. This doesn't take very long with most sprite sets, and is generally necessary anyway as some sprites won't align properly by default when compared to all of the other sprites in the set for the monster (projectile frames generally show it most obviously).

3. Now you can load your sounds, make your SNDINFO entries and define the monster and projectile(s) in DECORATE. Test this and fix any problems you see.

4. Well done, you've just made your own monster! If you intend to make something a little more complex, the notes section below will be helpful. Feel free to release your monster in a thread or something to show off how proud you are of all your hard work, or get to work on the rest of your project. Well done.

-----------------

NOTES FOR COMPLEX MONSTERS

Obviously some monsters won't be as simple as my Spore. In fact, most aren't. Here's a few hints, tips and facts for you to help you out with spriting more complex sprite sets:

-Monsters that are symmetrical and walk can have their sprite counts cut down a little by making A1C1, B1D1 and A2C8 (etc.) sprites, which will save space and probably some time. For a good example of this, check out the Hellknight in Doom2.wad

-Monsters that are not symmetrical will need a sprite for each rotation (ie. A1, A2, A3, A4...) unless you feel it can pass off easily enough with mirrored rotations. The choice is yours - afterall, you don't even have to do this at all if you don't want to.

-If you have a monster with a lot of frames (30, for example), you can use more than one name for their sprite set, and it won't matter, as DECORATE allows for this easily. For example, you could have MONS for walking, pain and various attack frames, but because it has so many death frames, you can call them something such as MOND and start from A again, meaning monsters can be as animated as you like.

-It is possible to have rotations 9, 0, A, B, C, D, E, F if you want to have 16 angles... however this requires twice as much work and is inadvisable, to say the least.

-----------------

This took me like 3 and a half hours! Hope it's of some use :) The spell-checked and corrected version will be put on my website some time this week.

Share this post


Link to post

Phobus said:3. Once you have the file structure and plan all set up, you will need to open up something such as Doom2.wad in XWE, find a sprite such as PLAYA1, and save it into your folder for your monster - the purpose being that you can use this sprite to set the pallette in MSPaint to the Doom pallette, saving you trouble later trying to get your monsters to look good in dooms restricted pallette. The easiest way to do this is as follows:[/B]


Obtuse. Just take a screenshot (print screen) of the Doom palette from XWE.

Share this post


Link to post
kristus said:

Obtuse. Just take a screenshot (print screen) of the Doom palette from XWE.

That wouldn't give you a 256 colour paletised image though would it?

Share this post


Link to post

No. But you can keep it in your frame and tap colors from it. Or you could use a program that doesn't suck like the Gimp.

Share this post


Link to post

@Kristus: Like Enjay says, I use this method to ensure the pallete is enforced in Paint. I appreciate it's not the best art program, but it's sufficient for Doom.

Share this post


Link to post

Sorry for the double post, but it's an update, so I felt it was required. (the below is a copy from zdoom.org)

I said I'd do it, so I have. My website now has a tutorials section, complete with this tutorial in website form. Here's the links:

http://www.phobus.servegame.com (my site's main page, with the news post about it)
http://www.phobus.servegame.com/tutorialindex.html (the tutorials section main page)
http://www.phobus.servegame.com/spritetutorialmain.html (page 1 of the sprite tutorial - it's spread over 5 pages so you don't have to load too much at any one time)

Just so you know, I've had my best go at spellchecking and correcting things (I even worked out the correct spelling of Amateurs :P), so hopefully it's the best it can be now.

Share this post


Link to post
Phobus said:

@Kristus: Like Enjay says, I use this method to ensure the pallete is enforced in Paint. I appreciate it's not the best art program, but it's sufficient for Doom.


Even though I'm getting better at PaintShop Pro i still use mspaint for many things.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  
×