Tutorial von Annchen94
Huhu ZusammenAnnchen94 hat uns netterweise ein Tutorial für das Erstellen eigener Muster / Pattern zur Verfügung gestellt. Vielen herzlichen Dank!
[Bild fehlt]
Liebe S3M-User,
ich habe mich für euch an dieses Tutorial gesetzt, da ich selbst weiß, wie schwierig es manchmal ist an vernünftige Tutorials zu kommen.
Sollte irgendetwas schlecht erklärt sein, Fehler beinhalten etc. sagt mir das bitte, denn dies ist mein erstes Tutorial und somit kann ich bestimmt nicht alles bedacht haben :)
Viel Spaß beim Lesen & viel Erfolg,
euer Annchen.
» Was brauche ich?
- Vektorprogramm (Inkscape free, Illustrator ...
- Bildbearbeitungsprogramm (Paint Shop Pro, Adobe Photoshop, The GIMP free ...)
- The Sims 3 Workshop – Pattern Plugin-> DownloadAnmeldung erforderlich
- .dds – PlugIn für dein Bildbearbeitungsprogramm (Adobe Photoshop & Paint Shop Pro hier & The GIMP hier)
- Bild, welches du als Muster importieren willst (am besten schon nahtlos!)
Bevor ich hier zum erklären komme: Ich denke zwar, dass das Einbringen neuer Muster ins Spiel gar nicht soo~ schwierig ist, allerdings ist gerade das vektorisieren eine ganz schöne Fizzelarbeit. Lasst euch aber nicht entmutigen und haltet durch, dann ist die Freude danach um so größer ;)
Ich erkläre nur für Inkscape, da ich den Illustrator nicht habe. Ich denke aber, dass es keine allzu großen Unterschiede geben wird ...
Gewöhnt es euch an, alle paar Minuten Strg + S zu drücken, also zu speichern. Mir ist Inkscape nämlich win paar mal abgeschmiert bei der Arbeit an diesem Tutorial. Glücklicherweise, hatte er noch eine Sicherheitskopie machen können, aber jetzt speichere ich lieber sofort :)
[Bild fehlt]
Importiere oder kopiere dein ausgewähltes Bild in das Vektorzeichenprogramm. Ich habe ein Pattern von de-de.colourlovers.com genommen.
Zunächst musst du zählen, wie viele Farben du hast. Die Sims 3 erlauben nur 4 colorierbare Farben, weshalb es ganz gut ist, wenn man nur so viele hat :) In meinem Beispiel habe ich (1) weiß, (2) rosa, (3) rot und (4) dunkelrot. Die gelbe Umrandung lass ich einfach weg, find ich eh nicht so schön.
Als nächstes muss ich mir überlegen, wie ich die Farben bzw später dann Ebenen übereinander anordne. In meinem Fall wäre das wohl zunächst das Weiß, sozusagen als Hintergrundfarbe, dann das Dunkelrote, drüber das Rote und das Rosane.
» Vektorisieren?
Jetzt kommt das Vektorprogramm so richtig ins Spiel! Drücke zunächst Strg, Shift und L gleichzeitig, um die Ebenenansicht rechts zu öffnen. Ebene 1 ist die, auf der dein Bild momentan erscheint. Weil wir nachher die Vektorgrafik unabhängig vom Bild haben möchten, drücke ich auf das Pluszeichen und lasse mir einen Namen einfallen z.B. „Weiß“. Auf Hinzufügen klicken und schon befinden wir uns in unserem Ebenenstapel ganz im Vordergrund, auf der gerade neu erstellten und damit ganz leeren Ebene „Weiß“.
[Bild fehlt]
Wähle nun das „Bézier-Kurven und gerade Linien zeichnen“-Werkzeug aus und zoome relativ nah ran.
Wir beginnen nun mit dem Vektorisieren. Auf diese Ebene muss nur der Hintergrund. Da diese Ebene auch nachher noch ganz unten liegen wird, ziehe ich einfach ein Viereck um das Bild, dann ist auf jedenfall mal alles mit der Hintergrundfarbe bedeckt. Momentan erscheint nur die Kontur, was für das bearbeiten der Linien eigentlich gar nicht so schlecht ist. Wie man die Objekte einfärbt erfahrt ihr später ;)
[Bild fehlt]
Wir erstellen die nächste Ebene, diesmal nenne ich sie „Dunkelrot“. Ich nehme wieder das gleiche Werkzeug und umfahre damit alles, was nicht weiß ist. Das sieht dann zwar etwas komisch aus, nachher werden wir aber unser gewünschtes Ergebnis erreichen.
[Bild fehlt]
In dieser Art arbeiten wir immer weiter. Es dürfen sich auf einer Ebene auch mehrere Objekte befinden, die aber jeweils eine geschlossene Umrandung sein müssen (sonst lassen sie sich nachher nicht einfärben)! Beim mir sieht das dann so aus, siehe oben.
» Übergang zum Bildbearbeitungsprogramm
Jetzt hast du schon das Schlimmste – meiner Meinung nach – überstanden. Einmal kräftig durchatmen, einen Schluck trinken – weitermachen. Denn jetzt kommen wir zum Übertragen der Vektorgrafik zu einer Rastergrafik.
Dafür öffnest du dein Bildbearbeitungsprogramm und legst es anschließend wieder in den Hintergrund. Gehe jetzt wieder zum Vektorzeichenprogramm. Speichere deine Arbeit an diesem Punkt nochmal – falls du das Muster später nochmal an seiner Form verändern willst – und lösche dann die Ebene, auf welcher sich deine Vorlage befindet - „Ebene 1“.
- - - - - - - - - - - - - - -
» Zwischenerklärung
Bevor ihr euch an die nächsten Schritte heranwagt, will ich euch erklären, warum wir das gleich tun werden, was ich dort beschreibe. Wir trennen die einzelnen Farbabstufungen auf und legen sie auf bis zu 4 verschiedene Ebenen. Die Ebenen werden dann aufeinandergestapelt gespeichert und Sims 3 weiß nun genau, auf welche Ebene welche Farbe angewandt werden muss. Allerdings arbeiten wir dabei nicht mit Farben, sondern mit Alphas, ähnlich, wie bei Sims2, wenn man Kleidung die Ärmel abtrennen wollte etc. D.h. Auf einer weißen Fläche erscheint die Farbe später voll deckend, auf einer grauen je nach Helligkeit mehr oder weniger transparent und auf einer schwarzen Fläche unsichtbar.
Die 4 verschiedenen Ebenen nennt man Kanäle. Und die Kanäle haben ganz bestimmte Namen und eine bestimmte Reihenfolge:
Alpha
Blau | von oben ...
Grün | ... nach unten
Rot
- - - - - - - - - - - - - - -
» Aufsplittung der Kanäle
Wähle nun die unterste Ebene aus. Sie wird sich später im „Rot“-Kanal befinden. Drücke nun Strg + Shift + F. Es öffnet sich rechts ein kleines Fenster mit Namen „Füllung und Kontur“. Momentan ist nichts ausgewählt, drücke also Strg + A, um alles, was sich auf der weißen Ebene befindet zu markieren.
Jetzt klickst du im Register „Füllung“ auf „Einfache Farbe“. Klicke dann im neu erscheinenden Register „Einfache Farbe“ auf „Farbrad“ und ziehe den Cursor in die weiße Ecke. Anschließend klickst du auf die Registerkarte „Farbe der Konturlinie“ und ziehst dort den Cursor wieder in die weiße Ecke.
Jetzt sieht man den Hintergrund zwar nicht mehr, weil er weiß ist, er ist aber immer noch da ;)
Die anderen Farben, sollen ja im „Rot“-Kanal noch nicht angezeigt werden, also nimmst du die nächste Ebene, drückst Strg + A und stellst diesmal sowohl Füllung als auch Konturlinie auf Schwarz. Dies machst du bei allen anderen Ebenen auch.
[Bild fehlt]
Nun hebst du die Markierungen auf und zoomst auf 100% - außer dein Bild ist so klein, wie meines. Dann kannst du es auch auf 250% oder ähnliches stellen, sodass es grob geschätzt größer als 256 * 256 Pixel ist. Drücke „Druck S-Abf“.
Öffne nun dein Bildbearbeitungsprogramm und drücke Strg + V. Du hast nun eine Abbildung deines Bildschirms mit dem geöffneten Vektorprogramm. Du musst das Bild nun so zuschneiden, dass nur noch das eigentliche Muster zu sehen ist. Bei meinem ist das etwas schwierig nachzuvollziehen, weshalb ich mir die Vorlage zu Hilfe nehme. Gehe wieder zurück in dein Vektorzeichenprogramm und vollführe nun die gleichen Schritte wie vorher für alle anderen Ebenen. Beachte aber nun, dass die unterste Ebene nun vollkommen schwarz – also unsichtbar wird und dafür die nächst höhere Ebene nun weiß gefüllt werden muss. Drücke wenn du fertig bist wieder „Druck S-Abf“ und füge das Bild in einer neuen Ebene über dem anderen an.
[Bilder fehlen (4)]
Wenn du das geschafft hast, kannst du dein Vektorzeichenprogramm schließen.
» Rot, Grün, Blau, Alpha ...
Verkleinere dein Bild nun auf 256 * 256 Pixel. In Adobe Photoshop und Paint Shop Pro sollte dabei die Einstellung „Bilinear“ gewählt sein.
Bitte folge nun den Anweisungen, die deinem Programm entsprechen ...
Adobe Photoshop habe ich leider nicht, weshalb es dort zu Fehlern meinerseits kommen kann, außerdem kann ich keine Screenshots liefern, sorry.
Adobe Photoshop
Erstelle ein neues Bild, der Größe 256 * 256. Öffne nun das Kanäle-Fenster. Wenn du mit einem 4farbigen Muster arbeitest, musst du nun noch einen neuen Kanal hinzufügen – alpha1. Kopiere nun aus dem anderen 4 ebnigen Dokument nach und nach jede Ebene. In den Kanal „Rot“ muss die unterste, dann kommen „Grün“, „Blau“ un „Alpha“ - nicht vergessen ;)
Speichere dein Bild nun als *.dds-Datei, mit folgenden Einstellungen ...
[Bild fehlt]
Paint Shop Pro
Erstelle ein neues Bild der Größe 256 * 256. Klicke dann auf „Bild“ -> „Kanäle trennen ...“ -> „RGB-Trennung“.
Es öffnen sich drei neue Bilder, mit den Namen „Rot“, „Grün“ und „Blau“. Kopiere nun in das Bild „Rot“ die unterste Ebene, in „Grün“ die nächst höhere und in „Blau“ die dritte. Solltest du noch eine vierte Farbe besitzen, wundere dich nicht, die kann man erst später einfügen ;)
Wenn das gemacht ist, öffnest du wieder dein gerade neuerstelltes Bild und klickst auf „Bild“ -> „Kanäle kombinieren ...“ -> „RGB-Kombination“. Das nun aufkommende PopUp bestätigst du mit „Ok“. Es entsteht (schon wieder) ein neues Bild. Du kannst darauf erkennen, dass nun nur noch alles, was auf den einzelnen Ebenen weiß war dargestellt wird und zwar in ziemlich grellen Farben.
Wenn du nur 3 Farben oder weniger hattest, kannst du den folgenden Schritt überspringen ...
Wie du siehst, sind bei mir noch einige Elemente schwarz. Diese sind die Elemente, die nun auf den „Alpha“-Kanal müssen. Gehe in dein 4 ebniges Bild und markiere dort mit dem Zauberstab alle Flächen, die weiß sind auf der obersten Ebene. Kopiere diese dann mit Strg + C. Füge sie mit Strg + L über dem bunten Bild ein. Markiere die weißen Flächen auch hier nochmal mit dem Zaberstab und klicke im Menü auf „Auswahl“ -> „Auswahl laden/speichern“ -> „Auswahl in Alpha-Kanal speichern ...“. In dem aufkomenden PopUp einfach auf Speichern klicken. Anschließend löschst du die Ebene, auf der die weißen Flächen drauf sind. Der Alpha-Kanal bleibt trotzdem erhalten!
Ab hier wieder alle mitlesen :D
Nun speichern wir unser Bild als *.dds-Datei, mit folgenden Einstellungen ...
[Bild fehlt]
The GIMP
Erstelle ein neues Bild der Größe 256 * 256 und klicke im Menü auf „Farben“ -> „Komponenten“ -> „Zerlegen“.
Im aufkommenden PopUp wählst als Farbmodus „RGB“ aus. Es öffnet sich ein neues Bild mit 3 Ebenen - „Rot“, „Grün“ und „Blau“. Wenn du 4 Farben besitzst in deinem Bild, musst du noch eine weitere Ebene anlegen, die „Alpha“ heißt und unter der „Blau“-Ebene zu liegen hat.
Kopiere nun nach und nach deine Ebenen in dieses Bild. Die unterste muss in die „Rot“-Ebene, die nächste in die „Grün“-Ebene usw. Das machst du so: Wähle die Ebene, in die du deine Kopie speichern willst aus und drücke dann Strg + V. Klicke nun rechts auf die neu entstandene „Schwebende Auswahl“. Wähle dort „Ebene verankern“ aus und schon ist deine Kopie in der richtigen Ebene gespeichert.
Klicke - wenn alle Ebenen übertragen sind - im Menü auf „Farben“ -> „Komponenten“ -> „Wieder zusammenfügen“. Das vorhin noch leere Bild im Hintergrund ist nun gefüllt. Du kannst darauf erkennen, dass nun nur noch alles, was auf den einzelnen Ebenen weiß war dargestellt wird und zwar in ziemlich grellen Farben.
[Bild fehlt]
Speichere dein Bild nun als *.dds-Datei. Mit folgenden Einstellungen ...
[Bild fehlt]
» Sims3Pack erstellen ...
Auf geht’s, Endspurt!
Öffne den Sims 3 Workshop und klicke dort auf „Browse ...“. Suche in der Ordnerübersicht deine *.dds-Datei und klicke auf „Öffnen“.
[Bild fehlt]
Gebe bei „Title“ einen geeigneten Titel ein und bei „Descrption“ eine Beschreibung.
Bei „Category“ wählst du aus, in welcher Kategorie dein Muster später auftauchen soll. „Surface Type“ brauchst du, wenn du später einen Boden mit deinem Muster füllen willst, es beschreibt, mit welchem Geräusch deine Sims darüber laufen.
Wähle anschließend aus, welche Kanäle du hast, bzw. wie viele Farben. In meinem Fall sind es vier. Diesen muss ich jetzt jeweils noch eine erste Färbung geben, die dann im Spiel erscheint. Du hast die Möglichkeit Hexcodes einzugeben, oder du klickst auf die Farbenvorschau und kannst ganz leicht die Farbe raussuchen.
Falls deine Verarbeitung nicht so gut war und es stellen ohne Farbe – in der Vorschau schwarz – gibt, kannst du dafür noch eine ersetzende Farbe aussuchen – die man allerdings im Spiel nicht ändern kann! Klicke dafür auf die Farbvorschau bei „Background fill“.
Alles ausgefüllt? Dann klicke auf Export. Gebe noch kurz deinen Namen und deine Homepage URL an – die TSR Details kannst du auch ignorieren ;)
Gebe deinem Sims3Pack anschließend einen Namen, an dem man erkennt, was in ihm enthalten ist und speichere.
[Bild fehlt]
Nun kannst du alle Programme schließen und den Ordner im Explorer öffnen, in welchen du dein Sims3Pack gespeichert hast.
Doppelklicke die Datei und schon öffnet sich der Sims 3 Launcher und installiert dein Muster.
Ich hoffe, es klappt alles,
ansonsten kannst du natürlich gerne Fragen stellen ;)
