Mobile app version of vmapp.org
Login or Join
Harper654

: Export in multi sizes with illustrator create several icons I designed a set of icons for a website in Illustrator CC. What would be the difference between using Illustrator CC's tool to export

@Harper654

Posted in: #AdobeIllustrator #Icon #MultipleSizes

I designed a set of icons for a website in Illustrator CC.

What would be the difference between using Illustrator CC's tool to export my icons in different sizes (@1x; @2x , @4x ) vs. drawing the actual icon in different sizes ?

Thanks a lot.

EDIT:

Sorry guys, English is not my main language. I wasn't clear enough.

I believe my question was about "size" and not resolution, but I might be wrong. I used (@1x; @2x , @4x ) as it is in Illustrator CC. Exporting in @1x , @2x , @4x in Illustrator means at different sizes not different resolution. Is this correct?

Thanks a lot for your help.

10.02% popularity Vote Up Vote Down


Login to follow query

More posts by @Harper654

2 Comments

Sorted by latest first Latest Oldest Best

 

@Berumen635

Most basically the difference is automation, you save a lot of steps by drawing only one and blowing it up to export.

All icon sizes cannot be generated from one file. A 64 pix icon looks terrible if reduced to 16 pix, and if you design at 16 pix and export x4 you will get a mess.

Between the biggest icon, 256 pix thumbnail, and smallest, 16 pix favicon, you should draw at least 3 different versions with greater complexity and detail at the larger sizes.

10% popularity Vote Up Vote Down


 

@Smith574

Drawing the icons in different sizes also means updating designs in different sizes. When every change means 3 changes, it can quickly get messy and inconsistent.

EDIT:

To make it clear: The @1x ; @2x , @4x exports are usually intended for creating assets for different screen resolutions (72dpi, 144dpi, 288dpi) of the exact same icon design. This is a typical requirement ie. when designing for mobile apps. So a "16x16px" icon for a hi-res screen with 288dpi (@4x) is actually 64x64px but will not look larger than 16x16, just sharper. These export settings simplify the export for an asset generation workflow, but you don't have to use them.

If you want to design different icon sizes, ie. like responsive icons where each size has unique features, or size step requirements do not match the @1x ; @2x , @4x steps, you should draw the icons in the sizes you want to export, on single artboards or slices, however you prefer.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme