Qual è la giusta dimensione delle icone App Store? Cosa dovresti rappresentare nella tua icona? Che differenza farà tutto ciò? Questa guida alle icone delle app ti aiuterà a rispondere a queste importanti domande, offrirà consigli e link a risorse.
- Perché le icone delle app sono importanti
- L’icona di un’app non è un logo
- Dimensione delle icone dell’App Store: 4 domande da porsi prima di creare l’icona di un’app
- Domanda #1: Chi è il target di questa app?
- Domanda #2: Quali standard di design attuali dovrei seguire?
- Domanda #3: Come posso accennare allo scopo della mia app?
- Domanda #4: Qual è il look and feel della mia app?
- Suggerimenti da tenere a mente durante la progettazione dell’icona della tua app
- Al di là delle dimensioni dell’icona dell’App Store: split-testing delle icone delle app su PickFu
Perché le icone delle app sono importanti
Le dimensioni delle icone dell’App Store sono minuscole. Quando le icone appaiono sullo schermo del tuo smartphone, occupano solo un pollice di spazio. Ma nell’App Store di Apple o nel Play Store di Google, il design che racchiudi in questa piccola dimensione delle icone dell’app store è tutto.
Come le copertine dei libri o le immagini degli annunci dei prodotti su Amazon, le icone delle applicazioni mobili aiutano i tuoi potenziali clienti a dare un giudizio immediato in una frazione di secondo.
Prima di leggere il titolo o la descrizione dell’app, vedranno l’icona. L’icona della tua app mobile deve parlare della tua app in modo accattivante, spingendoli a saperne di più. Una volta che qualcuno ha cliccato sulla tua icona, è più probabile che installi la tua app. E questo è quello che vuoi. Fondamentalmente, l’icona della tua app è la porta d’accesso alle installazioni.
Ecco perché è fondamentale farla bene.
L’icona di un’app non è un logo
Potrebbe sembrare più semplice trasferire il logo del tuo marchio sull’icona dell’app e farla finita. Non fatelo. L’icona di un’applicazione non è un logo. Un logo rappresenta il marchio dietro l’applicazione, sì, ma l’icona dell’app rappresenta l’app stessa.
Così come non usereste un logo al posto dell’immagine di un prodotto in un annuncio su Amazon, non dovreste schiaffare un logo nei requisiti di dimensione dell’icona dell’app store e chiamarlo icona. Solo i mega-brand come Starbucks o Target possono farla franca con questo.
Se sei un marchio decentemente stabilito e noto, tuttavia, sentiti libero di aggiungere il tuo logo all’icona della tua app in qualche modo, ma non farne il fulcro.
Nell’esempio qui sotto, il noto editore di libri di viaggio Lonely Planet include il suo logo nell’icona dell’applicazione Guides by Lonely Planet. Ma il logo è solo un pezzo del design dell’app. Il rilassante bordo blu fa risaltare il caldo paesaggio urbano dai toni gialli, invitando l’osservatore alla prossima avventura.
Lo slogan dice che questa app è una compilation di “guide di città curate”, e l’icona dell’app allude a questa funzione.
Tutti coloro che amano esplorare nuove città e che eseguono una ricerca in negozio per “guide di viaggio” saranno attratti da questa calda ma emozionante icona dell’app.
Confronta l’app Lonely Planet con un’altra app di guide turistiche che troverai sotto la stessa ricerca.
mTrip prende la M dal suo logo, aggiunge uno sfondo verde e si dà un pollice in su per pubblicare l’icona su App Store.
Ma l’icona non dice nulla su ciò che l’utente sta ottenendo, e mTrip non è abbastanza noto per essere riconoscibile da una sola lettera. Anche Netflix, qui sotto, prende la prima lettera del suo logo e la usa come icona dell’app, ma questo marchio può farcela perché tutti sanno cos’è Netflix e cosa fa.
Ora che conosci la differenza tra un logo e un’icona di un’app, diamo un’occhiata alle domande importanti che devi farti prima di iniziare a disegnare.
Dimensione delle icone dell’App Store: 4 domande da porsi prima di creare l’icona di un’app
È vero che l’icona della tua app deve attirare più occhi possibile. Vuoi che si distingua da tutte le icone delle app che la circondano, e in un mondo saturo di app, non è un compito facile.
Ma ecco un segreto: non hai bisogno di rendere l’icona della tua app attraente per tutti nel mondo. Concentratevi invece sul renderla attraente per le persone del vostro target.
Quindi ecco la prima domanda da considerare.
Domanda #1: Chi è il target di questa app?
La tua app è per persone che amano cucinare? Genitori con bambini piccoli? Amanti di giochi come Candy Crush e Angry Birds? Viaggiatori? Musicisti in erba?
Siccome avete già costruito l’app, dovreste conoscere la risposta a questa domanda. Ma falla diventare anche il fulcro del design delle icone della tua app.
Cerca una frase semplice che definisca il tuo target.
Diciamo, per esempio, che la vostra app insegna alle persone a suonare il pianoforte. Una ricerca per “imparare il pianoforte” sul Google Play store porta a queste applicazioni top.
Tra le quattro icone delle app, su quale cliccheresti per saperne di più?
Per me, un ex pianista che vorrebbe imparare di nuovo quello che sapevo, questa vince. A mani basse.
Non trovo affatto attraente l’icona dell’app di Flowkey perché non mi dice nulla su come suonare il piano. (Di nuovo, è fondamentalmente un logo e niente di più). Le altre due presentano tasti di pianoforte all’interno dell’icona – atteso, forse, ma del tutto bene.
Per me, Real Piano Teacher vince perché mostra mani che suonano il piano su tasti etichettati con uno spartito davanti alla persona che suona.
Non si può imparare a suonare il pianoforte senza imparare le note, e imparare a leggere le note musicali può essere impegnativo come imparare a leggere una lingua scritta. Con la sua sola icona, questa app promette di aiutare gli utenti ad imparare a leggere le note, accelerandoli verso il raggiungimento del loro sogno di suonare belle melodie da soli.
Ora ecco la fregatura: tu, come creatore di app, devi chiederti come posso rendere l’icona della mia app ancora migliore di quella che mi piace di più (quella di Real Piano Teacher)?
Progetta l’icona della tua app per elevarti sopra tutte le tue scelte competitive.
Domanda #2: Quali standard di design attuali dovrei seguire?
Le tendenze del design cambiano continuamente. Sono stato in giro abbastanza a lungo da ricordare il più recente cambiamento del logo di Starbucks nel 2011. Mi sentivo un po’ triste che la sirena stesse cambiando, ma alla fine il design è diventato di nuovo sinonimo della mia caffetteria preferita e non potevo immaginare che tornasse al suo design precedente.
Ovviamente, alcune persone trovano il nuovo logo troppo scarno e scherzano sul fatto che alla fine non sarà altro che un punto verde.
Scherzi a parte, è importante tenere traccia delle tendenze attuali del design e come si riferiscono al design della tua app. Sia il Google Play Store che l’App Store pubblicano linee guida aggiornate che puoi (e dovresti) seguire.
Queste linee guida ti aiutano a creare un’icona dell’app con la sensazione più moderna e accessibile.
Il Material Design di Google offre una serie completa di linee guida che coprono i seguenti argomenti:
- Principi di progettazione, compresi l’espressione del marchio e l’approccio al design
- Forme di griglia e di linea chiave
- Specifiche – una ripartizione dettagliata dell’anatomia delle icone delle app e specifiche di illuminazione
- Trattamenti delle icone: informazioni su colore dell’app, livello, punteggio, sovrapposizione, fisarmonica e distorsione
Material Design mira ad aiutarti a creare un’icona di app con una sensazione tattile attraverso il mezzo dei pixel. È roba complessa, ma vale la pena studiarla.
Le linee guida dell’interfaccia umana di Apple si leggono in un modo più amichevole che è anche facile da seguire. Offre dieci consigli, come “Embrace simplicity” e “Test your icon against different wallpapers” insieme a istruzioni su come seguirli.
Dopo questo, Apple offre informazioni su come:
- Formattare gli attributi dell’icona dell’app
- Produrre l’icona dell’app in diverse dimensioni
- Fornire icone selezionabili dall’utente
- Creare icone per riflettori, impostazioni e notifiche per iOS
Mentre le linee guida dell’interfaccia umana sono più brevi e per molti versi più semplici di quelle del Material Design di Google, quest’ultimo offre più suggerimenti di design.
Domanda #3: Come posso accennare allo scopo della mia app?
Come abbiamo visto nel caso delle app per imparare a suonare il pianoforte, comunicare lo scopo della tua app al tuo pubblico è criticamente importante.
Facciamo un altro esempio. Diciamo che stai progettando l’icona di un’app che aiuta gli scrittori a organizzare i loro pensieri e le loro idee. Forse la tua app imposta anche obiettivi di conteggio delle parole e permette agli utenti di monitorare il tempo giornaliero di scrittura. In cima a questo, forse la tua app fornisce citazioni per spingere gli scrittori a scrivere.
Quindi chi è il tuo pubblico?
Gli scrittori, naturalmente. Scrittori principianti. Romanzieri. Liberi professionisti. Giornalisti. Ogni scrittore potrebbe usare la tua app!
Ora dai un’occhiata alla tua concorrenza.
Sull’App Store, cerca “applicazioni per scrittori” e otterrai una serie di applicazioni organizzative.
Focalizzatevi sulle icone delle app qui. Per prima cosa, c’è un baffo con uno sfondo rosso. Se non vedeste il titolo, non sapreste nemmeno che questa app è rivolta agli scrittori. Anche allora, non è chiaro cosa faccia l’app, esattamente, per aiutare gli scrittori a scrivere.
La prossima icona dell’app presenta uno sfondo bianco con un rosso… aeroplano di carta? Punta di penna? Testa di salmone? Non è super chiaro.
L’ultima icona dell’app nel nostro piccolo studio presenta una penna a lampadina su uno sfondo nero. Solo guardando l’icona, si ha la sensazione che questa app aiuterà gli scrittori a formare idee e a mantenere l’ispirazione che scorre fino a quando si trasforma in un libro, un articolo o una poesia.
Emula questa icona, non le prime due. Accenna alla funzionalità che offre la tua app.
Prendi nota che l’accenno alla funzionalità dovrebbe essere diverso per i diversi tipi di app.
Se hai creato un’app di utilità, per esempio – come una calcolatrice di mance o una torcia elettrica – l’icona dell’app dovrebbe far sentire la persona che naviga come se stesse già usando l’app prima ancora di cliccare sull’icona.
L’icona dell’app qui sotto non raggiunge questo obiettivo, e per di più è affollata e difficile da leggere.
Al contrario, l’icona dell’app qui sotto ti fa sentire come se potessi accedere rapidamente a questa calcolatrice di mance perché è praticamente già aperta.
Anche le icone dei giochi mobili hanno bisogno di un trattamento speciale. Il tuo obiettivo nell’icona di un’app di gioco è quello di far sentire l’osservatore come se fosse già immerso nel mondo del gioco. Tutto quello che devono fare è cliccare sull’icona dell’app e avranno la scarica di dopamina di giocare a qualcosa di nuovo, eccitante e gratificante.
Ecco un grande esempio di icona di un’app che realizza questo:
Puoi quasi sentire l’impeto della discesa di una collina sconnessa solo guardando l’icona di questa app. È un brivido delizioso, però, che ti fa venire voglia di giocare.
Un esempio non troppo bello? Questa icona dell’app per un gioco di basket.
Ti senti come se stessi… fissando una palla da basket. Non giocando una partita. Noioso!
Domanda #4: Qual è il look and feel della mia app?
Anche se è una buona idea esercitare la creatività mentre si progetta l’icona di un’app, non si vuole che l’interfaccia e l’icona dell’app abbiano texture diverse. Dovrebbero lavorare insieme in un sistema di design senza soluzione di continuità.
Ecco due giochi a blocchi di parole le cui icone corrispondono al look and feel dei giochi che rappresentano.
L’icona di Word Stacks ha gli stessi colori del tramonto e i blocchi di parole grossi come il gioco stesso.
L’icona di Woody Block Puzzle è legnosa come il gioco stesso.
Non volete indurre il vostro pubblico a pensare che la vostra app sia un tipo di gioco a blocchi legnosi ma poi rivelare invece un gioco a blocchi di parole color tramonto e spumeggiante. Un branding incoerente è un design povero.
Come scrive un blogger su 99designs, “Se il design della tua app è piatto, anche la tua icona dovrebbe essere piatta. Se la tua app contiene skeuomorfismo, anche la tua icona dovrebbe avere almeno qualche elemento di skeuomorfismo”.
Fate in modo che l’icona della vostra app rifletta il più possibile i colori, le texture e le sensazioni della vostra app.
Suggerimenti da tenere a mente durante la progettazione dell’icona della tua app
Ora che hai risposto alle quattro domande essenziali sul design delle app, è il momento di iniziare a creare diverse varianti o proposte di design per la tua icona. Iniziate con uno schema di design di base e poi sperimentate con diversi colori, bordi e grafica.
Ecco alcuni consigli per guidarvi:
- Affidatevi solo a due o tre colori. Più di tre e l’icona della tua app inizia a sembrare troppo occupata.
- Evita di usare una vera fotografia. Puoi sempre trasformare una fotografia in un’illustrazione/immagine vettoriale, però.
- Pensa in piccolo. L’icona della tua app potrebbe sembrarti grande mentre la stai disegnando, ma è minuscola sullo schermo di un iPhone o Android. Assicurati che ogni elemento sia chiaro anche nella forma più piccola dell’icona.
- Risparmia le parole per il titolo e la tagline. L’icona di un’app è destinata ad avere un impatto visivo. Puoi dire quello che hai bisogno di dire con le parole nel titolo, nella tagline e nella descrizione dell’app.
- Segui sempre i requisiti e le linee guida per le dimensioni delle icone degli app store di Apple e Google. Puoi trovare i requisiti di dimensione di Google Play qui e quelli dell’App Store di Apple qui. Tieni presente che dovrai creare diverse versioni dell’icona della tua app per ogni negozio. Nota anche che anche se l’App Store su iPhone ha gli angoli arrotondati, dovresti inviare tutti i file della tua app in forma quadrata. Il sistema Apple arrotonderà gli angoli per te.
Una volta che hai due o tre potenziali icone di app tra cui scegliere, è il momento del passo più importante del tuo viaggio nella creazione di icone di app: lo split-testing delle tue icone per scoprire cosa pensa il tuo pubblico target.
Al di là delle dimensioni dell’icona dell’App Store: split-testing delle icone delle app su PickFu
Il modo migliore per sapere cosa pensa il tuo pubblico di riferimento dell’icona della tua app è quello di effettuare uno split-test su PickFu prima di pubblicare effettivamente la tua app sul Google Play Store o sull’App Store. Certo, si potrebbe fare un A/B test in-app ed eseguire diverse variazioni sullo store stesso, ma questo è un processo lento che può risucchiare il vostro tempo e denaro.
Per effettuare lo split-test su un pool di intervistati su PickFu prima di pubblicare l’icona della vostra app dal vivo, si ottiene il feedback di cui avete bisogno senza perdere denaro nel processo.
Ci vogliono solo pochi minuti per impostare un sondaggio su PickFu. Ricordate che ho detto che il targeting del pubblico è fondamentale? PickFu te lo rende facile. È possibile indirizzare i membri del pubblico in base al dispositivo iOS o Android, se sono un giocatore mobile, e quanto hanno speso in App Store, tra molti altri tratti utili.
Uno sviluppatore di app ha recentemente preso a PickFu per testare tra due icone per una app di incontri.
La prima icona mostra il profilo rosa di una donna con in mano un telefono, il titolo dell’app in due colori diversi, e uno sfondo rossastro e arancione. In tutto, questa icona dell’app presenta circa sei colori diversi.
La seconda opzione elimina la donna, mantiene uno sfondo rosso-arancio più snello, e lascia le parole, ma in bianco con un piccolo cuore infilato nell’incavo della lettera M. Questa icona dell’app presenta solo tre colori.
Gli intervistati hanno votato in modo schiacciante a favore della più semplice e pulita opzione B. A differenza di un tradizionale test A/B dal vivo, gli intervistati di PickFu ti danno un feedback scritto dettagliato. Quindi possiamo vedere esattamente perché l’opzione B ha vinto.
Prima di tutto, gli intervistati hanno apprezzato l’aspetto più semplice e professionale dell’Opzione B, dicendo cose come: “Mi piace la semplicità di questa e non esclude un solo genere per l’uso” e “Non mi piace molto la colorazione viola/rosa brillante dell’Opzione A – è davvero difficile per gli occhi.”
Speriamo che lo sviluppatore dell’app abbia scelto la seconda icona, che ha molte più probabilità di attrarre potenziali utenti rispetto all’Opzione A.