Quando disegno un’applicazione per iPhone e  iPad, uno degli aspetti piu’ importanti per un App graphic designer è quello di disegnare icone, loghi, immagini di sfondo e di lancio (splash).
Rilevo, sopratutto confrontandomi con sviluppatori e creativi che c’e’ una grande confusione tra iPhone 3G, iPhone 3GS, iPod Touch 3, iPod Touch 4, iPhone 4 e iPad.
Esistono quindi delle differenze tra le dimensioni e il tipo di immagini che devo creare per un’applicazione o un progetto che possa essere ottimizzato per tutti i dispositivi sopra citati.

Cercando in rete ho trovato quindi una utile tabella per il nostri progetti iPhone /  iPad il cui “OS target” sia 3.2 o superiore:

Nome Dimensione (pixels) Piattaforma
Icon.png 57 x 57 Icona universale (Universial application icon)
Icon-settings.png 29 x 29 Icona universale per le impostazioni (settings area).
Nome alternativo: Icon-Small.png
Icon-iPad.png 72 x 72 Icona per applicazione iPad.
Nome alternativo: Icon-72.png Aggiungi qualche piccola icona personalizzata per il progetto. Vedi i commenti. (iPad doc: 64×64, other optional 32×32, 24×24, 16×16)
Icon-iPad-spot.png 50 x 50 iPad icon per risultati di ricerca.
Nome alternativo
:Icon-Small-50.png iPhone OS taglia 1 pixel da ogni lato e aggiunge un’ombra. La dimensione effettiva è di 48 × 48 pixel.
iTunesArtwork.png 512 x 512 Icona  per iTunes App Store. Debe essere caricata separatamente iTunes. E anche ‘inclusa nel boudle app,con  il nome del file: iTunesArtwork. In una applicazione per iPhone OS iPad puoi usare questa immagine per generare la grande (320 × 320) icona del documento se non è fornita in altro modo.
Default.png 320 (w) x 480 (h) iPhone/iPod 2, 3 launch image
Default-iPad.png 768 (w) x 1004 (h) iPad. Specifies the default portrait launch image. Questa immagine viene utilizzata se un’immagine più specifica non è disponibile. Usa il modello full size Usa (768 × 1024) per progettare questa immagine di lancio. L’altezza di 20 pixel per la barra di stato è attivata come impostazione predefinita e occupa la parte superiore dello schermo, ovvero 1004 righe vs 1024.
Default4.png 640 (w) x 960 (h) iPhone 4 hi-res launch image
Optional icons and images:
Icon-doc.png 22 (w) x 29 (h) Universial document icon
Icon4.png 114 x 114 iPhone 4 hi-res application icon
Icon4-settings.png 58 x 58 iPhone 4 hi-res application icon for settings/search area
Icon4-doc.png 44 (w) x 58 (h) iPhone 4 hi-res document icon
Icon-iPad-doc.png 64 x 64 iPad document icon (small)
Icon-iPad-doc320.png 320 x 320 iPad document icon (large)
Background-xxx.png 320 (w) x 480 (h)
640 (w) x 960 (h)
768 (w) x 1024 (h)
iPhone/iPod Touch 2, 3 immagine di sfondo,
iPhone 4 immagine di sfondo, full size
iPad immagine di sfondo, full size. In molti progectti la status bar e’ nascosta (hidden), e viene usato lo schermo intero (full screen size) by default.
Default-PortraitUpsideDown.png 768 (w) x 1004 (h) iPad. Specifica una versione Portrait capovolta come splash (immagine di lancio). L’altezza di questa immagine dovrebbe essere 1.004 pixel e la larghezza deve essere 768. Questo file ha la precedenza sul file di immagine predefinito-Portrait.png per questo specifico orientamento.
Default-LandscapeLeft.png 1024 (w) x 748 (h) iPad. Specifies a left-oriented landscape version of the launch image. The height of this image should be 748 pixels and the width should be 1024. This file takes precedence over the Default-Landscape.png image file for this specific orientation.
Default-LandscapeRight.png 1024 (w) x 748 (h) iPad. Specifica una versione Landscape orientata a sinistra per l’immagine lancio. L’altezza di questa immagine dovrebbe essere 748 pixel e la larghezza dovrebbe essere 1024. Questo file ha la precedenza sul file di immagine predefinito-Landscape.png per questo specifico orientamento.
Default-Portrait.png 768 (w) x 1004 (h) iPad. Specifica la versione generica dell’immagine Portrait di lancio. L’altezza di questa immagine dovrebbe essere 1.004 pixel e la larghezza deve essere 768. Questo file è usato per il diritto orientamento verticale side-up e ha la precedenza sul file di immagine default.png. Se un’immagine Default-PortraitUpsideDown.png file non è specificato, questo file viene utilizzato anche per orientamento verticale a testa in giù.
Default-Landscape.png 1024 (w) x 748 (h) iPad. Specifica la versione generica dell’immagine di lancio Landscape. L’altezza di questa immagine dovrebbe essere 748 pixel e la larghezza dovrebbe essere 1024. Se un-Default LandscapeLet.png o immagine Default-LandscapeRight.png file non è specificato, questa immagine è utilizzata in sostituzione. Questa immagine ha la precedenza sul file di immagine default.png.

Normalmente le icone  sono file in formato PNG con angoli a 90 gradi,  senza la trasparenza, senza livelli, e impostati a 72 PPI. iPhone OS arrotonda atomaticamente gli angoli, aggiunge un facoltativo effetto glossy e altri effetti.  Se non si vuole lasciare che l’iPhone / iPad OS applichi l’effetto gloss per le icone, gli sviluppatori dovranno aggiungere una chiave al info.plist chiamata UIPrerenderedIcon ed effettuare un controllo. La profondità di bit standard è di 24 bit + 8 bit alpha channel.

I progettisti e programmatori comprendono che le dimensioni degli elementi su schermi iPhone e  iPad non sono costanti. La differenza nelle dimensioni dello schermo e la funzionalità dello zoom sono un luogo comune, ma il formato PNG e 72 PPI è ancora il default.
Si noti che il formato PNG rigetta la Densità di pixel. La maggior parte degli editor di immagini, tra cui Adobe Photoshop, assumono che la densità dei pixel di un’immagine è di 72 se tale informazione non viene modificata.)

Disegnare icone per iPad può essere piu’ difficile. Alcuni progettisti rilasciano solo le icone standard per iPad poichè non riescono a comprendere che è meglio inserire anche alcune icone  di piccola dimensione, che sono comunque opzionali. Quindi è sempre meglio aggiungere delle piccole icone al progetto iPad,  nei formati di 64 × 64, 32x32px, e 24x24px 16x16px. I programmatori sapranno poi come includere questi file.

Si deve sapere che quando l’utente seleziona l’icona dell’applicazione principale l’applicazione inizia subito a caricarsi. E ‘importante rendere il tempo di lancio più breve possibile. Ogni app  iPhone e iPad puo’ avere una propria immagine di lancio (splash), che imita l’interfaccia utilizzando un’immagine statica. La splash page dovrebbe essere la più piccola possibile in modo da garantire un rapido caricamento del file. E’ quindi sempre sconsigliabile creare file di dimensioni vicine al megabyte.

Impostazione file Info.plist

Nel file Info.plist gli sviluppatori precisano gli orientamenti dell’applicazione assieme alle immagini di lancio correlate. Se manca, devono aggiungere queste righe:

<key>UISupportedInterfaceOrientations</key>     <array>
<string>UIInterfaceOrientationPortrait</string>
<string>UIInterfaceOrientationPortraitUpsideDown</string>
<string>UIInterfaceOrientationLandscapeLeft</string><string>UIInterfaceOrientationLandscapeRight</string>
</array>

Gli sviluppatori possono modificare precedenti convenzioni di naming , come spesso facciamo e possono usare il loro nome personalizzato per  icone e per lanciare i file di immagine.
Noi di norma siamo abituati a configurare le nostre applicazioni iPad in maniera diversa rispetto alle versioni iPhone, in modo da specificare i valori specifici del dispositivo per le chiavi Info.plist.
Ad esempio:

Esempio di icona e le impostazioni di immagine lancio in Info.plist per applicazioni universali. Piattaforma: iPhone OS 3.2 +

Esempio di icona e le impostazioni di immagine lancio in Info.plist per applicazioni universali. Piattaforma: iPhone OS 3.2 +

Note per gli sviluppatori:

Se l’applicazione supporta l’esecuzione di iPhone in iPhone OS 3.1.x o versioni precedenti, non è possibile utilizzare la chiave CFBundleIconFiles per specificare i file icona. È necessario creare le icone delle stesse dimensioni come indicato nella nostra tabella, ma ogni immagine deve essere chiamate come segue:

Icon.png – Icona per applicazioni per iPhone or iPod touch
Icon-72.png – Icona per applicazioni per iPad in un’applicazione Universale
Icon-Small.png – Risultati della ricerca e l’icona delle impostazioni su iPhone e iPod touch
Icon-Small-50.png – Risultati della ricerca in applicazioni iPad

Dalla versione 3.2 se si specifica un-Icon small.png o file Icon-Small-50.png nel bundle, il sistema preferisce quei file icona rispetto a quelle nella chiave CFBundleIconFiles e il sistema operativo preferisce il defination icon dell’applicazione nella chiave CFBundleIconFiles più di qualunque altra.