2

I want to make a set of icons for android phones. The guide has a set of recommendations for the denstiy and sizes link to recommendations. What is an efficient manner to go about producing these exports from Adobe Illustrator?

Considerations are that I would have to save-export to png and then change the preferences each time. Is it possible to open of artboards with different configurations? Or have tabbed template images where I can copy images from one tab to the other in a direction of less detail?

2 Answers 2

1

The proper way to do it IMO is to use separate artboards for the different sizes. You can create a template with artboards for all the standard sizes, guides for the margins and all the shared styles you want to use.

Then simply create the icon at the highest resolution and copy it to the smaller artboards and clean them up for the lower resolutions. Alternatively, you could create the original icon for a middle resolution and then adapt it to the larger (add details, reduce stroke weight) and smaller (simplify design, increase stroke weight, increase counters...) resolutions. This part has to be manually done since you can't just use the same icon design for 36x36px as you would for 96x96px.

When you're done, just export as PNG and check the "Use Artboards" box and it will export each artboard as a separate PNG file.

4
  • yes, using different sized artboards and saving them as a template is very intelligent; thanks. So I put the image created on the 96x96 artboard, and the next size to do is 72x72. But then is the issue of scaling it and placing it appropriately on the smaller artboard. How do I scale it from a 96x96 to 72x72 and align it exactly as the larger image?
    – Vass
    Commented Feb 25, 2012 at 11:11
  • 1
    @Vass: If your icons are exactly the size of the artboard then just scale it down till it snaps to the artboard. If you're making them slightly smaller so you can add a drop shadow, then that's what the template margins are for. Your icon's max dimension should be a perfect fit for the margins. If the width of height is less than the margins, then just use the vertical/horizontal Align to Artboard button from the control panel. Commented Feb 25, 2012 at 11:52
  • 1
    Another way you could do it is to include a transparent container that's the same size at the artboard. If you group the icon with it, then you can scale your icon down and ensure the margins are identical. However, you don't always want the margins to be identically proportioned at all sizes. Commented Feb 25, 2012 at 11:58
  • I am using the second approach as the Align to Artboard does no action. And what is strange is that some of the proportions of the objects change, eg. font size to the drawing size. I just use snap to point as I manually rescale the size of the group of objects that I copied from the large artboard. I words ok for a start other than the objects being slightly disproportional and the not snaping to the artboard boundary. (thanks!)
    – Vass
    Commented Feb 25, 2012 at 12:54
1

To be honest, I would create the icons in Photoshop. You can save each icon as a layer comp, and then use file > scripts > layer comps to files.

Or, as you create them in illustrator, save them to a photoshop document, and use the same layer comp technique.

Could be an alternative solution for what you're trying to accomplish.

Good luck!

1
  • 1
    thanks, a friend of mine recently told me something similar. He said that photoshop is better for this. I will look into it soon.
    – Vass
    Commented Jun 6, 2012 at 10:38

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.