The basic idea is that you can draw the equiped character in a series of steps. Conceptually, lets start with three imagined drawings: One of the character with base equipment, one of the character wearing upgraded boots, and one of the character wearing an upgraded helmet. The latter two are drawn over the first so that the helmet and boots line up correctly, then everything in those images that are not boots or helmet is wiped away. Now, from those three images you can draw a player who is wearing the base equipment only, is wearing the boots, is wearing the helmet, or is wearing both the boots and the helmet -- four combinations of equipment from three images. This savings might not seem like much now, but as there are more categories of equipment (helmets, boots, etc) and more kinds of equipment in each category (leather boots, steel boots, etc), the savings are compound. Specifically you will achieve number_of(helmets) * number_of(boots) * number_of(...) unique outcomes from just number_of(helmets) + number_of(boots) + number_of(...) input images. For example, with 5 kinds of 3 categories of equipment, you get 125 unique combinations from just 15 original pieces of art.

You do this for each frame of every animation, for each piece of equipment. With that, you can build up every animation with any combination of equipment that the player could possibly equip. Doing this by hand is very time consuming of course, but Diablo, even though it was 2D is not hand-drawn. In Diablo, all the sprites are just snapshots of a 3D model from an art program. Because of this, they were able to create the base animations and then render them all with each piece of equipment (equipment was also a 3D model in the art program).

Once you have all of these images, you can cut out or compress the unused portions of the image. and you also have to generate the draw order so that the players cape covers his chest-plate when he faces away from the camera, but is behind his chest-plate when he faces towards the camera. But those are just details of the basic principle.

All of that said, its almost notoriously-difficult to create overlapping isometric-view scenes with a lot of complexity just by using z-ordered 2D images. Because of this, many isometric games of today are, in whole or in part, actually rendered in 3D complete with z-buffer. Even Diablo does this to some extent, its just that they did it offline. Some are hybrid systems that pre-render the character wearing a particular collection of equipment, saving the images as 2D sprites, and then drawing those when in-game (usually, this is done when there are a lot of characters, or when running on low-powered platforms). The general term for this technique is 'imposter', its also used in full 3D games to draw things that are very far away. Partial or fully-3D systems also make advanced lighting and other effects more straight-forward, which is another reason those systems are more popular today than those based on 2D sprites.

I'm working on something similar (2d isometric rpg, but with very simple pixel art) and planned to have a naked version of characters and various pieces of stuffs like armors and weapons to draw after the base sprite. I hope it works, also because it's not likely for a one man (or even for a small team) to produce all that amount of graphics.

The Above Comments sound a little Complicate. Although have not done this recently I have done The Sprites and added Different Clothing at run-time.

A flat 2d game can get away with having a skeleton of sorts, and just drawing the piece of armor onto the person at the skeleton spot, or even not a skeleton but just marking each frame of animation, eg the helmet should be centered at 0,0 on frame 1 of the walk animation, 5,0 at frame 2, then you would just draw the default person, then draw the helmet after that, on top of the person. (or if the helmet completely replaced the person's head, just draw the pieces.)

This is very close to what I did. Here is where I differred and I hope I explain this correctly.

• At Run-time I created a Blank Sprite Sheet with No Images for each Player Charactor (PC)
• Next I Copied The Base Charactor Images ( Sprites ) on the Blank PC Sprite Sheet. Now I have a set of Sprites for each PC
• Now I Selected What Clothing Options I Wanted Then overlayed those sprites onto The PC Sprite Sheets
• I Continued This until my PC was ready to go adventuring.

Of Course each clothing / Armor / Weapon Sprite Sheet had to have the Same Animations as the Charactor Sprite. I Saved the new Sprite Sheet with the Charactor's as the file name and would load that sprite sheet at run-time to use as my animations. Thus controlling only 1 set of sprites for each charactor during the game.