Tutorial: Eigene App Icons auf dem iPhone/iPad/iPod erstellen und benutzen

Solange man ein gejailbreakts Gerät besitzt, lässt sich am iDevice so ziemlich alles den eigenen Wünschen anpassen. Die App Icons bilden da keine Ausnahme. Wie es so oft der Fall ist, führen hier viele Wege zum Ziel. In diesem Tutorial werde ich die Methode über ein Icon-Programm im Zusammenspiel mit dem Dateisystem erläutern. Die Methode über Winterboard wird bald auch ein Tutorial erhalten.

Für ein Icon benötigen wir zunächst einmal ein Bild. Das kann eine eigens erstellte Grafik sein, ein Foto oder eine Grafik aus dem Internet. Die einzige Voraussetzung ist, dass das Bild quadratisch ist und am besten in einer Auflösung von 512 x 512 vorliegt. Ein nicht-quadratisches Bild wird später verzerrt und bei einer niedrigen Auflösung wirkt das Icon am Ende unscharf. Für dieses Tutorial habe ich mir einen kleinen Smiley gebastelt, der mir jetzt in der Größe 512 x 512 im PNG-Format vorliegt.

Bildschirmfoto 2013-04-02 um 12.38.13

Jetzt geht es daran, aus dem Bild ein Icon zu bauen. Für den Mac gibt es dafür die eierlegende Wollmilchsau namens Icons Express (Link in dem Mac App Store). Dort fügen wir unser Icon ein und können dann die gewünschten Effekte festlegen.

Bildschirmfoto 2013-04-02 um 12.56.39

Zur Verfügung stehen die abgerundeten Ecken und der Gloss-Effekt, den man von den meisten iOS Icons bereits kennt.

Anschließend klicken wir auf iPhone 4 / iPad / iPhone und setzen dort den Haken für die Icons, die wir exportieren möchten. Rechts aktivieren wir dann noch die Funktion Generate iOS Icons und klicken anschließend auf Export Icons.

Bildschirmfoto 2013-04-02 um 12.56.54

Jetzt haben wir sechs Dateien, die wir einfach noch an der richtigen Stelle einsetzen müssen, damit alles funktioniert. Jede Datei wird von dem jeweiligen Gerät an einer anderen Stelle benötigt. Icon@2x.png ist beispielsweise das Icon auf dem Homescreen und Icon-Small@2x.png ist das Icon, das in der Spotlightsuche angezeigt wird.

Bildschirmfoto 2013-04-02 um 12.57.16

Windows-Nutzer können auf ähnliche Programme zurückgreifen, beispielsweise IconWorkshop.

Jetzt geht es daran, die originalen Icon Dateien mit unseren eigenen zu ersetzen. Dazu benötigen wir einen iOS-Dateibrowser, wie die iFunBox oder den iExplorer oder wir greifen auf ein FTP-Programm zurück. Ich benutze in diesem Fall die iFunBox.

Dort klicken wir uns zum Dateisystem des Gerätes, hier Raw Datei System gennant, hindurch und landen zunächst einmal im Hauptverzeichnis.

Bildschirmfoto 2013-04-02 um 12.58.33

Dort navigieren wir zu var -> mobile -> Applications. Hier erwarten uns jetzt jede Menge Ordner mit undurchsichtigen Zahlen- und Buchstabencodes.

Bildschirmfoto 2013-04-02 um 12.59.12

Um Licht ins dunkle zu bringen, schalten wir unser Gerät ein und öffnen den Cydia-Tweak iFile. Dort navigieren wir ebenfalls in den Applications Ordner und suchen dort die App heraus, deren Icon wir editieren wollen. In unserem Fall ist das Flight Control. Unter dem Namen steht ein langer Code, der in dieser Form  in der iFunBox angezeigt wird. Diesen Code suchen wir nun in der iFunBox und schon haben wir den Ordner unserer App lokalisiert.

Richtigen ordner finden

Wir öffnen diesen App-Ordner und navigieren zum Ordner FlightControl.app. Dort finden wir bereits einige Dateien mit dem Namensbestandteil Icon.



Wichtig: Das Schema der Ordner ist immer gleich. Wollt ihr zum Ordner mit den Icons gelangen, müsst ihr im Applications-Ordner immer nach dem Appnamen suchen und dann den Ordner Appname.app öffnen.

Diese kopieren wir per Drag&Drop auf den Computer, um eine Sicherheitskopie der Originale zu haben. Dann ziehen wir unsere eigenen Icon Dateien per Drag&Drop oder durch Klicken von Vom Mac/PC kopieren in den Ordner hinein. Nun müssen wir unser Gerät nur noch respringen oder neustarten und unser eigenes Icon hat den Platz des alten eingenommen, und zwar überall dort, wo es angezeigt wird.

Icon in Action

Wenn Du einen Kommentar hinterlässt, werden deine Daten für die Verarbeitung des Kommentars gespeichert. Durch die Abgabe eines Kommentars erklärst Du, dass Du damit einverstanden bist.

Leave a Reply

Your email address will not be published.

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>