This is a walkthrough for making interface art for FreeSpace2. It should come with all the interface templates you'll need. I use Corel's graphics programs, not Adobe's, so if you do, you'll have to translate what I say into your program's lingo. You'll need both a pixel-based graphics program and a vector-based one to do everything in this tutorial as I do it. If you don't have a vector-based program, making the shield bubble for your shield ani will be harder, but not impossible. You'll have to figure out how for yourself, though.
With practice, you should be able to get the entire process here down to about a 35-minute job. I've typed in excruciating detail, but don't let the mass of words put you off. Writing a tutorial for interface art is rather like writing out the method for tying shoelaces. If you've ever tried that, you'll understand.
Interface at a Glance:
- Size of Pic for Loadout Overheads:
- Resized to fit template.
- Settings for Shield Ani Fighter Image (prior to pasting into shieldReshef0000.pcx):
- Brightness eyeballed to match that of shieldReshef0000.pcx using Brightness, Contrast, Intensity adjustment.
- Max height of 78 pixels.
- Settings for Icon Frames:
- icon0004: same brightness as shield ani picture, 28*32 pixels, green background.
- icon0005: icon0004 > gamma adjusted to 0.60 (except for the green background)
- icon0003: icon0005 > colour balance adjusted to orange (except green background)
- icon0002: icon0004 > colour balance adjusted to cyan (except green background)
- icon0001: icon0002 > brightness adjusted down -17 (except green background)
- icon0000: icon0001 > brightness adjusted down -17 (except green background)
Getting the Image:
- Open the model in ModelView32. (Alternatively, use your rendering program.)
- Set the background to a colour which contrasts well with the colouring of the ship.
- Position the ship in ModelView32 such that you have a top-down view with the nose of
the ship pointing to the top.
- In the Submodels tab, select only the fighter's hull so that the thrusters are not visible,
and take a screenshot.
In the case of bombers with turrets (which count as separate submodels), things get more
complicated, but you should be able to figure out how to put together two images into
one easily enough.
- Open the screenshot in Photo-Paint as a new file. This will be our base image.
Making the Loadout Overheads:
- Using the Wand tool (or equivalent colour-based mask selection tool in your graphics
program) set to no anti-aliasing, zero colour tolerance and subtractive selection, click on
the background colour surrounding the image of the fighter. This will leave only the
image of the ship itself selected, like so:

- Open LoadTemplate.pcx and 2_LoadTemplate.pcx and remove any unnecessary weapon
bank slots from those images.
- Copy and Paste as New Object* into 2_LoadTemplate.pcx. Pasting as a new object is
important, as it allows you to easily resize the image to fit the space available. Do so.

(Resized down:)

- When everything looks great, convert the image to 8-bit format (i.e. 256-colour paletted
mode) and save as 2_Load<Fighter>.pcx. When you convert to 8-bit, you will probably be
asked if you want to flatten the image (i.e. combine all objects with background), and
you should say yes to this.
- Repeat the above process with LoadTemplate.pcx for the low-res version.
Making the Shield Ani (Part 1):
- Return to the base image. It should still have its mask selection only around the image of
the fighter itself, but if it does not, make it so. Now, convert the base image to 16-bit
grayscale mode (not 8-bit!).
- Open shieldReshef0000.pcx. We will be using this file to compare brightness levels
with.
- Crop the base image to selection. (This is why it was important to ensure that the
fighter only was selected, and not the background.)
- Use the Brightness, Contrast and Intensity dialogue box on the base image to
get your grayscale image of the fighter to the same brightness levels as the image of the
Reshef in shieldReshef0000.pcx. Use your eyeball to measure this.
I usually turn the brightness and contrast settings both up to 50, and then fiddle more
from there. Because the Reshef itself was light in colour, 39 worked for it. Keeping the Brightness and Contrast values equal produces the best results. Alternatively you may use Gamma Adjustment instead of BCI, but the
effects tend to be more washed out as compared to BCI's sharp images. I recommend
Gamma only for darkly coloured ships.
- Invert the mask, use the fill tool to turn the background 100% black, and then invert the mask back.
- Resample the base image so that it is no more than 78 pixels high. This will give space above and below to work with in adding the shield bubble. (In the Reshef's case, we will make it even shorter because it is so wide.)

- Copy and paste the newly shrunken base image into shieldReshef0000.pcx. This is important! It is
imperative that you use exactly the same colour palette as shieldReshef0000.pcx, or the
final ani will look horrible on the HUD in Freespace. The easiest way to ensure this
works out properly is to paste into an already existent image which contains the proper
palette. The Dithering prompt which comes up when you paste from the base image into
shieldReshef0000.pcx will ensure that everything gets worked out nicely, so when it
asks, say that you want to use Error Diffusion dithering.
- Save shieldReshef0000.pcx as shield<Fighter>0000.pcx. Then select the whole image
and copy it to the clipboard.
Making the Shield Ani (Part 2):
- Open CorelDraw (the vector based companion of Photo-Paint).
- Paste the image of shield<Fighter>0000.pcx from the clipboard into CorelDraw.
- Zoom in on the image (it'll appear quite small on the page at first).
- Create a shield bubble around the image of the fighter.
Making the Shield Ani (Part 3):
- Returning to Photo-Paint, paste the shield bubble from the clipboard into
shield<Fighter>0000.pcx. It will again ask you about dithering. Again, tell it to use the
Error Diffusion.
- Use the Freehand Mask Selection tool on Additive mode to select areas of the shield
bubble to delete so as to divide it into quadrants. When everything looks nice and
symmetrical, delete them.

- Now use the Freehand mask tool to go between the lines you just created in the shield
bubble and isolate the top quadrant from the other three. Delete the other three and then
EXPORT the image as shield<fighter>0001.pcx. DO NOT HIT THE SAVE
BUTTON!!! Saving will lose all the previous undo list, and your other three sections will
be gone forever. By exporting instead, your actual image sitting in front of you remains
unchanged: only a copy of it has been saved as shield<fighter>0001.pcx.

- Press the Undo button to restore the deleted three quadrants, and then repeat the process
of the previous step with the other three quadrants. The right quadrant is
shield<fighter>0002.pcx, the bottom quadrant is 0003, and the left quadrant is 0004.
- Use AniBuilder32 to compile these images into shield<fighter>.ani.
Making the Selection Icon:
- Return to our base image in Photo-Paint, which should be in 16-bit grayscale and
should have been cropped to the size of the fighter image itself, and convert it back to
24-bit RGB colour.
- Clear all mask selections. Failure to do so now is likely to produce green flecks around your
icon in the final file, so do it!
- Resample the image to dimensions not exceeding 32*28 pixels.

Usually, the height is the
important dimension here (but in the Reshef's case it is the width). Most likely, to get the one dimension down to the right size, the other will becomce too narrow. E.g. To get the width down to 32 pixels, the height becomes less than 28 pixels. We'll fix that next.
- Increase the paper size of the base image so that its dimensions are exactly 28*32
(leaving the image centred). The difference between resampling and changing the paper
size is this: resampling stretches or squishes the image into a specific size, while
changing the paper size leaves the image itself alone and just adds or removes pixels
around the outside.

- Double-check that there is currently no mask selected, then use the Wand tool, still set to
zero colour tolerance and no anti-aliasing, to select all the black background that
surrounds the fighter image (don't select any of the 90% or 80% black, etc., that is at the
edges of the fighter image--we want to keep those parts). Fill this selection with pure
green.

- Invert the mask so that the fighter image is selected (i.e. not the green background).
- Export the file as icon<fighter>0004.pcx (we'll convert it to 8-bit later)
- With the fighter image selected, adjust the gamma down to 0.60. Export as
icon<fighter>0005.pcx

- With the fighter image still selected, adjust the colour balance to 100% red on the cyan-red slider and to 100% yellow on the yellow-blue slider in the Colour Balance dialogue
box. Export as icon<fighter>0003.pcx

- Press Undo twice to return to the state of the image when we exported
icon<fighter>0004.pcx.
- With the fighter image still selected, adjust the colour balance to 100% cyan on the cyan-red slider. Export as icon<fighter>0002.pcx

- With the fighter image still selected, adjust the brightness down -17 in the Brightness,
Contrast and Intensity dialogue box. Export as icon<fighter>0001.pcx

- With the fighter image still selected, adjust the brightness down another -17 in the
Brightness, Contrast and Intensity dialogue box. Export as icon<fighter>0000.pcx

- Close the base image without saving. We're done with it.
- Open all of the icon<fighter>000*.pcx files we just made. Convert them all to 8-bit at
once using the Batch tab under the Image > Mode > Paletted (8-bit) menu option, and
save. Doing them all at once in a batch process ensures that they will all be converted to
the same palette, which is important. Converting each one individually to 8-bit will give each one its own separate palette, which will make a horrible mess in the end.

- Compile icon<fighter>.ani with AniBuilder32.
- Check to make sure frame 0004 doesn't have any unwanted orange pixels. Sometimes
AniBuilder screws up the image a little bit here. If it does, save the frame as
icon<fighter>0004.pcx, reopen it in Photo-Paint and paint the orange pixels gray again.
Save, and recompile.
Making a One-Frame SS Ani:
- We need a new base image, so go to ModelView32 and position the fighter at
XRot:30.00, YRot:330.00. Make sure only the hull submodel is selected and not the
thrusters. Take a screenshot
- Open the screenshot as a new file in Photo-Paint.
- As at the beginning with the last base image, deselect the background colour using the
Wand tool on subtractive mode with zero colour tolerance and no anti-aliasing. This will
leave you with just the image of the fighter selected.
- Copy the selected image of the fighter, and paste it as an object into 2_slantgrid.pcx.
Resize the fighter to fit nicely over the grid, convert to 8-bit, and save as
2_ss<fighter>0000.pcx

- Either repeat the above step using slantgrid.pcx, or simply resample
2_ss<fighter>0000.pcx to the dimensions of 350*230 and save as ss<fighter>0000.pcx.

- Compile both images into anis.
You're done!
* If your graphics programs doesn't have this functionality 1) slap yourself and go buy
Corel Photo-Paint, and in the meantime 2) resample the image downwards until it has the right
dimensions, and then paste that in.