You can find pictures in a lot of different places. Internet, of course, which is a great source (for Star Wars pics, I recommend TF.N's Multimedia section). With the help of a scanner, you can of course be more selective and have exactly what you want. Finally, you can make screenshots of 'Behind the Magic' or 'Episode I Insider's Guide' from Lucasarts, or even from the Quicktime movies from www.starwars.com, using HyperSnap, for example.

For this tutorial, we'll work on two pictures and make icons out of them.

Let's start the work on our pictures. First, open the pic you want to turn into an icon (Ctrl + O). Now you must try to find the relevant. What is going to be in the icon frame ? Let's examine our two pictures. I've framed the possible icon 'subjects' in yellow, and the relevant one in red. All frames are squares.

Photoshop 6.0 offers a new tool, 'Crop', you can use it to reduce your pic to the relevant only. This step isn't necessary, but it helps later. Hit 'C' on your keyboard to select the Crop Tool, and drag and drop on your picture while holding the Shift key, in order to get a squared frame. Once you created it, you can resize it (hold Shift key to keep it squared) or move it. The validate with Enter, and the picture will be cropped to the frame you selected.

Then comes the extracting process. There are two cases that can happen. With our nasty beast, we'll study the first - easy - case, and with Palpatine, the second - harder - case.

You can see that the nasty beast has a plain background, well contrasted with the subject. That makes the extraction really easy. Activate the Magic Wand Tool (hit 'W'), and click on the background. The background is select. Now invert the selection (Shift + Ctrl + I), and voilą the subject is selected.

For Palpatine, the process wil be slightly longer and harder, since the background isn't uniform, and the Magic Wand Tool selects only uniform surfaces. First, you have to activate the Pen Tool ('P'), and then create points around the subject in order to select him entirely. Create as many points as required to get him correctly (see picture below). Don't forget to close the path you just created by clicking on the first point you added, once you're added all the needed points. Then, in the 'Paths' window (see picture below), Ctrl + click on the 'Work Path'. That will turn the path you drew into a selection, and the subject is now selected.

Select the Move Tool ('V'), click and hold within your selection in the original pic, and drag and drop it in the 'icon' document you just created.

The picture's in, but probably hasn't the right size. Active the Free Transform mode (Ctrl + T), and resize the pic so that it fits the icon frame (hold Shift while dragging to keep the right proportions).

Once this is done, you can close the original file. Save the icon file as a .PSD file.

When you reduce a picture, some bluring happens. But the icon can be sharpened to look crisper - and thus better.

You can either use a standard sharpening (Filter -> Sharpen -> Sharpen), or a more precise one - with adjustable options (Filter -> Sharpen -> Unsharp Mask).

You may choose 'Sharpen More', too. It applies 'Sharpen' twice. But usually I only use 'Sharpen' once. Because if you overuse Sharpen, the pic will look wrong (try with a picture, you'll see what I mean).

For our two icons, I used 'Sharpen More' on the first one, since the original pic wasn't really sharp, and 'Unsharp Mask' for Palpatine, since 'Sharpen' wasn't enough, and 'Sharpen More' was too much.

To adjust the levels, you just have to slide the three small cursors under the chart - called histogram - and that will affect your picture. It is hard to describe how it really works, so you should try by yourself to understand it. But don't worry, it's quite natural.

Another very useful option is Variations (Image -> Adjust -> Variations). On a single window, you can visualize and apply a very precise adjustment of all the color and brightness nuances. Use the Fine/Coarse slider to change the intensity of the changes. So for example, if the picture has a color mood you don't want, simply click on the opposite icon in the chart (ex blue mood -> click on yellow).

Here, I slightly augmented the contrast - and thus the depth - of the beast, and Palpatine was clearly too dark, so I lightened him a bit.

Eyedropper : use the Eyedropper Tool ('I') to get a specific color as your brush color.

Brush : use the Brush Tool ('B')  to draw individual pixels.

Eraser : use the Eraser Tool ('E') to render individual pixels transparent.

Blur : use the Blur Tool ('R') to blur zones of the icon.

Sharpen : use the Sharpen Tool ('R') to sharpen zones of the icon.

Smudge : use the Smudge Tool ('R') to spread the 'paint' in the direction of your move.

Dodge : use the Dodge Tool ('O') to brighten zones of the icon.

Burn : use the Burn Tool ('O') to darken zones of the icon.

Stamp : use the Stamp Tool ('S') to duplicate zones of the icon. Use Alt + click on another part of the icon to define the source zone first.

You can change the parameters of all those tools in the main tool bar, under the menu bar. That way you can set the intensity of their effect.

The nasty beast didn't need any refining, but there were I few things I didn't like with Palpatine, so I edited it.

You can do a background in two different ways. You start it from scratch, or you use an existing pic.

From scratch, you create a new layer under your subject, draw a basic shape, and then, using the Layer Effects, you create relief and texture. But I will not expand on this here, since this technique is generally getting results not as good as the other technique, and it usually require a deeper knowledge of Photoshop.

Now, the use of an existing picture. When choosing it, keep in mind the few different points :

  - You have less space left than for the subject, so don't try to choose a background element that is too big.

  - The background is a way to add depth to your icon, so you must bring contrast to achieve that effect. Use cold colors (blue, green)  under warm colors (red, yellow), and vice versa. For example, using red under the beast here would be a good way to spoil the icon.

  - Try to choose an appropriate background in relation with the subject, it usually makes a better icon.

The extracting process is generally easier, since a rectangle background is usually the best solution.

Use Levels before dragging the picture on the icon.

The process is then the same : reframing, sharpening, refining.

You will probably have to change the layers order to put the background, well, in the background (drag and drop a layer in the layer window to change it's position - see picture below), and sometimes switch off temporarily the display of the main subject while working on the background (click on the eye icon next to a layer in the layer window to switch its display - see picture below).

Once you've added the background, you may to do some more refining of the main subject, especially on the edges.

Create a new Layer (Layer -> New -> Layer and then OK), and place it under all the layers in the Layers windows. Then in the main toolbox, Set the Foreground Color to Red 211, Green 209, Blue 219. Then activate the Paint Bucket Tool ('G') and click on your icon. And now you have a background exactly like the JC's.

You can go back to some refining on the background and main subject layers - just select the one you want to edit in the Layers window, until your icon looks like you want it to look. The work here mainly consists of editing the edges of the layers.

Once you're done, switch off the display of the JC background layer to get back to the transparent version the icon.

Here, the beast had some 'dirt' - pixels that make the icon look dirty, they're often in white hues - on its edge, so I removed it. Palpatine needed no refining.

Then make sure the the JC background is no longer displayed. Select File -> Save As... and choose  CompuServe GIF in the Format list. Enter the correct filename, and click OK.

Enter the following Settings : Palette : Local (Adaptive), Colors : 256, Forced : None, Matte : None, Dither : None. Then check 'Transparency' if it isn't checked. Click on OK, then choose 'Normal' and click again on OK.

That's all. Your icon is saved and ready to be submitted.