How to design icons for screen usage?

[mistercitizen]

I have an upcoming job which requires me to design a series of icons for screen usage (32x32 pixels). I've had plenty of experience designing icons and logos for print, and would appreciate some tips on the method for designing them for screen.

Is the process just a matter of designing the logos in a vector program, importing them into a 72dpi PS file (32x32 pixels), and then optimising the file in Image Ready? (batch process?)

I would really appreciate some tips on this subject. (especially from someone who has done this before)

Thanks again - you guys rock!

 

[Pixelchik]

It's been a while since I created icons, but you can create your graphic in Photoshop (32x32 pix) and use a program like Microangelo or Icon Easel to import that graphic and create the ICO format. Save the graphic as a BMP first. Or you can create the icon directly in Microangelo or any other Icon creator program. Check Shareware.com for downloads of those applications and others. Hope this helps.

 

[dimoj]

You don't even need to use a third party program or vector software. Create the icon in Photoshop and save as .bmp

Then simply change the file extension to .ico

 

[Manic]

dimoj, can you still get transparant sections in the icons if you do it tht way?

Manic
-----------------------------
I've broken it again !!
-----------------------------

 

[dimoj]

Manic. I just did a couple of tests (XP, Photoshop CS) and if you create the icon straight on the background layer it will treat the background as transparent! Although admittedly you do get a bit a matte around the opaque pixels.

Guess you have to use an Icon editor if you want a really good result for transparency.

Mistercitizen - you can download free icon editors off the net . You can do the whole job in the Icon Editor, you don't need to use PS or Illy at all.

 

[mistercitizen]

Thanks for your tips guys.

I think the final set of icons will need to have som transparency, or at least have a "clipping path" - like appearance (ie transparent background)

Are you able to specify varying areas of transpanrency for different sections with those icon editors?

 

[Manic]

I know in microangelo you can select what pixels you want transparent.

You basicaly set them to the transparency colour (looks pink)

Manic
-----------------------------
I've broken it again !!
-----------------------------

 

[dimoj]

Yes Mr Citizen. I got a free icon editor off Cnet downloads a while back (can't remember what it was called, just search for "icons") and you can simply "colour" any pixel transparent or opaque in the editor. But you can only have on or off transparency like a .gif. No levels of transparency.

 

[mistercitizen]

Thanks for the tips again guys. It is much appreciated.

Does anyone have an idea of how they do the levels of transparency with the icons for Mac OS X?

 

[barehug]

'Icon sushi' is a good icon editor (export your icon as PNG-24 from photoshop).

Moe: It could have been a real ugly situation, but luckily I managed to shoot him in the spine.