1

The graphics designer I am working with has given me the 3 options for delivering the graphics for the iOS app.

I want the delivered files to suit the following criteria:

  • Good quality (Ex: for retina display) that is also resizable
  • Lossless conversion as much as possible
  • Easy to produce PNGs of different sizes (for retina and non retina) for someone who is not well versed in creating graphics (a developer like myself)
  • Easy for any other designer to tweak if needed in the future.
  • Optional requirement: Editable using either Photoshop or Illustrator ( as those are the only 2 programs I currently own)

The formats are:

  • Illustrator file
  • an EPS generated from Photoshop
  • an embedded smart layer within Photoshop

Which of these formats would fit the bill based on the above criteria. Any feedback highly appreciated.

Thanks!

2 Answers 2

2

It sounds like you wish to export the PNGs yourself? If that's the case, I'd highly recommend getting a Photoshop document (.psd) that is built only using vector shapes and layer styles, because these can scale non-destructively up and down with the document.

You'll want to do your best to avoid bitmap layers, because bitmap scaling introduces artefacts that are definitely obvious when scaling down, and even more obvious when scaling up. There may be situations where you have no choice, due to the design, but those cases are usually pretty rare and should be the exception. If a bitmap texture is needed, that's often best constructed as a pattern layer or pattern layer style, because the bitmap scale will be independent of the document (scaling many times up or down won't cause compound artefacts).

I'd avoid Smart Objects as much as possible. Smart Objects created in Photoshop are rendered at their native size. This means that if you scale a Smart Object, it will be bitmap scaled up or down, even if your Smart Object was built from vector shapes initially.

If you want to automate exporting, then you have a few options (this means all the PNGs can be generated with the correct filenames in a couple of passes with minimal editing). I like building a sprite sheet of all the elements that need to be exported. This is usually a separate Photoshop document or documents with the elements laid out flat in a grid-like structure, with Photoshop's slices set up to export everything. Another option is to use something like Layer Cake. Again, it requires some setup, but exporting can be automated.

I'd highly recommend not using Adobe Illustrator for exporting iOS assets for three main reasons:

  • It has some nasty antialiasing issues, like adding stray pixels. Stray pixels are a real issue for iOS design, because they often change the image size, meaning your Retina images aren't exactly double the dimensions of your non-Retina images.
  • It can't dither gradients, often resulting in visible banding.
  • Other assorted rendering that isn't up to the same standard as Photoshop.

That advice relates to all versions of Illustrator, right up to Illustrator CS6.


Short version

What you want:

  • A Photoshop document that only uses vector layers and layer styles.
  • Maybe use bitmap layers, but pattern layers are preferable (if bitmaps are required).
  • Smart Objects can have some undesirable behaviour if you need to scale the document.
  • It'd be great if the main document(s) were accompanied by some kind of automated exporting, like using sprite sheets or an app like Layer Cake.

What you absolutely don't want:

  • An Illustrator document.

Clarification: Illustrator is awesome. It has some great tools and is a brilliant choice for certain types of work. Final iOS image assets isn't one of them (this is my opinion, if someone offers a different view on Illustrator for iOS design, double check they've actually designed iOS apps!).

2
  • Thanks for taking time out for the detailed answer Marc. Basically, your answer is "none of the above"? Do I get that right? What if I HAD to choose one of the above as that is what the designer is comfortable working with and sadly, since the contract is already in place, I do not have much of a choice? Commented May 14, 2012 at 17:15
  • If you have no choice, then you have no choice. Photoshop and Fireworks are certainly the top two apps to use for iOS app design though. It depends how many images you need and how complex the app is. Working a different way might be fine if the number of images is in the tens, not hundreds. Commented May 14, 2012 at 22:32
1

Easy for any other designer to tweak if needed in the future.

There's no simple answer to that criteria. Yes, if you use industry standard software (which, alas, Adobe is), it helps, but there's so many techniques and so much software out there and so many personal preferences in terms of personal style, workflow, and habits that you shouldn't expect one designer to just be able to pick up and go with someone else's files. In fact, it's often easier to start new much of the time.

So, Adobe Illustrator is fine. Adobe Photoshop is fine. Adobe Fireworks is fine. All can be useful and appropriate for the task. (as can other software such as Inkscape, or Pixelmator, or any other number of image editing tools). But the next designer down the road may or may not have all of that software and/or be familiar with the techniques being used and/or have the latest version of said software, etc.

Short version of the answer? Hire a competent designer who's work you like and let them build the icons in the way that makes most sense to them. Then have them do future updates. It'll save you headaches in the long run.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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