So erstellst du ein App-Icon mit Ebenen auf dem Mac
Erstelle vier bearbeitbare Tiefengruppen, passe Glasmaterial an, prüfe die aktivierten Ziele und sichere dein Ebenenprojekt in Assets for Xcode.
- Das Ergebnis
- Dein gespeichertes MyIcon-Projekt enthält vier bearbeitbare Gruppen namens Orange Plate, Purple Plate, Blue Plate und Paper Plane.
- Das brauchst du
- Installiere Assets for Xcode auf einem Mac.
- Halte die Icon-Vorlagen für vier Tiefengruppen bereit: eine Grundfläche, zwei farbige Platten und ein Vordergrundsymbol.
- Wähle einen beschreibbaren Speicherort für dein bearbeitbares MyIcon-Projekt.

Erstelle ein App-Icon mit Ebenen, ohne die Grafik zu früh auf ein Bild zu reduzieren. Diese Anleitung zeigt das Papierflieger-Design mit vier Tiefengruppen aus dem ersten App-Store-Bild von Assets for Xcode: Importiere die Vorlagen, passe Glasmaterialien an, wähle Exportziele, prüfe das Icon und sichere das bearbeitbare Dokument.
1.Beginne mit deiner Icon-Grafik
Öffne Assets for Xcode und ziehe dein erstes Quellbild in das Startfenster. Dort findest du auch Open Project und Create New Project. Ziehe für dieses Beispiel die Grundgrafik in den Startbereich, um ein bearbeitbares Dokument anzulegen.

Startfenster von Assets for Xcode mit den Schaltflächen Open Project und Create New Project. 2.Importiere und benenne die Grundplatte
Wähle nach dem Import des ersten Bildes die neue Gruppe unter Layers aus und nenne sie Orange Plate. Die Icon-Vorschau zeigt eine orange-rosa Grundfläche als eigene bearbeitbare Tiefengruppe.

Bearbeitbares Icon mit der Tiefengruppe Orange Plate und einer orange-rosa Grafik. 3.Füge die violette Platte hinzu
Wähle den Ursprung der Arbeitsfläche aus, importiere das zweite Quellbild als weitere Tiefengruppe und nenne sie Purple Plate. Purple Plate und Orange Plate bleiben unter Layers getrennt.

Purple Plate liegt über Orange Plate in der Layers-Liste und in der Icon-Vorschau. 4.Lege die blaue Platte darüber
Wähle erneut den Ursprung der Arbeitsfläche aus, importiere das dritte Quellbild und nenne die Gruppe Blue Plate. Prüfe in der Vorschau, ob die blaue Grafik über der violetten und orangefarbenen Platte liegt.

Blue Plate als dritte bearbeitbare Tiefengruppe über der violetten und orangefarbenen Platte. 5.Vervollständige das Papierflieger-Icon
Importiere die drei SVG-Bestandteile des Papierfliegers gemeinsam als eine Tiefengruppe. Nenne die Gruppe Paper Plane und das Dokument MyIcon. Unter Layers siehst du jetzt vier einzeln bearbeitbare Gruppen.

Paper Plane über drei farbigen Platten; MyIcon enthält vier benannte Tiefengruppen. 6.Lass den Papierflieger deckend
Wähle Paper Plane, öffne den Material-Inspektor und schalte Glass unter Material (Glass) aus. Der Papierflieger im Vordergrund ist dann klar und deckend weiß statt durchscheinend.

Material-Inspektor mit ausgeschalteter Option Glass für die ausgewählte Gruppe Paper Plane. 7.Wähle Clear Glass für die blaue Gruppe
Wähle Blue Plate, wechsle zu Elevation und stelle im Material-Inspektor Recipe auf Clear Glass. Prüfe, ob Glass aktiviert ist, und betrachte die Staffelung der Gruppen in der Tiefe.

Elevation-Vorschau mit vier Icon-Tiefengruppen; Clear Glass ist für Blue Plate aktiviert. 8.Aktiviere die gewünschten Plattformziele
Aktiviere Apple Watch und füge zu den bestehenden Apple-Zielen Android Adaptive Icon, Windows App Icon und Icon Composer hinzu. Prüfe, ob die Seitenleiste und die Vorschauleiste alle gewünschten Prüfziele zeigen.

Zielliste mit Apple Watch, Android Adaptive Icon, Windows App Icon und Icon Composer. 9.Prüfe die aktivierten Ziele
Starte die Icon-Prüfung und lies die Statusleiste unten. Im Beispiel stehen Apple ready, Android ready und Windows ready; alle erforderlichen Größen wurden erzeugt. Behebe jedes Problem mit einem Ziel, bevor du speicherst.

Prüfstatus Apple ready, Android ready und Windows ready für die aktivierten Plattformziele. 10.Sichere und prüfe das Icon-Projekt
Wechsle zurück zu Design, wähle den Dokumentursprung aus, damit der Auswahlrahmen verschwindet, und sichere das Projekt als MyIcon.braveicon. Der Titel MyIcon, die vier benannten Gruppen und die Anzeige Saved bestätigen, dass das Projekt gespeichert wurde. Die endgültigen Plattformdateien exportierst du separat.

Fertiges MyIcon in der Design-Ansicht mit vier bearbeitbaren Gruppen und der Anzeige Saved.
Nach dem letzten Schritt
Der Papierflieger bleibt deckend, die blaue Ebene verwendet Clear Glass und die aktivierten Ziele für Apple, Android und Windows bestehen die Prüfung. Beim Speichern werden die endgültigen Plattformdateien nicht exportiert.
Tipps
Lass jede Platte als eigene Gruppe unter Layers, damit du sie ändern kannst, ohne das Design zu reduzieren.
Prüfe die Tiefenreihenfolge unter Elevation, bevor du ein Glasrezept auswählst.
Lies den Prüfstatus jedes aktivierten Ziels, bevor du dein Icon-Dokument sicherst.
AchtungDiese Anleitung sichert das bearbeitbare Icon-Projekt. Sie exportiert weder AppIcon.appiconset noch andere endgültige Plattformdateien.
AchtungWenn ein Ziel nach der Prüfung nicht bereit ist, behebe das Problem vor dem Export.