Geeks With Blogs

News

Google My Blog


Murray Gordon Flash a-ah! Savior of the universe...
Here's how you do it:

  1. Open your logo in Illustrator. Make a box that has transparent fill and stroke around the logo. Make it around 0.25” wider and taller with the logo centered in between.
  2. Copy everything and go to Photoshop.
  3. Make a new document. Photoshop should make the new document exactly the size of your logo. Make your resolution 288 pixels per inch.
  4. Paste. If there’s a background layer throw it in the trash. Your logo should appear on a transparent layer. Save as a GIF with transparency. Or save as a PNG with transparency (though that didn’t seem to work once it was sent: I reopened it here and it was fine, though).

The reason you make the box is so that you get even anti-aliasing (the softening of the edges to keep it from being jagged) all around the logo. If you didn’t make the box the outermost parts of the logo would have straight hard edges while everything else would be anti-aliased (the default). The reason you change the resolution from the default 300 or 72 pixels per inch is that raster images are built in grids and shrink and enlarge best in squares of 2 (2, 4, 8, 16...). One quarter of 288 is 72. You’ll get the best fidelity this way if you have to shrink the logo.

IF the logo doesn’t paste into Photoshop with its clear area from your box, do this:
  1. Make a small square 0.25” to the left and above your logo and another 0.25” below and to the right. Fill them with black or red, but not white or gray.
  2. Same as above.
  3. Same as above.
  4. Paste. Now use the marquee tool (M) to select your black/red squares and delete them. The rest is the same.


You use black or red because it shows up against the checkered background. Make sure you fully delete them; there could be faint anti-alias edges on them if you get too close.

There are a couple other ways you could go as well. You could use an application like Axialis IconWorkshop 5.1 (www.axialis.com). This is a great tool for creating great icons for your apps. You can generate ico, gif or png files at any of the various sizes you might need. (i.e. 16x16, 24x24, 32x32, and 48x48).

That's great for custom icons, but personally I like to go with pre-built icons and imagery that you can purchase. I purchased a complete Windows XP look and feel packs of icons from Icon Galore (www.icongalore.com). The package comes with all the original images built to gif, png and ico in all the standard sizes and they look awesome. I think this is the way to go. They can also create icons for you, but that costs more money, but it will probably be quicker than doing it yourself. You can do your own time value of money calculation. Personally, my time is better spent coding or architecting than designing icons. ;-D

Hope this helps someone out there.

This is another installment of the “How I wasted my time today“ series of Blogs.

Cheers,
Murray

 

 

Posted on Wednesday, November 16, 2005 3:16 PM | Back to top


Comments on this post: How to make anti-aliased Icons and Images for your windows apps

# re: How to make anti-aliased Icons and Images for your windows apps
Requesting Gravatar...
More icons visit
http://www.regimages.com
Left by Regimages on Feb 01, 2007 1:47 AM

# re: How to make anti-aliased Icons and Images for your windows apps
Requesting Gravatar...
Guiicons offers Professional XP icons and Vista icons,We make royalty-free stock icons for commercial manufacturers.
http://www.guiicons.com
Left by ICONS on Apr 06, 2007 11:02 AM

Your comment:
 (will show your gravatar)


Copyright © Murray Gordon | Powered by: GeeksWithBlogs.net