Autos für 2D-Ansicht basteln

Wenn man keine extra Bezahl-Software hat, kann man sich prima mit dem kostenlosen paint.net (http://www.getpaint.net) behelfen!

Als Ausgangsmaterial braucht man ein Auto aus der senkrechten Vogelperspektive, wobei der Rest des Bildes natürlich transparent sein muss. Es gilt, dieses Auto in einen Grafikrahmen von 48 x 48 Pixeln einzupassen. Da das Auto in diesem Grafikrahmen einmal um seine eigene Achse gedreht werden muss, sollten sich Front und Heck des Autos (wenn in "Null-Grad-Stellung") nicht zu dicht an den oberen und unteren Grenzen des Grafikrahmens befinden. Grund: Die Ecken des Autos schlagen sozusagen aus, so bald man es ein wenig dreht!

Zur Bildbearbeitung:
Die Ausgangsdatei mit paint.net öffnen. Zunächst möglichst viel von der Umgebung des Autos entfernen: Dazu aus den Tools die "Rechteckige Maske" auswählen und das entsprechende Rechteck möglichst knapp um die Kontur des Autos herum aufziehen. Wenn geschehen, "Bearbeiten -> Ausschneiden" ausführen. Die Bearbeitung via "Datei -> Schließen" beenden (durchgeführte Änderung also sicherheitshalber noch NICHT speichern!), das Programm aber NICHT verlassen!

Nun das ausgeschnittene Auto via "Bearbeiten -> In neues Bild einfügen" wieder in das noch offene paint.net laden. Mit dem "Zauberstab"-Werkzeug die noch zu entfernenden Farbflächen ums Auto herum anklicken, dabei gegebenenfalls mit dem Toleranz-Schieberegler spielen und schließlich "entfernen" drücken - einfach auf der Tastatur. Kleineren Farbresten der Umgebung kann man mit dem Radiergummi zu Leibe rücken. Falls der Farbunterschied zwischen Auto und Umgebung zu gering ist, sollte man die gesamte Kontur des Autos mit dem Radiergummi abfahren, bevor man den Zauberstab einsetzt. Wenn schließlich alles Unerwünschte entfernt und die Umgebung des Autos somit transparent ist, die Datei unter einem neuen *.png-Namen abspeichern.

Zur Größenanpassung:
Die neue Datei mit paint.net öffnen. Die Datei via "Bild -> GRÖSSE ändern" (MIT Haken bei "Seitenverhältnis beibehalten") auf eine HÖHE von 42 Pixeln verkleinern. Wegen des Hakens bei "Seitenverhältnis beibehalten" bleiben die Proportionen des Motivs erhalten, es wird also nichts deformiert! Die Datei nach dieser Größenänderung unter einem neuen *.png-Dateinamen abspeichern.

Nun die verkleinerte Datei mit paint.net öffnen. Um den erforderlichen Grafikrahmen von 48 x 48 Pixeln herzustellen, via "Bild -> ZEICHNUNGSBEREICHgröße" (jetzt OHNE Haken bei "Seitenverhältnis beibehalten") Breite und Höhe des Grafikrahmens auf jeweils 48 Pixel ändern. Evtl. entstehende Ränder mit dem Zauberstab anklicken und entfernen.

Zur Erstellung des 2D-Pfeils:
Der 2D-Pfeil besteht im Prinzip aus 24 Einzelbildern, die vertikal in einer gemeinsamen Grafikdatei zusammengefasst sind. Jedes Einzelbild ist dabei um einen 15-Grad-Schritt nach rechts gedreht. So geht's:

Die oben erstellte, 48 x 48 Pixel große Datei mit paint.net öffnen. Nun via "Ebenen -> Rotationszoom" im dabei auftauchenden Menü unter "Feinabstimmung -> Winkel" den Wert "-15,00" eingeben und "OK" drücken. Dadurch wird das Auto um 15 Grad gedreht. Das gedrehte Auto als "Schritt1.png" abspeichern. Anschließend wieder über "Ebenen -> Rotationszomm" bei "Feinabstimmung -> Winkel" den Wert "-30,00" eintragen. Die neue Stellung unter "Schritt2.png" abspeichern. Das Auto wieder um 15 Grad weiterdrehen (also -45,00), diese Stellung als "Schritt3.png" abspeichern, usw. - bis die Runde schließlich voll ist.

Aufbau des 2D-Pfeils:
In paint.net via "Datei -> Neu" eine quadratische Grafik mit 48 x 48 Pixeln erstellen. Im Fenster "Ebenen" den Haken bei "Hintergrund" entfernen. Nun die Null- bzw. 360-Grad-Stellung des Autos via "Ebenen -> Aus Datei importieren" in paint.net laden.

Anschließend via "Bild -> ZEICHNUNGSBEREICHgröße" den Grafikrahmen um 48 Pixel nach unten verlängern (so gewinnt man zumindest einen Anhaltspunkt zum präzisen Einfügen des folgenden 15-Grad-Schritts). Dazu den Haken bei "Seitenverhältnis beibehalten" ENTFERNEN, die Pixelhöhe auf 96 ändern und außerdem im Feld "Anker" nun "oben" einstellen. Danach via "Ebenen -> Aus Datei importieren" die Datei "Schritt1.png" (also mit 15 Grad Rechtsdrehung) in die Grafik ziehen und am unteren Rand des nun 96 Pixel hohen Grafikrahmens positionieren. Den Grafikrahmen anschließend wieder um 48 Pixel verlängern, also via "Bild -> ZEICHNUNGSBEREICHgröße" nun den Wert 144 bei "Höhe" eintragen. Diesmal via "Ebenen -> Aus Datei importieren" die Datei "Schritt2.png" einfügen und positionieren, wieder den Grafikrahmen um 48 Pixel nach unten verlängern, nächsten Schritt einfügen, usw. - bis die Runde schließlich voll ist. Dadurch erreicht die Datei eine Gesamtgröße von 48 x 1.152 Pixeln.

Abschließend die Gesamt-Grafik als "vehicle_arrow_car.png" abspeichern und via ActiveSync in den Ordner My Flash Disk -> Navigation -> Skin480x272 -> PPSkin kopieren.

Viel Spaß damit,

Zill