BraveCLCome creare un’icona per app a livelli su Mac
Crea quattro gruppi modificabili, regola il materiale vetro, verifica le destinazioni attive e salva il progetto a livelli in Assets for Xcode.
- Il risultato
- Il progetto MyIcon salvato contiene quattro gruppi modificabili chiamati Orange Plate, Purple Plate, Blue Plate e Paper Plane.
- Cosa ti serve
- Installa Assets for Xcode su un Mac.
- Prepara la grafica per quattro gruppi di profondità: una base, due piastre colorate e un simbolo in primo piano.
- Scegli una posizione scrivibile in cui salvare il progetto MyIcon modificabile.
Crea un’icona per app a livelli senza appiattire il disegno troppo presto. Questa guida segue il progetto dell’aeroplanino di carta con quattro gruppi di profondità mostrato nella prima schermata di Assets for Xcode sull’App Store: aggiungi le immagini originali, regola i materiali vetro, configura le destinazioni di esportazione, verifica l’icona e salva un documento modificabile.
1.Inizia dalla grafica dell’icona
Apri Assets for Xcode e trascina la prima immagine sorgente nella finestra iniziale. Qui trovi anche Open Project e Create New Project; per questo esempio, trascina la grafica di base nell’area iniziale per creare il documento modificabile.
Finestra iniziale di Assets for Xcode con i pulsanti Open Project e Create New Project. 2.Importa e rinomina la piastra di base
Dopo aver importato la prima immagine, seleziona il nuovo gruppo in Layers e chiamalo Orange Plate. L’anteprima dell’icona mostra una base sfumata dall’arancione al rosa nel proprio gruppo di profondità modificabile.
Icona modificabile con il gruppo di profondità Orange Plate e grafica arancione e rosa. 3.Aggiungi la piastra viola
Seleziona la radice dell’area di disegno, importa la seconda immagine sorgente come altro gruppo di profondità e chiamalo Purple Plate. Purple Plate e Orange Plate restano separati in Layers.
Purple Plate aggiunto sopra Orange Plate nell’elenco Layers e nell’anteprima dell’icona. 4.Sovrapponi la piastra blu
Seleziona nuovamente la radice dell’area di disegno, importa la terza immagine sorgente e chiama il gruppo Blue Plate. Controlla nell’anteprima che la grafica blu sia sopra le piastre viola e arancione.
Blue Plate aggiunto come terzo gruppo di profondità modificabile sopra le piastre viola e arancione. 5.Completa l’icona con l’aeroplanino
Importa insieme i tre componenti SVG dell’aeroplanino di carta come unico gruppo di profondità, chiamalo Paper Plane e assegna al documento il nome MyIcon. L’elenco Layers ora contiene quattro gruppi modificabili separatamente.
Paper Plane sopra tre piastre colorate, con quattro gruppi di profondità denominati in MyIcon. 6.Mantieni opaco l’aeroplanino
Seleziona Paper Plane, apri l’inspector dei materiali e disattiva Glass in Material (Glass). L’aeroplanino in primo piano diventa una sagoma bianca nitida e opaca, invece di vetro traslucido.
Inspector dei materiali con Glass disattivato per il gruppo Paper Plane selezionato. 7.Applica Clear Glass al gruppo blu
Seleziona Blue Plate, passa a Elevation e imposta Recipe su Clear Glass nell’inspector dei materiali. Verifica che Glass sia attivo e osserva come si sovrappongono i gruppi in profondità.
Anteprima Elevation di quattro gruppi di profondità, con Clear Glass attivo per Blue Plate. 8.Attiva le destinazioni desiderate
Attiva Apple Watch e aggiungi Android Adaptive Icon, Windows App Icon e Icon Composer alle destinazioni Apple già presenti. Controlla che la barra laterale e la fascia di anteprime mostrino le destinazioni da verificare.
Elenco delle destinazioni con Apple Watch, Android Adaptive Icon, Windows App Icon e Icon Composer. 9.Verifica le destinazioni attive
Avvia la verifica dell’icona e controlla la barra di stato inferiore. L’esempio mostra Apple ready, Android ready e Windows ready, con tutte le dimensioni richieste generate. Risolvi gli eventuali problemi delle destinazioni prima di salvare.
Stato di verifica con Apple ready, Android ready e Windows ready per le destinazioni attive. 10.Salva e rivedi il progetto modificabile
Torna a Design, seleziona la radice del documento per rimuovere i contorni di selezione e salva il progetto come MyIcon.braveicon. Il titolo MyIcon, i quattro gruppi denominati e l’indicatore Saved confermano il salvataggio. L’esportazione dei file finali per le piattaforme è una procedura separata.
Icona MyIcon completata nella vista Design con quattro gruppi modificabili e stato Saved.
Dopo l’ultimo passaggio
L’aeroplanino resta opaco, il livello blu usa Clear Glass e le destinazioni Apple, Android e Windows attivate superano la verifica. Salvare il progetto non esporta i file finali per le piattaforme.
Suggerimenti
Mantieni ogni piastra nel proprio gruppo in Layers per modificarla senza appiattire il disegno.
Usa Elevation per controllare l’ordine di profondità prima di scegliere una ricetta vetro.
Leggi lo stato di verifica di ogni destinazione attiva prima di salvare il documento dell’icona.
AttenzioneQuesta guida salva il progetto dell’icona modificabile; non esporta AppIcon.appiconset né altri file finali per le piattaforme.
AttenzioneSe una destinazione non è pronta dopo la verifica, correggi il problema prima di esportare.
