5

I am working for a client to develop an iOS app both for iPhone and iPad including for retina displays.

The client is going to get the UX designs himself. We use the Apple's iOS Human Interface Design Guidelines to whoever is designing the UX for our apps.

In the article it explicitly mentions that:

____________________________________________________________________________
|                 | Size for iPad          | Size for high-resolution iPad |
|_________________|________________________|_______________________________|
| Launch image    |                        |                               |
| (required for   | 768 x 1004 (portrait)  | 1536 x 2008 (portrait)        |                  
| all apps)       | 1024 x 748 (landscape) | 2048 x 1496 (landscape)       |
|_________________|________________________|_______________________________|

Does this mean that for each screen design (besides the launch screen) the designer has these canvas sizes as well?

Because, the screen size in iPad specs is 2048 x 1536 (portrait) and 1536 x 2048 (landscape). And for iPhone 4 the complete screen size 640 x 960 was used as canvas size!

UPDATE: Found reference to it here under section "Launch Images"

Improve this question
6
  • I mean the UI designs usually provided as PSD files to us! I am asking what canvas size should he choose for iPad retina design
    – Ozair Kafray
    Jun 28, 2012 at 13:11
  • Ahh okay. Since the retina display is exactly 2x, starting with retina and downscaling seems the logical option. Downscale to half of retina and see how well it works; might be some tweaks if the non-retina display is harder to read; the text/ect will be less crisp
    – Ben Brocka
    Jun 28, 2012 at 13:19
  • Yes, but I don't really egt the canvas size for retina. There is one in the iPad specs and one in the Design interface guidelines!
    – Ozair Kafray
    Jun 28, 2012 at 13:21
  • Here is a PDF with some useful information about what you have to think about regarding images etc.: f.cl.ly/items/012n0O023v2S2N1m3Q1t/… (It is more a technical document than a UX document.)
    – Raffael Luthiger
    Jun 28, 2012 at 13:46
  • I think the launch-image sizes are the full-display minus the status bar, which may or may not be hidden in your full app. Oh, I see Kit Grose's on the case :)
    – Ben Brocka
    Jun 28, 2012 at 14:27

1 Answer 1

Reset to default
8

The discrepancy is due to the status bar (where the clock and wireless status is shown) which is 20px high on the regular display (and 40px on the retina display).

Whether that is also the size you should design the app UI to depends on whether your app runs full-screen (i.e. hides the status bar) or not.

Generally it should not hide the status bar unless absolutely necessary.

Improve this answer
3

Your Answer

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

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