Mobile app version of vmapp.org
Login or Join
Lengel450

: How can I export an image from Illustrator image at multiple sizes? I am new to Adobe Illustrator and I have a logo image which I need to use in 5 or 6 different sizes. The logo image

@Lengel450

Posted in: #AdobeIllustrator #Export #Pixel #Ppi

I am new to Adobe Illustrator and I have a logo image which I need to use in 5 or 6 different sizes. The logo image was created in Adobe Illustrator, but when I try to save the image to PNG or JPEG what should have been simple turns out to be very complicated.

I understand that Adobe Illustrator wants to treat the image as a certain size, and then wants to multiply that size by a pixels per inch scale factor to result in the actual number of pixels that it saves. It has a few limited scale factor choices which give a very limited set of resulting output pixel sizes.

However for many web uses the user already knows the output pixel dimensions that are needed. Is there a way of just specifiying either the pixel width or height of the saved graphic which is needed?

I have seen suggestions to export the image and then use Photoshop to resize it, but that results in a poorer image quality vs. creating the final image from the vector image.

10.05% popularity Vote Up Vote Down


Login to follow query

More posts by @Lengel450

5 Comments

Sorted by latest first Latest Oldest Best

 

@Jamie315

An addition to this subject which I found intresting for mobile app designers, is this script that creates retina assets for iOS and Android in 1 click.

10% popularity Vote Up Vote Down


 

@Phylliss782

When I need to support multiple pixel sizes I dupe and scale the art within the same AI file. Each size goes onto a separate correctly sized artboard. I append the board name with the file format to be exported. Then I run a jsx that exports each artboard and picks up the file format from the name, using the last settings I entered for that format in that file. This is all in CS5.

I use this workflow for some logos, icons, and display ads.

10% popularity Vote Up Vote Down


 

@Sims5801359

You can also create a document of the appropriate size in Photoshop (or box out an area with guides) then File > Place the vector art.

You can scale the size of the shape before it is rendered. Obviously scaling after that will reduce its quality.

I've always used this technique for logos in order to give precise control over size, eg getting the baseline of the logo's text elements on a pixel boundary (a form of hinting).

10% popularity Vote Up Vote Down


 

@Pierce403

Using File → Save for Web and entering the dimensions will do what you're after. Also, Illustrator uses vector scaling, so the results are better than if you tried the same thing in Photoshop — entering dimensions that don't match the document in Photoshop means the image will be bitmap scaled.

Please note that you have to click Apply after changing the dimensions, if you're using a version of Illustrator prior to CS6.



Oh, and there's a very good chance you'll want Convert to sRGB turned off — it destructively converts your image from the current colour space to sRGB, making colours shift.

10% popularity Vote Up Vote Down


 

@Caterina889

File > Save for Web and then enter the pixel dimensions by clicking the Image Size tab on the right of the Save for Web window.

Or am I not understanding you correctly?

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme