Tutorial for creating iPod-style iDoD posters

Copyright by Karim D. Ghantous 2004
Here are the simple steps to creating silhouetted figures on coloured backgrounds in the style of the iPod advertisements.

In the GIMP, load up an image of an American, German or British soldier from the DoD website. They are linked from smaller images in the Info, News and Media sections respectively.
Select the contiguous region selection tool.


Set the threshold to the most optimum level depending on how the coloured areas react to the tool. Click on the background of the image. You can see that this setting (I chose 24) is too strong, as it cuts into the soldier's body too much.


A lower number (I reduced it to 12) gives a nicer result. After selecting an area, cut it away.


Here is what the image will look like after most of the background is cut away. You might have some holes to fill in if your contiguous region selection was too aggressive, but you can just use a pencil point with colour as black (colour matching is not important). Some lone pixels might have to be erased away, too.


If you want to make the gun white, select the region of the image that includes the whole weapon. Copy, then paste the selection as a new image. Colour the background a solid colour that isn't white.


Fill it in white (we'll get back to the white weapon below).


Back to the main image. Now it gets simple. Select Tools->Color Tools->Threshold...


Change the first value to 255.


You should have a silhouette with a white background. Save it as a PNG file (or any other format which supports true colour and doesn't have lossy compression).


Fill the background in any of the iPod ad colours you want.


Here are the hex and RGB values for the iPod colours:
  • Purple: RGB 179 130 219; Hex b382db
  • Orange: RGB 255 186 014; Hex ffba0e
  • Green: RGB 103 201 000; Hex 67c900
  • Blue: RGB 019 121 249; Hex 1379f9
If you want to include the weapon, select the whitened gun with the contiguous region tool and set the threshold to 0. Copy it and paste it into the silhouette image, matching it to fit over the black gun exactly.


In Macromedia Flash, create a movie with the dimensions of the bitmap you just created. Import the bitmap, make sure it's selected and select Modify->Trace Bitmap... Use the settings as shown and modify to taste.


And here is the Flash version. Nice, smooth edges, even though upon closer inspection there are flaws. You can go back to the bitmap and experiment to get the best result for use in Flash.



Back to iDoD