Icona dell'app: canale alfa e dimensioni per i due store

Hai un solo logo e due app store, e il file che va bene ad Apple non è quello che vuole Google. Il problema salta fuori nel momento peggiore: la build è pronta e il caricamento continua a fallire per colpa di un canale alfa.

Apple vuole un'icona quadrata da 1024x1024 con sfondo opaco. Play vuole un PNG a 32 bit da 512x512 che tecnicamente supporta l'alfa ma che, secondo le specifiche di design della stessa Google, non dovrebbe usarlo. E nessuno dei due store vuole un file dall'aspetto finito: entrambi applicano angoli ed effetti per conto loro dopo il caricamento. Ecco cosa chiede ciascuno, e come ricavare entrambi i file da un solo logo.

Apple: 1024 pixel, quadrata e niente trasparenze

Le Human Interface Guidelines di Apple indicano come dimensione di layout dell'icona dell'app per iOS, iPadOS e macOS 1024x1024 px, quadrata, in sRGB, Gray Gamma 2.2 o Display P3. La via preferita da Apple oggi è Icon Composer, dove importi i livelli di primo piano e definisci lo sfondo nello strumento, ma un'immagine appiattita è ancora ammessa: i livelli danno più controllo, non sono obbligatori.

Chi pubblica per la prima volta si blocca sullo sfondo. L'istruzione di Apple per un livello di sfondo importato è secca: a tutto campo e opaco. Un PNG da 1024px con sfondo trasparente non è un'icona valida per l'App Store — caricane uno e App Store Connect restituisce ITMS-90717: l'icona dell'App Store non può essere trasparente né contenere un canale alfa. La variante per l'aspetto scuro è l'unica eccezione: lì Apple ti chiede di fornirla con lo sfondo trasparente, così da lasciar passare quello fornito dal sistema. Ovunque altrove, decidi che colore sta dietro al tuo simbolo e incorporalo nel file.

Le altre piattaforme Apple cambiano la dimensione di layout: watchOS 1088x1088 e visionOS 1024x1024, entrambe mascherate in un cerchio, e tvOS un formato orizzontale da 800x480. Cambiano anche il metodo: le icone di tvOS e visionOS si assemblano come pile di immagini a livelli in Xcode, non in Icon Composer.

Google Play: 512 pixel, alfa consentito, trasparenza comunque un errore

L'icona della scheda dello store su Play è un PNG a 32 bit con alfa, 512x512 px, sRGB, massimo 1024KB. Letta da sola, questa riga fa sembrare perfetto lo scontorno trasparente che hai già.

Le specifiche di design delle icone di Google chiudono quella porta: gli asset trasparenti mostrano il colore di sfondo dell'interfaccia di Google Play. Il tuo simbolo finisce così a galleggiare su qualunque superficie Play decida di mostrare, e un logo scuro sparisce nel tema scuro. Il consiglio di Google: scegli un colore di sfondo adatto al tuo brand.

Altre due regole di Play: niente badge o testi che suggeriscano classifiche, prezzi o categorie di Play, e l'icona della scheda dello store è una cosa diversa dall'icona del launcher sul dispositivo. Quell'icona adattiva usa livelli da 108x108 dp, dove solo i 66x66 dp interni hanno la garanzia di non venire mai tagliati dalla maschera di un OEM.

Ricavare entrambi i file da un solo logo

Entrambi i file partono dalla stessa cosa: il tuo simbolo, separato in modo pulito da qualunque supporto su cui si trovava. Se il logo esiste solo come JPEG mandato da un fornitore o come foto della carta intestata, prima scontornalo, così la forma resta isolata con un vero canale alfa. remover.bg stacca il simbolo dallo sfondo e ti lascia appoggiarlo su una tinta unita o su un colore del brand personalizzato nell'editor — il passaggio di appiattimento che Apple richiede.

L'ordine che funziona:

1. Rimuovi lo sfondo così il logo resta da solo. Controlla i bordi su un colore scuro, non sul bianco — tratti sottili e grazie nascondono i difetti su un'anteprima bianca.
2. Imposta lo sfondo sul colore del brand ed esporta un PNG. Conserva anche la versione trasparente, per press kit e favicon.
3. Nel tuo strumento di design, piazza quel PNG su una tela quadrata ed esporta a 1024x1024 per Apple e a 512x512 per Play. Le dimensioni si gestiscono lì, non nello strumento di rimozione dello sfondo.

Per un logo scansionato o fotografato, come rimuovere lo sfondo da un logo copre i casi limite, e la guida al PNG trasparente spiega perché vale la pena conservare quel master.

Lascia che gli store disegnino angoli e ombra

Play su questo è preciso: arrotonda gli angoli da sé con un raggio pari al 30% della dimensione dell'icona, aggiunge la propria ombra dopo il caricamento e ti chiede di omettere entrambi. Apple maschera il tuo quadrato nel rettangolo arrotondato del sistema e applica i propri riflessi, la rifrazione e la traslucenza, avvertendo che i livelli già mascherati rovinano quegli effetti e fanno sembrare i bordi seghettati.

Quindi: niente angoli già arrotondati, niente ombra, niente rilievo, niente bagliore. Questa sobrietà vale solo per le icone — su una foto prodotto, un'ombra di contatto realistica è ciò che evita l'effetto oggetto incollato.

Siccome entrambi gli store mascherano, tieni la parte importante del simbolo al centro. L'indicazione di Apple è di centrare il contenuto principale, così la maschera non può troncarlo. La griglia di keyline di Play funziona diversamente da come la immagina la maggior parte delle persone: è una guida di posizionamento, non un confine. L'istruzione di Google è di riempire l'intero asset con la grafica quando puoi, e di ripiegare sulle keyline solo quando la forma attorno a un logo è essenziale per il brand. Aggiungi margine per prudenza e la tua icona verrà mostrata visibilmente più piccola di ogni scheda lì accanto.

Quello che il raggio del 30% si mangia davvero sono gli angoli, quindi un logotipo spinto fin lì dentro perde le estremità. Sulle maschere circolari di watchOS e visionOS, un logotipo da bordo a bordo perde di netto la prima e l'ultima lettera.

Prima di caricare

• Apple: PNG 1024x1024, quadrato, del tutto opaco, angoli lasciati vivi.
• Play: PNG a 32 bit 512x512, massimo 1024KB, sfondo nel colore del brand invece della trasparenza, angoli lasciati vivi.
• Stessa grafica e stessi colori nei due store: gli utenti devono riconoscere un'app sola, non due.
• Guarda entrambe le anteprime a dimensione miniatura. Il dettaglio che si legge a 1024 sparisce a 40 pixel.

Sistema l'icona una volta e resterà sistemata per ogni release che verrà dopo questa.