Hallo liebe Leute und willkommen zu meinen ersten Tutorial. In diesen Tutorial geht es um Lightmaps in RPG-Maker Spielen.
Es sieht meist schwer aus, ist aber sobald man es kann total einfach. Aber bevor wir allgemein anfangen möchte ich noch ein Hinweis abgeben. "Lightmap", es mag zwar so klingen als würden sie die Map erhellen aber ganz im Gegenteil, eine Lightmap dient dazu die Karte abzudunkel und dem ganze etwas Atmospähre zu geben.
Als erstes möchte ich mal darauf zu sprechen kommen welche Programme wir benötigen*:
(Bei Maps die größer sind als 20x15) Mapexporter von Cherry
GIMP
Irfanview (oder ein anderes Programm um die Farbtiefe zu reduzieren)
RPG-Maker2000/2003 (sollte aber eigentlich auch mit XP, VX und was noch kommen wird gehen)
Nachdem ihr die benötigten Programme heruntergeladen und installiert habt können wir ja auch anfangen!
1.Mappen
Das Mappen an sich sollte ja für euch kein direktes Problem sein. Ich habe erstmal einfach eine Map für unser Tutorial gemacht. (Dieses Haus ist bewusst so aufgebaut um verschiedene Lichteffekte zu zeigen.)
Wenn ihr eure Map fertig habt können wir ja dann schon zum zweiten Schritt gehen.
2.Unsere Map ins Gimp laden
Dieser Schritt ist auch noch recht einfach. Haben wir wie in unseren Tutorial eine Map die nur 20x15Felder groß ist können wir einfach unsere Heldenparty auf keinen Helden stellen und unsere Startposition einfach in den Raum setzen. Dann machen wir in Vollbildmodus noch nen Screenshot von der Map (mit der Taste "Druck"), dann fügen wir es einfach in das Bildbearbeitungsprogramm ein und stellen sofern der RPG-Maker in 640x480 gestartet wurde die Größe des Bildes auf 320x240.
Was ber tun wir wohl wenn unsere Maps größer ist? Jedesmal die einzelnen Bildschirme ablaufen und abfotografieren ist etwas stressig (besonders wenn man Karten wie 500x500 Felder hätte). Für diesen Fall nutzen wir einfach den Mapexporter den ihr auch schon auf den Bild sehen dürftet. Er hat allerdings Grafik-Probleme mit Autotiles, da wir aber eine Lightmap machen und das am Ende aber nicht im Spiel sieht ist das egal. Im Mapexporter wählen wir die Map aus die wir möchten, in meinen Fall wäre es die Map13, na wenn das kein Unglück bringt.
Wenn man mal nicht wissen sollte welche Map man gerade gemappt hat kann man auf den Previewbutton klicken, er zeigt dann kurz das Bild. Das Bild speichern wir dann mit den Button Export (es wird dann ein Ordner im Projekt erstellt mit den Namen "Mapexport").
3.Mit Gimp öffnen
Das Bild zu öffnen ist ja noch keine Schwierigkeit. Dazu einfach Gimp starten und dann auf "Datei" und "öffnen" oder noch einfacher einfach ein Rechtsklick auf das jeweilige Bild und "öffnen mit..." "Gimp".
4.Background vorbereiten
Ein Hinweis, arbeitet möglichst mit mehren Ebenen, dann könnt ihr nicht ausversehen eine der anderen Ebenen "kaputt" machen! Als erstes wollen wir nun den Background vorbereiten. Erstellt eine neue tranzparente Ebene die über den Bild ist und nennt sie z.b. "Background". Füllt diese mit einen fast schwarzen Ton (ich mache meist Schwarz mit einer Helligkeit +8).
Jetzt denkt ihr sicherlich: "Wieso sollen wir eine ausgemalte Ebene erstellen? Dann sehen wir ja garnicht wo wir Licht/Schatten hinsetzen müssen." ihr habt momentan recht. Aber ihr habt sicher auch im Ebenen Menü den Regeler "Deckkraft entdeckt". Stellt diesen solange wir arbeiten auf ca. 50.
5.Rahmen für die Map.
Wie ihr sicher ja schon gesehen habt, haben wir so einen Schwarzen Rahmen um unsere Map. Dieser Schritt ist nur wichtig wenn wir solchen oder einen ähnlichen Rahmen haben (wie z.b. bei Mac&Blues Waldchipset). Sollte eure Map so etwas nicht besitzen könnt ihr den Schritt auch überspringen. Für das Tutorial hab ich natürlich ein Beispiel gesucht das so etwas besitzt.
Erstellt nun erstmal wieder eine neue tranzparente Ebene (WICHTIG sie muss zum Schluss ganz oben liegen). Wählt dann das Auswählentool und wählt jeweils immer die Bereiche aus die aus den Randmaptiles (oder wie man sie auch nennen möchte) bestehen. Füllt diese dann mit einer Farbe die wir nicht für Licht oder Schatten brauchen werden (in meinen Beispiel wäre das z.b. Rot). Wie das ganze etwa auszusehen hat seht ihr auf den Bild.
6.Endlich kommt auch Licht (Fenster)
Endlich kommen wir dann nunmal zum Licht und diese Sache ist viel einfacher als man meist glauben mag. Erstellt wieder eine neue tranzparente Ebene und nennt diese "Licht". Die Ebene muss über Background und unter Rahmen liegen. Stelle diese dann noch auf eine Deckkraft von ca. 60 bis 70.
Für das Fenster nehmen wir das Auswählentool. Wir makieren das Fenster und gehen noch ein Stückchen weit hinunter. Nehmt nun die Farbe Weiß. Statt diesmal einfach auszufüllen nehmen wir das Farbverlauftool. Dort steht nochmal in den Einstellung zu den Farbverlauftool "Farbverlauf". Wählt dort den Farbverlauf aus wo erst Farbe ist und dann die Tranzparenz (damit sieht es aus als würde das Licht je weiter er hinein scheint ausklingen.). Sucht nun aus den Auswahlbereich etwa die Mitte heraus und zieht dann mit einen Gedrückten Mausklick bis zum Ende des Auswahlbereichs.
Wählt nun wieder das Auswahltool und klickt in einen nicht ausgewählten Bereich um das Auswahlviereck wegzumachen. Nun sieht unser Fensterlicht ja nun leider noch etwas eckig aus.Wählt nun das Weichzeichnentool aus (das Symbol ist der Tropfen). Geht nun mit gedrückter Maustaste über die Ränder des Lichtstreifen. Danach wirkt der Lichtschein schon viel weicher und realistischer. Wie das ganze aussehen sollte seht ihr hier:
Was machen wir aber wenn ein Fenster sich unten befindet oder gar an der Seite eines Raums? Wir müssen natürlich immer bedenken, scheint die Sonne/der Mond/eine nahe stehende Lichtquelle überhaupt in das jeweilige Fenster. Wenn nicht können wir das auch weglassen. Es sähe immerhin komisch aus wenn aus der Sonnenseite Licht ins Zimmerstrahl und von der andern Seite ebenfalls. Ein Fenster von unten ist einfach. Es ist ähnlich wie der Lichtschein nach oben nur das wir diesmal von der mitte des Auswahlbereichs bis zum oberen Rand des Auswahlbereichs gehen. Aber für das Beispiel tu ich das nicht extra zeichen da ich mich nun auf ein Sonneneinfall von oben entschieden hab. Sagen wir aber mal es scheint noch in die Seitenfenster. Natürlich sähe es dort komisch aus einfach nur eine gerade reinscheinen zu lassen. Die Sonne liegt ja schließlich nicht auf den Boden neben der Hütte. Dafür gibt es ein einfachen Trick. Da wird ja nun keine vorlage für die breite des Fensters haben improvisieren wir mit der Breite des Lichteinfalls. Also wir wählen wieder mit den Auswahltool ein Rechteck und zeichen also nun diesen steifen Lichteinfall. In mein Beispiel nehmen wir ein Fenser das Links liegt. Wir gehen dann also in den Auswahlbereich mit den Farbauswahltool von der Mitte zum rechten Rand des Auswahlbereichs. Nachdem das getan ist haben wir also nun den steifen Lichteinfall. Das sieht ja wie gesagt allerdings merkwürdig aus. Nun nehmen wir also das drehen Tool und klicken die Auswahlfläche an. Nun wählen wir ein Winkel. Achtet aber darauf das der Lichtstrahl am Ende noch richtigrum verläuft. Wenn wir fertig gedreht haben schieben wir die Fläche mit den verschieben Tool so das sie unter den Roten Rahmen beginnt und erst dann anfängt wenn auf beiden Seiten (rechts und links) die Schräge nach unten los geht. Jetzt wählen wir wieder das ganze Bild aus und machen wieder das Licht weicher.
7.Endlich kommt auch Licht (Löcher in der Wand)
Wir haben indirekt ja schon ein bisschen Licht aufgrund des Chipsets auf den Boden liegen. Diese Punkte können wir gut zur orientierung nutzen. Wir wählen einen Pinsel und versuchen etwa die Lichter auf den Boden, sowie die Löcher auf der Wand mit weiß nachzumalen. Wenn dies Getan ist nehmen wir wieder das Tool zum weich machen. Und ratet mal... Wir machen die Flächen natürlich weich. Das ganze sollte dann so aussehen.
8.Schatten (Objekte)
Wo Licht fällt gibt es meist natürlich auch einen Schatten. Keine Sorge das ist auch viel einfacher als man glaubt. Erstellt wieder eine neue tranzparente Ebene und nennt diese "Schatten". Die Schatten Ebene sollte zwischen Background und Licht liegen, ebenfalls sollte die Ebene eine Deckkraft von 60-70 besitzen. Für Objektschatten nehmen wir den Pinsel und eine komplett schwarze Farbe (also Helligkeit diesmal + 0). Nunmalen wir die Schatten so das sie vom Schatten weggehen. (Es muss nicht umbedingt exakt die richtige Gradzahl sein, niemand wir mit einen Winkelmesser euer Spiel spielen und nachmessen.). In Licht leeren Räumen braucht ihr den Objekten keine Schatten zeichen die vom Licht weg gehen. Wenn wir am Ende mit den Pinsel die groben Schatten gemalt haben nehmen wir wieder das Tropfentool und machen alles weicher.
9.Schatten (Lichtleere Räume)
Natürlich sieht es ja im Moment noch merkwürdig aus das die Lichtleeren Räume genauso hell sind wie die Licht gefüllten Räume und auch das Wände oder Räume in denen nur wenig Licht ist nicht zummindest an der Wand wo kein Licht rein kommt keinen Schatten werfen. Für die kleine Abstellkammer Map nehmen wir einfach das Auswahltool und makieren den Raum. Gehen mit der Maus wieder etwa in die Mitte und ziehen dann wieder zum unteren Rand einen schwarzen Farbverlauf. Ob ihr diesmal in solch einen Fall mit den Tropfen rüber geht ist euch überlassen. Für den Flur nehmen wir einfach einen Auswahlbereich von der rechten Wand bis zur Eingangstür. Diesmal ziehen wir von der Mitte einen Farbverlauf nach links-unten da auch das Licht in den Raum schräg einfällt. Wenn wir das haben sieht es erstmal so aus.
Nun lassen wir noch die Randwände einen Schatten werfen. Wir ziehen diesmal an den Wänden die am weitesten vom Licht entfernt sind einen dünnen Farbverlauf. Das ganze ziehen wir diesmal wieder mit den Tropfen weicher. Sieht dann etwa so aus.
10.Die Lightmap ins Spiel bekommen
Sowie unsere Lightmap jetzt ist können wir sie schlecht ins Spiel packen, schon allein da unser Screenshot noch darin ist. Dazu gehen wir wieder auf die Ebene Background und ziehen die Deckkraft dieser Ebene auf 100%. Nun speichern wir das ganze so als PNG ab.
Aufgrund des hellen Hintergrundes des Forums erkennt man den Schatten auf den nur schlecht, er ist aber noch vorhanden da wir ihn mit ein andern Schwarz als den Background bezeichnet haben
Wir können Gimp nun schließen. Wir müssen das Bild nun noch mit Irfanview oder einen anderen Programm das die Farbtiefe reduzieren kann öffnen und die Farben auf 256Farben. Der Schatteneffekt leidet darunter leider etwas, das Licht aber nur kaum. Aber anders können wir das ganze nicht in den RPG-Maker bringen. Wir gehen jetzt nun also zum RPG-Maker und drücken oben auf die Fläche Resourcen Importieren, gehen dann auf den Ordner Pictures, dann den Button importieren, dann die Lightmap mit reduzierten Farben wählen und geht sicher das die rote Farbe tranzparent ist (wenn nicht einfach draufklicken auf die rote Fläche). Dann drückt ihr ok. Die Grafik ist nun im Pictures Ordner und die Tranzparenz ist rot.
Wenn wir eine kleine Map (20x15) haben: Nun erstellen wir auf der Map ein Event das ein Paralleler Prozess ist. Wir wählen dabei eine Bildhöhe die recht weit oben liegt aber noch unter den Interface (sofern vorhanden) ist. Z.b. Höhe 20. Bei Tranzparenz stellt ihr ein das es Tranzparenteflächen geben soll und die Tranzparenz in % sollte ca. 50% sein. Das Bild sollte dabei auf den Kordinaten 160x120 liegen. Danach fügt ihr noch ein "Event Löschen" Befehl ein damit das Bild nicht permanent aufgerufen wird um Performence Probleme zu beseitigen. Wenn ihr also nur eine kleine Map hab seit ihr fertig.
Wenn wir aber eine Große Map (>20x15) haben: Wir erstellen das Map auf der Mitte der Map und stellen es auf Paralleler Prozess. Nun lassen wir Variablen erzeugen. Wir benötigen einmal die Variable "LightX", ihr nehmt die Rechenoperation "Wert" und unter Befehl wählt ihr das Vorletzte und unter den Menüpunkten "Dieses Event" und "XPixel". Dann brauchen wir noch das selbe mit einer Variable "LightY" nur das wir dort statt "XPixel" "YPixel" wählen. Da er nun aber nur die Mitte von den Feld aussucht (ein Feld 16x16Pixel sprich also er nimmt 8x8Pixel von den Feld) würde das Bild nun Asyncron liegen. Um das zu ändern fügen wir nun danach nochmal die Variablen an und lassen sie noch -8rechnen (X nur wenn die Map größer als 20 ist und Y nur wenn die Map größer als 15 ist). Sollten wir aber eine Map mit ungerader Größe haben wird es sicher schon Probleme gegeben haben das Event auf die Mitte zu setzen. Für diesen Fall rechnen wir einfach noch danach -16 der jeweiligen Reihe die eine ungerade Zahl besitzt. (z.b. wenn die Map 31x20 groß ist müssen wir die X Variable noch zu den -8 nochmal -16 bzw. +16 rechnen, je nachdem auf welches der beiden Mittelfelder das Event liegt). Nun lassen wir das Picture wie bei der kleinen Map anzeigen nur das die Position nun aus Variablen gelesen werden soll nämlich "LightX" und "LightY". Danach wird auch das Event wieder gelöscht. Ich hoffe ich konnte euch helfen Lightmaps für eure Projekte zu erstellen.
PS: Bei Fragen stehe ich natürlich zur verfügung. Ebenso könnt ihr ruhig Rechtschreibfehler und Grammatikfehler korrigieren und auch Vorschläge geben wenn ihr noch eine andere eventuell andere oder bessere Variante kennt.
*Für alle die nicht googlen wollen.
Downloads:
http://rpga.info/forum/showthread.php?t ... p+Exporter
http://www.gimp.org/downloads/
http://irfanview.de/
**Für den RPG-Maker selbst gebe ich keinen Link an da dies ein Programm ist das man normalerweise bezahlen muss. Entweder ihr kauft ihn also legal oder ihr müsst ihn ebend cracken oder sowas, aber einen Link dazu werde ich nicht teilen.
