App e giochi su Google Play stanno adottando un nuovo sistema di icone per adattare meglio diversi artwork degli sviluppatori ai vari layout dell'interfaccia utente, ai fattori di forma e ai dispositivi di Google Play, nonché per garantire coerenza e un aspetto più chiaro in Google Play.
Le forme uniformi sono visivamente più accattivanti e più facili da digerire. Aiutano gli utenti a concentrarsi sull'opera d'arte, anziché sulla forma. Risolve i problemi di allineamento causati da spazi aperti casuali per presentare meglio le informazioni circostanti, come il titolo, la valutazione e il prezzo.
In questa pagina vengono descritte le linee guida da seguire per la creazione di asset per la scheda della tua app su Google Play. Ad esempio, poiché Google Play esegue dinamicamente il rendering degli angoli arrotondati e delle ombre per le icone delle app, devi ometterle dagli asset originali.
Importante: se invece vuoi saperne di più sulla creazione di icone di avvio degli APK, che sono separate dalle icone di Google Play descritte in questa pagina, consulta le risorse che seguono:
- Icone adattive Android
Segui queste linee guida per le icone APK per scoprire come creare icone di Avvio app adattive introdotte in Android 8.0 (livello API 26). - Icone dei prodotti
Scopri i principi di Material Design per le icone dei prodotti, incluse le linee guida per la progettazione delle icone, le forme, le specifiche e il trattamento.
Creazione degli asset
Questa sezione descrive alcune linee guida da seguire per creare risorse visive per la tua app su Google Play.
Attributi
L'artwork delle icone può riempire l'intero spazio dell'asset oppure puoi progettare e posizionare elementi grafici come i loghi sulla griglia della linea principale. Quando posizioni l'artwork, usa le linee guida come linea guida, non una regola rigida.
Quando crei l'artwork, assicurati che sia conforme ai seguenti requisiti:
- Dimensione finale: 512 x 512 px
- Formato: PNG a 32 bit
- Spazio colore: sRGB
- Dimensione massima del file: 1024 kB
- Forma: quadrata. Google Play gestisce il mascheramento in modo dinamico. Il raggio corrisponderà al 20% delle dimensioni delle icone.
- Ombra: nessuna. Google Play gestisce le ombre in modo dinamico. Consulta la sezione "Ombre" di seguito per informazioni sull'inclusione delle ombre nell'artwork.
Dopo aver caricato l'asset, Google Play applica in modo dinamico la maschera arrotondata e l'ombreggiatura per garantire la coerenza su tutte le icone delle app/dei giochi.
Taglie
Usa l'intero spazio asset come sfondo quando tratti con opere d'arte minimaliste.
Utilizza le linee di chiave come guide per il posizionamento degli elementi dell'artwork (ad es. i loghi).
Non forzare il logo o la grafica a adattarsi all'intero spazio dell'asset. Utilizza invece la griglia della linea chiave.
Un'illustrazione disegnata in genere funziona bene con un'icona al vivo.
Questi sono esempi di elementi dell'icona che ingannano gli utenti e violano le Norme per gli sviluppatori di Google Play. Evita tutte le seguenti pratiche e consulta le norme relative ai metadati e le norme relative a installazioni, recensioni e valutazioni degli utenti di Google Play per ulteriori indicazioni.
Shadows
Google Play aggiungerà in modo dinamico un'ombra intorno all'icona finale dopo il caricamento.
Quando aggiungi ombre all'interno della grafica dell'icona, valuta la coerenza con la piattaforma Android seguendo le linee guida di Google Material.
Raggio d'angolo
Google Play applica in modo dinamico il raggio d'angolo. Ciò garantisce la coerenza quando l'icona viene ridimensionata in diversi layout dell'interfaccia utente. Il raggio corrisponderà al 20% delle dimensioni delle icone.
Adattamento del brand
Se le forme sono un elemento fondamentale di un logo, non forzare l'artwork al vivo. Posizionalo invece nella nuova griglia della linea chiave.
Se possibile, scegli per l'asset un colore di sfondo appropriato per il tuo brand e che non includa alcuna trasparenza. Gli asset trasparenti mostreranno il colore di sfondo dell'UI di Google Play.
Se non c'è una forma distinta intorno a un logo che lo definisce, posizionalo su uno sfondo al vivo.
Se la tua grafica è abbastanza flessibile, valuta la possibilità di modificarla in modo da sfruttare appieno le dimensioni dell'asset. Se ciò non è possibile, torna a posizionare il logo su una griglia della linea chiave.
Modalità versione precedente
Gli asset delle icone originali che non sono stati aggiornati in base alle nuove specifiche verranno alla fine migrati alla modalità legacy e ridimensionati del 75% alle dimensioni della griglia della linea chiave (512 x 0,75 = 384 px).
A partire da maggio 2019 non sarà consentito caricare un'icona in base alla specifica originale. Visualizza ulteriori dettagli sulle tempistiche.
Istruzioni per gli utenti API
Le date di migrazione sono leggermente diverse per gli utenti dell'API, ma ottieni lo stesso risultato finale della migrazione di tutte le icone alla nuova specifica o alla "modalità legacy" entro il 24 giugno 2019.
Prima del 17 giugno 2019, gli sviluppatori devono usare Play Console per applicare la nuova
specifica alle proprie icone. Tutte le chiamate a Edits.images: upload verranno applicate a seconda della specifica configurata in Play Console. Non è possibile applicare la nuova specifica tramite API. La chiamata Edits.images: upload
potrebbe restituire un errore se la specifica precedente è ancora applicata e il messaggio di errore relativo a quell'icona specifica ti indirizzerà a questa specifica. Dopo aver applicato una nuova specifica utilizzando Play Console, puoi riprovare a effettuare la chiamata Edits.images: upload
. Potresti dover ripetere la chiamata più volte
prima che abbia esito positivo.
A partire dal 17 giugno 2019, tutte le chiamate API a Edits.images: upload
applicheranno automaticamente la nuova specifica all'icona. A partire dal 17 giugno 2019, dovrai caricare solo le icone compatibili con la nuova specifica.
Scarica modelli e risorse per la progettazione
Per iniziare, scarica uno dei modelli di asset forniti:
- Modello di schizzo (.sketch)
- Illustrator template (.ai)
- Modello Photoshop (.psd)