I'm currently working in illustrator CS5 creating 2d game art for iphone, and I'm just wondering about the best way to save the art to still keep the quality but have low memory.

In save for web and devices, I choose .png, but I don't know if I need PNG24 or PNG8

Is there any other way after I save my files this way to reduce the memory? If I should for example use a sprite sheet. I have heard people say texture packer is good, but I don't know a whole lot about how it works and when it is best to use it.

  • 1
    equally as your working with vectors you have the option to implement SVG's into the game as well highlander.co.uk/blog/2010/10/19/… note: this may or may not help with total memory size - but the quality will be high and you will have the ability to scale your vectors without loss of quality – MephistonX Mar 25 '13 at 10:06

I don’t know the limitations of the iphone, but i think it is pretty similar to the web.

The compression of PNG is good for sharp text, but it has no options on how much you want to compress your image.

PNG 24 will be the way to go, if you have alpha-transparencies and a color palette which affords over 256 colors.
PNG 8 can be compared with GIF. You can use 256 colors and supports transparency, but no semi-transparent parts.

You have to chose what works best for you. I would recommend, that you use PNG 24 for images with fine details and a bigger color-palette and/or semi-transparent areas. If you still need a big color palette, but you don’t need semi-transparency and very fine details, then your best choice might be JPEG (if that is an option). Here you can fine tune your compression for the best file-size/quality ratio. And if you have files with a small color-palette and no semi-transparent areas, the best way to go would be PNG 8 or GIF.

Spritesheets are a good way to reduce the amount of file requests, so this might speed up the app as well.

There are plenty of image-optimization-tools. I am using the image compression feature of CodeKit at the moment, but there are other options. I have not tried enough to give a good advice here.

Edit: I just found a link to http://www.tinypng.org/ in my bookmarks. I haven’t tried it myself, but it is a free service, so you could give it a try.

| improve this answer | |
  • Thanks for the response this helped clear things up, but if you know anything else about spritesheets that would be helpful because i'm not quite sure how they work and when it would be best to use? i.e. for all my graphics or just certain elements?? – Hunter Mar 25 '13 at 11:53
  • Spritesheets are good for elements, that are used in every screen of your game, because you load the full image all the time. In the final work only a small portion of the image will be displayed (the one with the element, that you need). You have to think in sets to use sprite-sheets. Let’s say you have some navigation elements, that will be shown all the time. Put these together in a sprite-sheet, because you will load all those elements at the same time all the time. – Afterlame Mar 25 '13 at 12:25
  • If you have multiple elements for a submenu, put those in a separate sprite-sheet, because they will only be needed at the time you open the submenu. But since every element will be loaded at that time it is good to put those elements together. If you have elements, that will be used on occasion and don’t necessary have other images that will be needed at the same time, put it in its own file. – Afterlame Mar 25 '13 at 12:25

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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