The Magic Illustrator Script – Ai to iOS & Android

 

Create retina assets for iOS and Android in 1 click with this Illustrator Script

 

Here is an Illustrator script for designers who use Adobe Illustrator to create iPhone and Android Apps. It exports your art boards in all needed sizes with the right names and folder management. Name your Ai file correctly (say “Project”)  as well as your art boards (say “VisualHomescreen”). When you run the script, it will export iOS files in a folder under the name: ProjectVisualHomescreen.png | For the Android files, it will create three different folders (one for each resolution) and name the files: project_visual_homescreen.png.

How to install

If you place the script in the Adobe Illustrator CS5/Presets/Scripts folder, the script will appear in the File > Scripts submenu.
If you place the script in another location on the hard disk, you can run the script in Illustrator by choosing File > Scripts > Browse.

How to use

Choose the folder where you want to save the files.
Optionally you can add a suffix to the files.
That’s it, all files will be saved with the appropriate names.

Notes

Locked layers visibility will be ignored and they will not be exported. This can be used to keep global layers visibility, like a background, or guide layers from being exported. This script is an improvement of Herkulano‘s script.

Click here to download the file

Comments (16)

  1. Hi, I’m very excited to try this out, but before I download, one question first. Does it include iphone 5, and android ldpi? If not, can it be added? Could I edit the script?

  2. Great script – really useful and saves me so much time.

    One question – i have an ai doc with 2 art boards (active and on-tap state). Each art board has two elements (a background and an icon contained within), but they are all on the same layer. On using the script, only the background is exported. The layer is not locked.

    What am I doing wrong?

    • Hello Matt,

      Illustrator exports artboards only. You have to place each assets on a separate artboard and let the magic happen. I usually convert my elements into symbols to have a seamless update. Tip: use a rectangle shape with no fill or stroke to cover a bigger area or center your asset inside the symbol. Best.

  3. From what I’ve seen I’m pretty pleased with what I saw. I’m new to this iPhone stuff I’m catching on pretty quick and I’m liking it a lot thank you!!!!

  4. Hi! I´m a noobie about icons and exporting. So, I have a task where I need to make a icon and save the assets for iOS and Android. I wonder, because I still don´t understand this, this will export the needed files for the icons display correctly in any device Android (mobile and tablet) and IOS (Iphone 4, Iphone 5, retina display, Ipad, Ipad retina display) ?

    Thanks in advance for helping an such an ignorant man in this field 🙂

    • Hi Ricardo,

      Yes, it will do what you think it does. You just need to have your icon on different artboards.

  5. hello, wonderful work.
    One question: is it possible to export layers on a single artboard as different .png files?
    I have different icons on a single artboard and would like to export them separately.

    Thanks in advance!

    Mat

  6. Hey love the script! Saves me a ton of time.

    There is only one thing I do not like about it and that is it exports every
    slice so it does the art and the white chunks in and around the art board.

    Thats the only flaw I see, buts its spectacular!

Leave a Comment