Apple ist seit der Vorstellung des ersten Macintosh bekannt dafür, sich viele Gedanken über die Minisymbole zu machen, an denen man die einzelnen Programme wiedererkennt. Für die diesjährigen System-Updates steht eine tiefgreifende Änderung bevor: Apple verabschiedet sich von pixelbasierten Icons und setzt fortan auf Vektorgrafiken. Das neue Icon-Dateiformat ist zudem plattformübergreifend angelegt; von der Apple Watch über iPhone und iPad bis zum Mac findet dasselbe Icon Verwendung – und kann je nach Darstellungsmodus (dunkel, hell, monochrom) seine Anmutung verändern.


Damit App-Entwickler frühzeitig mit der Gestaltung entsprechender Icons beginnen, hat Apple eine App vorgestellt, mit der sich Icons zusammenstellen und für die unterschiedlichen Modi anpassen lassen: Icon Composer liegt in Beta-Version vor – und jeder kann sie herunterladen. Darin arrangiert man Vektordateien in bis zu vier Ebenen, wechselt zwischen Dunkel-, Hell- und Monochrom-Modus oder betrachtet die runde watchOS-Variante. Wir haben ausprobiert, wie gut dies in der Praxis aussieht.

Beginn mit Vektor-Bearbeiter
Icon Composer kann selbst die notwendigen Vektorgrafiken weder erzeugen noch bearbeiten, sondern lediglich verschieben und skalieren. Deshalb führt der erste Schritt in ein Programm, das skalierbare Illustrationen erzeugen kann – zum Beispiel Logoist. Wir legten darin ein neues Dokument mit einer Leinwandgröße von 1088 × 1088 Pixel an – die runden Icons für Apple Watch und Vision Pro sind etwas größer als das rechteckige Raster von 1024 × 1024 der anderen Plattformen.

Hintergrund plus maximal drei Gruppen
Darin legten wir zunächst den Icon-Hintergrund an. Meist kommt hier ein einfaches Rechteck zur Anwendung, eventuell verziert mit einem einfachen Muster. Verläufe, Effekte und Transparenzen kommen nicht zur Anwendung – dies übernimmt später Icon Composer. Die Objekte des Hintergrunds gruppierten wir und benannten sie „0_Hintergrund“. Darüber platzierten wir die grafischen Elemente. Als Beispiel verwendeten wir eine maskierte Zahnrad-Anordnung, wie sie über viele Jahre unter mac OS X im Icon der Systemeinstellungen-App zur Anwendung kam. Wir wählten drei Zahnräder für den Hintergrund, drei für den Vordergrund und darüber ein leinwandfüllendes Rechteck mit kreisförmigem Ausschnitt.


Export als SVG
Als nächstes folgt der Export ins SVG-Format. Eigentlich soll Icon Composer in der Lage sein, darin angelegte Ebenen zu erkennen; dies gelang bei uns allerdings nicht. Deshalb blendeten wir durch einen Klick auf das Augen-Icon alle Gruppen bis auf eine aus und exportierten so Hintergrund sowie die drei weiteren Gruppen als individuelle SVG-Dateien.


Anpassen in Icon Composer
Als Nächstes starteten wir die Beta-Version von Icon Composer, welche wir nach dem Download in den Programme-Ordner verschoben hatten. In der linken Spalte legten wir zunächst über das Plus-Icon vier "Groups" an. In diese zogen wir dann aus dem Finder-Fenster die einzelnen SVG-Dateien, den Hintergrund in die unterste, die Maske in die oberste Gruppe. Vorausgewählte Effekte versehen die flachen Vektorgrafiken sofort mit dynamischen Effekten. Nun beginnt das gruppenweise Experimentieren mit den verschiedenen Liquid-Glass-Elementen.


Benutzbarer Rohbau
Die aktuelle Version von Image Composer stellt einen ersten Entwurf dar, was die Bedienoberfläche angeht: Prozentwerte für Effekte mussten wir per Hand einstellen oder per Pfeiltasten schrittweise ändern. Ein Export-Befehl suchten wir vergebens, immerhin bekamen wir per „Edit/Copy Icon as Image“ eine Vorschau in die Zwischenablage. Was die App als Datei mit Endung .icon speichert, soll direkt in Xcode-Projekten Verwendung finden können. Bereits jetzt machen erste Liquid-Glass-Experimente Spaß. Wer mehr über die Bedienung von Icon Composer erfahren möchte, kann die WWDC-Session mit Lyam Bewry ansehen, die Apple in der Developer-App und auf YouTube veröffentlicht hat.