AI file rasterization problem!

[bargisy]

Hi,

I'm working on some icons for a handheld device app. and I need to export them in different densities "dpi" and dimensions "pixels" in a png format. So what I did: I designed my icons in illustrator and exported it to photoshop in a high resolution, sliced the icons and used image size command to get my icons in the right resolution and save it as png

My problem is I don't get precise edges the edges gets some opacity variations note that I've tried all the resample algorithms available in image size command

I believe the problem is from illustrator. as it uses a grid to define pixels and some of the pixels falls between tow grids so it's color gets distorted

I've never had a problem like that as I didn't have to worry about the image quality in pixel level! but in this case some icons are smaller than 15pixel

So what do you think?!!

[darkwolf29a]

Your problem is not from Illy. It's from Photoshop, actually. Illy does vector, not raster graphics. The problem will be when Photoshop translates it, most likely. I've seen more Photoshop issues of this type than I have ever seen Illy issues.

[bargisy]

thanks darkwolf29a for the reply You are right, but not completely right because I use Ai to export images in psd format I use PhotShop only for resizing but the rasterization happens in AI ... If anyone have any suggestion for a different technique or workflow to produce many icons in different sizes pleas inform me

[KRB]

bargisy, Welcome to the Café.

Shot in the dark:
What are your image and raster settings in Illustrator?

Not clear of your workflow. Illustrator >Photoshop
Illustrator is a vector program as darkwolf29a stated. Photoshop is a raster app.

Here is CS4 Illustrator’s default.

Hope that helps.

Kathryn

[cfire]

Make a blank psd the proper size and then just 'Place' your AI file in it and you should be good to go.

[bargisy]

thanks guys,

@KRB My raster settings are: 300 ppi. & sure AI is vector and Photoshop is raster app .. but it's all about the output! I used photoshop just because of the image size command so I can export different image sizes with on click.

@cfire are you suggesting smart object exportation? I believe it could be the answer to the problem I'll try it and report back the result.

and here is an image for what I'm talking about this is a bar in the three sizes I'm working on "notice the edges" as the image gets smaller the edges gets fuzzy and blurry


It's noticeable in the application and when it happens to an icon it's a disaster!

[darkwolf29a]

Yes, that is rasterization, that is for sure. It's only happening in Illy because you are forcing psd and rasterization on to Illy. That's not it's claim to fame, so to speak. I've seen the same thing in several of my images.

My answer is not to export to Photoshop. Honestly, I have yet to find something that Illustrator cannot do that Photshop does.

Sure, I use them both, but I understand that when I export over to Photoshop, or vice versa, you will suffer the reasterization curse. There's no way around it, that I have ever seen (Been doing PS stuff since 5.5).

Is there a particular reason you have to move these from Illustrator to Photoshop?

[cfire]

"@cfire are you suggesting smart object exportation? I believe it could be the answer to the problem I'll try it and report back the result."

Yes. Let me know how it works for you.

[bargisy]

@ darkwolf29a the only reason for using this workflow to export the icons in different sizes easily I have a sheet of icons need to export them in png format in different sizes ... and there is no way around rasterization png is a raster format and it's my output!!

@cfire unfortunately smart objects turns out to be not that smart! the same problem

I tried to figure out an automated way for the process but it doesn't seem to work .. or it needs manual enhancement .. my good luck the colors I use are simple black and white and my only problem is with the edges so what I did I rasterized the image twice
1- using "nearest neighbor" algorithm to get hard edged icons and gave it opacity of 70%
2- using "bicubic sharper" on top of it to get smooth gradients and details
so now I got the edges defined by the bottom layer and the details by the top layer
and for the bars I used a black rectangle to define the edges to get it sharp

Thanks guys very much for your help

[Edited on 2/27/2010 by bargisy]

[KRB]

barglsy,

See if this works better for you since you want png format.

Illustrator has
File>Export>png.
In the second dialog box, you have ppi and background options

Edit:
Have you considered saving your file as .eps and keeping it vector? One size will do.
What comes to mind, just last week I had to send off a logo I created in Illustrator.
He does not have any Adobe applications.
.eps file format best fit his needs.

Hope that helps.

Kathryn

[Edited on 2/27/2010 by KRB]