Tutorial; Badges - HWRM/KarosGraveyard GitHub Wiki

See this HWRM guide: How to use custom badges.

The Homeworld 2 information below is depreciated, but may still be helpful. These tips can be applied to the creation of other game images, as well.

How to Create Custom Badges by Starfisher, Malignus, Wolf359, and Mikali

Welcome to the badge tutorial for HW2. Making a badge is a very simple process. Having done it once, you will be able to churn them out like some similie I can't even imagine.

Here's a quick, general run-down of what properties a badge must have. Hopefully you can figure it out with whatever program you use.

Requirements

  • Image must be 64x64 pixels.
  • Image must be either a 24 or 32-bit Targa (".tga").
  • To use transparency, image must have an alpha channel and be 32-bit.
  • Image must not be compressed.
  • In the alpha channel, black is transparent and white is opaque - any value in between is partially transparent.

Photoshop 7 by Starfisher

This assumes you have an image you want to import into HW2 as a badge. I show how to make part of it transparent; if you don't want transparency, do Step 1 and then skip to the saving out steps.

  1. Open the file.
  2. Erase the parts that you want to be transparent. You want to make sure that the checkered background is showing in these areas.
  3. In the menu bar, select Image > Image Size... Make sure Constrain Proportions is unclicked, then change the two boxes under Pixel Dimensions to 64. Click Ok.
  4. All that's left is to save out the image in the proper format. To do this, go to the menu bar. File > Save As.... Save the file as a Targa (".tga") with 32bits/pixel resolution, in the folder "C:\Program Files\Sierra\Homeworld2\Bin\Profiles\Badges".

Paint Shop Pro 7 Thanks directed at Malignus

Doing this in PSP 7.02 is a cinch.

  1. Make your image and select the part of it you want to be transparent using the magic wand. Then use Selections > Modify > Expand a couple of pixels to make sure you get all of the empty space, then hit Selections > Invert.
  2. You should now have selected everything solid (i.e. non-transparent) that you want to include. Click Selections > Save to Alpha Channel.
  3. Resize the image to 64 by 64 pixels. Then save the image as a 24-bit, uncompressed ".tga".

Supplementary PSP 7 Info From the PSP 7 help file on adding an alpha channel.

"Use the Save to Alpha dialog box to save a selection to an alpha channel. To open the dialog box, choose Selections > Save To Alpha Channel. This command is available only when the image contains a selection.

Using the Save to Alpha Dialog Box

  1. When the dialog box opens, the filename of the image appears in the Available Documents box, and the selection is displayed in the Preview box.
  2. In the Available Alpha list, double-click New Channel, or highlight New Channel and click Ok. The New Channel dialog box opens.
  3. Type a name for the new selection.
  4. Click Ok. Paint Shop Pro saves the selection to the alpha channel and closes both dialog boxes."

Paint Shop Pro 4 by Mikali and Malignus

This is slightly different than using Paint Shop Pro 5 and above.

  1. Make your image and select the part of it you want to be transparent using the magic wand. Then use Selections > Modify > Feather a couple of pixels to make sure you get all of the empty space, then hit Selections > Invert.
  2. You should now have selected everything solid (i.e. non-transparent) that you want to include. Click Masks > New > From Selection.
  3. Resize the image to 64 by 64 pixels. Then save the image as a 24-bit, uncompressed ".tga".

Paint Shop Pro 3 by Mikali and Malignus
Note: the demo version of PSP 3 doesn't expire or change any registry settings.

This is slightly different than using Paint Shop Pro 4.

  1. Make your image and select the part of it you DO NOT want to be transparent using the magic wand [I can't figure out how to feather or invert selections in PSP 3]. Click Image > Add Mask > This Window. Check the Current Selection option.
  2. Resize the image to 64 by 64 pixels. Then save the image as a 24-bit, uncompressed ".tga".

The GIMP Thanks to Wolf359

The Gimp is a freeware image editing utility, originally created for Linux, and then ported to Windows.

  1. Get The GIMP.
  2. Find some image you want to use; in my case I used logos I could find from old/defunct sports franchises.
  3. Now preferably you have an image with a white or otherwise constant background. I'll assume you want to take that out and leave yourself with just the central image to work with.
  4. Drop the image into the GIMP. You'll see the GIMP menu with the headings File, Xtns, Help and so on. The image will be in a seperate window. First thing to do is to right click on the image, scroll down to select, and choose the by color... option. This will open another window that will probably have a completely black image displayed. Move the cursor over the white (or the background, whatever color it is) to select that color. This will highlight only the portion of the image that has the color you clicked upon. If this is the color you want to delete, continue on. If not try again until you've selected what you want to erase.
  5. Now, close the select by color window and return to the image. Right-click on the image and scroll down to the Layers menu. Choose the add alpha channel option. This will prime your selected background colors for removal.
  6. Once you've added the alpha channel, right-click on the image again and scroll down to edit-clear. This should have the effect of deleting the background color, allowing you to see the checkerboard (transparent) background behind your image. Now select the select rectangular regions tool from the GIMP menu and click on your image. This will take the selection off.
  7. In my case I had some trouble getting my images to face in the right direction when applied as a badge. To fix this its necessary to rotate and flip the image. To rotate your image, right-click on the image and scroll down to the Image menu, then to Transforms, then to Rotate, and finally select 180 to flip the image on its head. Now, to flip on the horizontal plain (usually necessary to avoid a "mirror" image), right-click on your image and scroll down to Tools > Transform Tools > flip. This will change your cursor to a horizontal line with two arrows at either end. Left-click anywhere on your image and move the mouse to the right. This will flip the image horizontally for you.
  8. Now, since HW2 chokes on indexed color images (and yours might be one), right-click on the image and scroll down to the image menu. Scroll to the mode option and you'll see several options: RGB, Grayscale and Indexed. You want your image to be RGB, so if the option is available, select it. If it is not, go to the View menu and select Image Info. If it reports your image is an RGB image of at least 24 bits, you're fine. This is important to remember. Your image needs to be 24/32 bits and RGB for it to work as a badge.
  9. Now that the image is ready, we can shrink it down. Apply some blurring (if you wish) and some transparency.
  10. To shrink the image, right-click on it to bring up the menu. Scroll down to the Image menu and select the Scale image option. In the upper part of the menu, you will see several text boxes. Below the first set, labeled New Width and Height, are two other boxes called Ratio X and Ratio Y. To the right of those boxes is a small chain link. Click this link and see that the chain is broken. This will allow you to select any size and not have the CPU keep the aspect ratio the same. Now in the New Width and Height boxes, type in 64 for both. Once you're done, close the window to the Scale menu.
  11. Now, it helped me to blur my image some before shrinking it. When you do the blurring, it does not matter much, but blurring will help make sure your badge doesn't have sharp, jagged edges. To blur, what I did was I right-clicked on the image, scrolled down to the Filters menu, selected the blur menu and selected the Selective Gaussian Blur option. I usually leave the settings alone and apply the blur. This component is optional.
  12. Once your image is down to badge size, it helps to add some transparency to the image so it won't completely cover up the markings on the Mothership (or whatever ship it's applied to). This adds to the realism. First, right-click and scroll to the Layers menu. Select Layers > Channels > Paths. This will open a new window. All you really need to do here is click the Keep Trans Box first. Then you'll notice the Opacity slider. Edit this slider to the desired level. I usually set it to 80. Once you're done, close the Layers Channels and Paths menu.
  13. Now it's time to save. Right-click your image and scroll to file, save as. With the menu open, select the path you want your file to be saved in. Also, be sure to choose the ".tga" extension in the Save Options area, where it says Determine File Type. This will change your image name to "image.tga". You're nearly done. When you hit save, the program will give you an option to Export your image. If you do NOT get this option, your image is probably not in RGB format and you need to try again. The box will say something about needing to merge visible layers. Go ahead and export. Then, another menu will come up with two radio boxes and two options labeled RLE Compression and Origin at Bottom Left. I usually unclick both and hit ok.

Now you have a badge ready to go. Probably not the most simple thing in the world, but it works. The two most important things that will aggravate you in this process that you should avoid are:

  • Remember to make your image an RGB image. Indexed color wont work
  • Be sure to unclick the chain relating to ratio size when resizing your image. You don't want to end up with a 69x64 or 64x67 image that looks right but won't work.

Anyway, I do hope this helps anyone needing to create a badge in the GIMP, good luck.

Other Programs

Freeware

  • Descent III Logo Maker create and edit images and transparency by hand.
  • Transgen auto-generate transparency in a ".tga" image from pixels with an RBG color-value of 255, 255, 255.

Multiplayer Map Thumbnails

If you are creating multiplayer map thumbnails, follow the steps above, but make the image 512x512 pixels. Only fill the top left 360x266 pixels. Leave the rest blank. You can then convert the ".tga" to a ".rot" using Spooky's ROT Viewer. For further details, see Section 11 of Malignus's Mapping Tutorial.

Conclusion

The next time you fire up HW2 and use the profile maker, you should see a new badge. If you see a weird error message or the background is messed up, you forgot to follow one of the steps above. Try again.

Addendum

For additional assistance, view this thread over at RelicNews.

Related Pages

Tutorials

The Badge Tutorial (Pics) Updated: 9/14

Additional Help

Comments

Page Status

Updated Formatting? Initial
Updated for HWRM? Initial