Eccoci al secondo appuntamento con i Tutorial della sezione “Grafica” del nostro sito. Oggi parleremo della Splash Screen. Probabilmente conoscerete già la funzione della Splash Screen, ad ogni modo, se non sapete di cosa si tratta, sappiate che questa non è nient’altro che la schermata che compare in fase di caricamento dell’applicazione. Questa potrebbe rimanere visibile per pochi istanti come per diversi secondi, in base al tempo che occorre per il caricamento dell’applicazione vera e proria. Voi dovrete comunque prendere in considerazione il fatto che il tempo di caricamento potrebbe essere davvero minimo e di conseguenza la durata di visualizzazione di questa vista risulterebbe davvero breve. Essa dovrà contenere quindi pochi elementi tali da permettere una eventuale rapida visione e comprensione.

Solitamente questa schermata, definita tramite un’immagine, viene sfruttata per mostrare il logo o il nome dell’applicazione o dell’azienda produttrice, anche se Apple raccomanda di mostrare l’immagine di partenza del programma per dare l’impressione che il caricamento del programma sia più veloce.

Le dimensioni totali devono essere 320 pixel in larghezza per 480 pixel in altezza. Non sussiste la problematica di ridurre eventualmente l’altezza in quanto la visualizzazione sarà a pieno schermo, ovvero senza la Status Bar.

Un primo consiglio è quello di impostare l’immagine o il logo rivolto dal lato in cui si eseguirà l’applicazione, portrait o landscape (visualizzazione rispettivamente in verticale o in orizzontale), permettendo di sfruttare questi pochi attimi dall’utente per capire e rivolgere quindi il proprio dispositivo nella direzione corretta.

Ricordo a chi sfrutta grafica in stile “web 2.0″ di considerare anche il relativo riflesso per il posizionamento dell’immagine, in modo da non ottenere un risultato sbilanciato nell’immagine complessiva.

Personalmente preferisco sfondi molto puliti, magari supportati da una giusta sfumatura, niente comunque di eccessivo, questo se lo scopo è semplicemente quello far risaltare il logo. Consiglio inoltre di utilizzare colori che abbiano attinenza con quelli dell’applicazione, in modo da dare una continuità grafica all’intero programma.

Per coloro che volessero inserire immagini grafiche più complesse, magari nel caso di giochi, per dar modo all’utente di “entrare fin da subito” nell’ambiente di gioco, ricordo, come già indicato sopra, che il tempo di visualizzazione della Splash Screen potrebbe essere davvero di pochi attimi rischiando di ottenere un effetto confusionario e di conseguenza sgradevole a causa della visione troppo rapida di un determinato numero di elementi, in questo caso, probabilmente inutili. Non ci sono però solo lati negativi nel mettere un’immagine complessa, se durante i vostri test di esecuzione vi accorgete che i tempi di caricamento della vostra App sono abbastanza lunghi, allora potreste approfittare di questo creando qualcosa di più di una semplice visualizzazione del nome o del logo e otterreste comunque un ottimo risultato. Potreste per esempio mostrare i comandi del gioco o informazioni e curiosità aggiuntive dell’applicazione che allieverenno sicuramente l’attesa del caricamento che non risulterà così frustrante per l’utente finale.

Altra considerazione, ricordate che l’occhio umano distribuisce la visione degli elementi in maniera occidentale (logicamente per noi abituati a leggere alla maniera occidentale) perciò se vorrete inserire più elementi, per agevolare una rapida lettura ricordatevi di effettuare il giusto bilanciamento dall’angolo superiore sinistro a quello inferiore destro. Cercate inoltre di NON inserire più di 7 parole/elementi, questo infatti è il numero ottimale per una rapida comprensione e memorizzazione.

Di seguito un semplice esempio di una Splash Screen creata per una visualizzazione rapida che mostra esclusivamente un logo:



Come vedete è un’ipotesi di Splash Screen davvero semplice, che risulta chiara e pulita. Il logo centrale, un pizzico di stile “web 2.0″ grazie al riflesso e l’impostazione generale, nulla di più.

Per far si che l’immagine diventi la vostra Splash Screen non dovrete far altro che realizzarla, come detto, delle dimensioni 320×480 pixel, salvarla in formato .PNG e chiamarla Default.png. Attenzione alla prima lettera del nome “D” maiuscola. Fatto questo aprite Xcode, trascinate la vostra immagine in “Resources”, spuntate l’opzione “Copy items into destination group’s folder (if needed)” nella finestrella che si apre e cliccate infine su “Add”.

Il lavoro termina qui, potete cliccare in Xcode su “Build & Run” e provare la vostra nuova Splash Screen tramite iPhone Simulator o direttamente nel vostro “melafonino”.