collapse collapse

 Community


 User Info




Willkommen Gast. Bitte einloggen oder registrieren.

 Partnerseiten

rpgvx.net

Das Forum ist offline

Autor Thema: Wie mache ich meinen eigenen Char? (Pixeln)  (Gelesen 4131 mal)

Offline CaK

  • Database-Verunstalter
  • **
  • Beiträge: 104
  • Promenadenchamp
Wie mache ich meinen eigenen Char? (Pixeln)
« am: November 30, 2008, 12:14:57 »
Einleitung

Das Pixeln oder Verändern von Charsets ist für viele Makerer, Einsteiger, aber auch Fortgeschrittene, oft ein Buch mit sieben Siegeln. Viele trauen sich nicht an dieses Thema heran oder sind schnell demotiviert, wenn sie bemerken, dass ihre ersten Versuche nie so gut aussehen, wie die Charsets im RTP und deswegen für ihre Spiele unbrauchbar sind. Dabei ist gerade die grafische Umsetzung des Spiels ein wichtiger Aspekt, der oft auch die gewisse "eigene Note" mit sich bringt.
Genauso, wie Mappen oder das Umgehen mit Events, hängt das Pixeln von Charsets aber nur zu einem sehr kleinen Teil mit Talent und zu einm großen Teil von der Übung ab.
In diesem Tutorium möchte ich Einsteiger (im Gebiet Pixeln) etwas an das Thema heranführen und ihnen die ersten Schritte mit auf den Weg geben, um ihre eigenen Charsets erstellen zu können, bzw eine Grundlage zum Üben zu bekommen. Ich weiß, dass meine Pixelein keineswegs perfekt sind, aber sie sind zumindest RTP-kompatibel, das heißt, die Charsets, die nach diesem Tutorial entstehen sind mit den RTP Chars zusammen benutzbar, ohne groß unangenehm aufzufallen.

0. Material
Für alles, was ihr in diesem Tutorial lesen werdet benötigt ihr ein Grafikprogramm, welches über Paint hinausgehen sollte. Nützlich sind:
www.gimp.org
www.chip.de/downloads/Paint.NET_13015268.html
www.humanbalance.net/gale/us
oder jegliche Photoshop Varianten (die aber nicht Freeware sind)
Für mein Tutorium werde ich GIMP benutzen, die Schritte werden aber auf allen angegebenen Grafikprogrammen ähnlich sein.

Für den Teil 2. werdet ihr ein Template benötigen, ich benutze:

von Enterbrain/Mack

1.1. "Frankenspriting" oder: "Die Haare sind toll und der Körper..."

Euch gefällt die Frisur eines Charsets, aber die Kleidung passt nicht dazu? Kein Problem. Öffnet in eurem Grafikprogramm die beiden Charsets, von denen euch Teile gefallen.
Als Beispiel nehme ich die "Actor1" Charsets aus dem RTP und werde die Frisur von Ralph (oben links) mit dem Körper des grünhaarigen Mannes mit der Narbe auf dem Auge (auch bei "Actor1") kombinieren.
Zunächst zoomt ihr mit der Lupe so nah an das zu editierende Charset heran, dass ihr pixelgenau arbeiten könnt. (8 fache Vergrößerung, mindestens.)
Benutzt das Auswahl Tool (Rechteckige Auswahl oder für die mit geschickten Händen auch das "Lasso", die Freihandauswahl) und zieht einen Rahmen um die Haare des ersten Charsets, in der ersten Reihe:
Spoiler for Hiden:

Mit gehaltener SHIFT (Großbuchstaben) Taste wiederholt ihr diesen Vorgang bei allen vier Richtungen eures Charsets. Die Augen sind eine gute Orientierung. Denkt daran, immer SHIFT gedrückt zu halten!
Spoiler for Hiden:

Habt ihr das geschafft, wählt ihr das Radiergummi aus. Achtet darauf, dass bei dem Feld "Harte Kanten" ein Häkchen ist. Radiert nun, Pixel für Pixel in eurer Auswahl alle Pixel weg, die nicht zu dem Gesicht oder den Haaren gehören (also Teile der Kleidung, die ihr mit ausgewählt habt. Wenn ihr vorher die freihandauswahl benutzt habt, ist dieser Schritt überflüssig.
Ist euer "Ausschnitt" sauber, drückt "strg+x" , um eure auswahl auszuschneiden. Mit "strg+v" fügt ihr sie wieder ein. Da ihr ein Grafikprogramm
benutzt, welches Ebenen unterstützt (deswegen ist MS Paint schlecht ->), drückt ihr auf "Neue Ebene".
Spoiler for Hiden:

Als nächstes verschiebt ihr diese Ebene (mit dem Verschiebetool ('m') so, dass sie auf dem Körper eurer Wahl sitzt. Wieder sind die Augen ein guter Anhaltspunkt, um wirklich passend zu verschieben.
Wechselt nun auf die untere Ebene (auf der alles außer die ausgeschnittenen Köpfe ist!) und löscht ggf. alle überstehenden Pixel des alten Kopfes. Dies könnt ihr (elegant) mit einer Auswahl und der Taste 'entf' oder (weniger elegant) mit dem Radiergummi tun.
Spoiler for Hiden:

Als letztes folgt der wahrscheinlich für Anfänger schwierigste Schritt. Ihr müsst ausbessern. Meistens (wie auch in unserem Fall) passen die haare nicht perfekt übereinander. Mit Pipette und (1 Pixel-großem) Bleistift werdet ihr das aber auch hinbekommen. Füllt die Pixel, die jetzt noch transparent sind mit der passenden Farbe. Der Haarrand ist meist die dunkelste Farbe der Haare, bei der Kleidung genauso. Falls ihr hiermit wirklich schwerwiegende Probleme haben solltet, lest "2. Pixeln", vielleicht hilft euch das bei dieser Arbeit.

Als Resultat habt ihr einen neuen Sprite, der eurem Spiel schon sehr viel mehr Persönlichkeit geben wird, als der olle Ralph aus dem RTP:
Spoiler for Hiden:

Speichert dieses Charset am besten auf eurem Desktop  oder einem dafür angelegten Ordner (nicht einfach in dem RTP Ordner speichern!) und im .png Format. Ihr werdet von eurem Grafikprogramm gefragt, ob die datei in .png exportiert werden soll, da klickt ihr einfach immer auf OK.

Als letztes geht ihr in den Maker, auf den Ressource Manager und importiert euer Charset.
Geschafft.

"2. Pixeln" folgt später in einem neuen Post!
Ich hoffe, der Anfang dieses Tutoriums hat einigen von euch etwas geholfen und wir werden weniger Ralphs sehen! Schreibt eure Meinungen und Anregungen dazu bitte in diesen Thread. Es folgt noch ein Tutorium über das komplette Selbstpixeln von Chars auf einem Template. Wenn ihr noch andere Wünsche für Tutorien haben solltet, schreibt es einfach.
« Letzte Änderung: November 30, 2008, 13:57:22 von CaK »



Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline CaK

  • Database-Verunstalter
  • **
  • Beiträge: 104
  • Promenadenchamp
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #1 am: November 30, 2008, 12:15:19 »
2. Pixeln

Jetzt geht es an wirklich kreative Arbeit. Das eigenständige Pixeln von Charsets ist nicht leicht und erfordert etwas Übung. Ihr werdet aber selbst sehen, dass ihr immer besser werdet, wenn ihr bereit seid, zu lernen.

2.1. Öffnet das oben gepostete Template mit eurem Grafiprogramm. (Hier geht zur Not auch MS Paint :D ) Unter 'Bild'->'Modus' stellt ihr "RGB" ein, sollte etwas anderes ausgewählt sein! (WICHTIG!)
Ein Charset besteht aus den vier Grundteilen: Haare (und Gesicht), Oberkörperbekleidung, Hose, Schuhe.
Für jedes dieser Teile müsst ihr eine Farbpalette auswählen. Am leichtesten ist es, sich hierfür am RTP zu bedienen. Wenn ihr eure eigenen Farbpaletten erstellt, kann es leicht passieren, dass die Farben zu wenig Kontrast haben, zu dunkel sind oder nicht zu den Farben des RTP passen. Für die einzelnen Teile brauchen wir etwa: 4-5 Farben für Haare, 3-5 Farben für Oberkörperbekleidung, 3-5 für die Hose, 2 für einfache Schuhe. Diese Werte solltet ihr als Richtwerte nehmen, Sprites mit zu wenigen verschiedenen Farbtönen wirken schlecht schattiert, Chars mit zu vielen Farbtönen wirken oft unsauber oder verwischt.
Sucht euch also für jeden Teil des Charsets eine entsprechende Farbpalette zusammen (aus bestehenden RTP Charsets).
Spoiler for Hiden:
(achtet auch auf die Bleistifteinstellungen (1 Pixel))

Hinweis: Wer mit denkt, macht alle folgenden Schritte jeweils auf einer eigenen Ebene, um später die einzelnen Teile leicht austauschen zu können und somit die Anzahl seiner Charaktere zu vermehren!

2.2. Die Haare
Eurer Kreativität sind kaum Grenzen gesetzt, was die Form der Haare angeht. achtet darauf, nicht ZU ausgefallene Frisuren zu wählen. Je komplexer die Frisur, desto schwieriger wird es, sie umzusetzen! Nehmt die dunkelste Farbe eurer Haarpalette und "pixelt" (also wirklich Pixel für Pixel -> nah ran zoomen!) den Umriss eurer Frisur. Füllt den Umriss mit der zweithellsten (bei 5 Farben) bzw der hellsten (bei 4 Farben) Nuance eurer Haarpalette.
Das Ergebnis könnte so aussehen:
Spoiler for Hiden:

Jetzt wird es schon schwieriger. Bei dem nächsten Schritt machen die meisten Anfänger Fehler. Es geht darum, den Haaren eine Schattierung und damit eine Struktur zu geben.
FALSCH ist es, wenn ihr die Haare einfach von außen nach innen heller werden lasst. Dieses Vorgehen nennt sich "Pillowshading" und wird 8aus welchem Grund auch immer) sehr oft benutzt. Es sieht nicht besonders gut aus und ist technisch auch eher falsch. Die Lichtquelle im RTP befindet sich immer oben links, NICHT in der Mitte vorne.
Hier ein Beispiel für Pillowshading, so sollte es NICHT aussehen:
Spoiler for Hiden:
Bitte NIE so shaden. Weder bei Haaren noch bei Kleidung, noch bei irgendetwas anderem, als einem Kissen. Es sieht nie gut aus.

Stattdessen nehmen wir lieber unsere 2. dunkelste Farbe und beginnen, 1. das outline (also die dunkle Umrandung) oben (da wo das Licht herkommt) etwas aufzulockern. dazu noch an der Unterseite der Haare einige schattige Pixel und wenige, um die Einteilung der Haare (Scheitel? Strähnen?) anzuzeigen:
Spoiler for Hiden:
Es hilft jederzeit, sich einen der Charaktere im RTP anzusehen (ZOOM) und zu schauen, wie es dort gemacht ist.

Als nächstes folgt die nächstdunklere Farbe. Sie gibt dem Haar die endgültige Form. Die eben gemachten Ansätze sollten verstärkt und ausgebaut werden. Achtet aber auch darauf, nicht alles mit dieser Farbe voll zu malen. Ihr könnt auch weitere Strähnen mit dieser Farbe hinzufügen. Gebt euren haaren hier auch eine eindeutige Richtung (meistens won oben nach unten!)
Spoiler for Hiden:

Eigentlich ist die Frisur soweit fertig. Habt ihr noch eine fünfte, sehr helle farbe, könnt ihr mit ihr noch Highlights setzen. Diese sollten entweder einzelne Strähnen betonen (siehe Ralph im RTP!) oder die runde Form des Kopfes betonen (siehe Screenshot). Auch wichtig, aber oft vergessen: schattiert das Gesicht unter den Haaren. Haare werfen einen Schatten auf das Gesicht, vergesst ihr diesen, wirken die Haare aufgelegt und als würden sie nicht zum Sprite gehören.
Spoiler for Hiden:

Es hilft immer, sich den Char auch einmal in Originalgröße anzusehen (also auf 200%, wie im Maker), um zu erkennen, ob es später gut aussieht oder nicht. Gerade Haar sind sehr schwierig und erfordern viel Übung, also probiert verschiedene Frisuren in verschiedenen Farben aus, um ein Gefühl dafür zu bekommen. seht euch auch immer im RTP die Frisuren an, um Ideen zu bekommen. Auch die Augen könnt ihr färben, wie ihr möchtet, es empfiehlt sich aber, zwei Farben zu wählen, die auch sonst in dem Sprite vorkommen.

2.3. Oberkörperbekleidung

Dieser Schritt ist (wie die folgenden) aufgrund der geringen Größe und der damit verbundenen detailarmut der RTP Sprites nicht allzuschwierig. Für den Anfang versuchen wir, ein einfaches T-Shirt. Spätere Kleidung und eventuell Rüstungen oder Umhänge lassen wir erst einmal weg.
Nehmt die dunkelste Farbe eurer gewählten Palette für die Oberkörperbekleidung. RTP Sprites besitzen immer eine recht dunkle Außenlinie (Outline), um sie von den Tilesets abzuheben. Deswegen könnt ihr, wie schon bei den Haaren, erst den Umriss zeichnen und ihn dann mit der hellsten (zweithellste, wenn ihr mehr als vier Farben habt) Farbe füllen.
Spoiler for Hiden:

Bedenkend, dass wir nicht von außen nach innen heller werdend schattieren, benutzen wir die zweitdunkelste Farbe, um dem T-Shirt eine Form zu geben, Falten anzudeuten und Es an den Kanten etwas runder aussehen zu lassen:
Spoiler for Hiden:

Mit der letzten noch unbenutzen Farbe verdeutlichen wir die eben angesprochenen Effekte und geben dem T-Shirt seine endgültige Schattierung.
Hierbei könnt ihr je nach Geschmack mehr oder weniger Falten und Schatten hinzufügen.
Spoiler for Hiden:

Damit ist euer T-Shirt fertig. Probiert ein bisschen herum, manchmal sieht es gut aus, manchmal nicht, seht euch an, was nicht gut ausseht und was gut ausseht und versucht daaus zu lernen (ich finde das T-Shirt hier in meinem Beispiel gerade nicht so gut :D )


2.4. Die Schuhe


Wir überspringen erst einmal die Hose und gehen zu dem leichtesten Part, den einfachen Schuhen. Seht euch die Füße an. Nehmt eure beiden Schuhfarben und malt den fuß mit der dunkleren aus. Ein Pixel in der helleren farbe an die schuspitze oder in die Mitte des Schuhs reicht schon.
Spoiler for Hiden:

2.5 Die Hose

Eine einfache Hose zu erstellen läuft ähnlich wie das T-Shirt. Ein dunkles Outline, mit der hellsten farbe Füllen. Mit der zweitdunkelsten farbe etwas schattieren, Falten andeuten, mit der zweithellsten Farbe dann verdeutlichen. Eine Beispielhose wäre diese hier:
Spoiler for Hiden:
Hosen erscheinen meistens auf der Innenseite dunkler, als auf der Außenseite der Beine. (Logisch oder?)

2.6 Der fertige Sprite!
Euren fertigen Sprite speichert ihr wieder als .png Datei ab. Denkt daran vor den Dateinamen ein $ zu machen.
Auf die anderen Richtungen gehe ich erstmal nicht näher ein, da die Vorgänge eigentlich immer die gleichen sind. wenn es dazu aber noch größere Fragen gibt, kann ich gerne dazu auch noch etwas schreiben.
Probiert viel aus und zeigt gerne auch eure Ergebnisse, damit ihr feedback bekommt, welches euch hilft, besser zu werden. Mein fertiger Beispielsprite sieht jetzt so aus und ist (bis auf das T-Shirt, das ich immer noch hässlich finde :D ) ein netter NPC in jedem Spiel:
Spoiler for Hiden:

Mit freundlichen Grüßen CaK
 
« Letzte Änderung: November 30, 2008, 13:59:12 von CaK »



Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline FL3X

  • Zahnfee
  • Mr. MACK-Tile
  • ***
  • Beiträge: 243
  • Spriter
    • RPG PIXEL
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #2 am: November 30, 2008, 12:59:59 »
Schaut schonmal sehr gut, du hast alles wichtige drin uns super erklärt, bin schon auf Teil 2 gespannt.





Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline Sk!p

  • Foren-ReArchitekt
  • VX-Großmeister
  • *****
  • Beiträge: 975
  • Mit(t)arbeiter schreibt man mit einem T =P
    • Foren-ReArchitekt
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #3 am: November 30, 2008, 13:52:32 »
Sieht ja an sich nicht schlecht aus.
Aber die Bilder sind VIEL zu groß...

Will man sich ein Bild komplett ansehn, ist das nicht möglich.
Man muss nach unten Scrollen... dort zur seite Scrollen
und dann wieder nach oben zum Bild um sich die Fehlende Helfe anzusehen.

Das Ganze wiederholt man dann in umgekehrter Reihenfiolge, um den
Text weiter lesen zu können.
Also Tut mäßig ja nicht schlecht, aber das sollte evntl behoben werden.

Sk!p

Klischee Antagonist! | Back From Hell To Conquer The World!


Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline CaK

  • Database-Verunstalter
  • **
  • Beiträge: 104
  • Promenadenchamp
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #4 am: November 30, 2008, 13:56:27 »
Hm, bei mir isses okay, hab wohl ne höhere Auflösung, als du... jedenfalls sindse so, dass ich nicht scrollen muss. Wüsste jetzt auch nicht, wie ich das ändern kann, ohne jedes Bild manuell kleiner zu machen und nochmal hoch zu laden (was ich nicht tun werde)... wenns dir hilft, würd ich die Bilder alle in Spoiler packen, aber ich weiß nicht, ob dich das weiterbringt. Werds mal trotzdem machen.



Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline Sk!p

  • Foren-ReArchitekt
  • VX-Großmeister
  • *****
  • Beiträge: 975
  • Mit(t)arbeiter schreibt man mit einem T =P
    • Foren-ReArchitekt
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #5 am: November 30, 2008, 14:06:01 »
Naja das würde vllt nicht so wuchtig wirken
und man könnte die Texte flüssiger lesen.

An der Größe ändert es ja nicht, und es treibt vllt ein
wenig die Ladezeiten hoch, aber es wäre ein anfang ;)

Sk!p

Klischee Antagonist! | Back From Hell To Conquer The World!


Re: Wie mache ich meinen eigenen Char? (Pixeln)

Aliog

  • Gast
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #6 am: Juni 26, 2009, 18:50:04 »
Fett hat mir richtig weiter geholfen =) :D gäbe es n bedanke button hätte ich mit freude raufgedrückt xD

haurein

Re: Wie mache ich meinen eigenen Char? (Pixeln)

Bilbo

  • Gast
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #7 am: Juli 01, 2009, 19:07:27 »
Sehr gutes Tutorial, Respekt!
Werde mich gleich auch mal an meinen ersten Charakter ranwagen, dein Tut hilft mir dabei schon ganz schön!

MfG

Thread Gefällt mir^^

Hammeli

  • Gast
Thread Gefällt mir^^
« Antwort #8 am: Juli 12, 2009, 02:40:15 »
Super Thread, hilft bestimmt, hier nochmal eine alternative für entweder Faule oder die die nur schnell nen char machen wollen
http://www.famitsu.com/freegame/tool/chibi/index1.html ist auf japanisch oder so, aber ganz einfach zu verstehen^^
MfG Hammeli

Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline DarkSun

  • Database-Verunstalter
  • **
  • Beiträge: 165
  • Mapping ist geil :D
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #9 am: Juli 13, 2009, 20:12:24 »
Alsoo..ich muss sagen sehr schönes Tutorial.
Aber wie lange hast du dafür gebraucht? 2 Tage?
Ich hätte das gar nicht hingekriegt so ein langes Tutorial zu schreiben.
Und es gibt noch eine andere Website wo man auch Char Sets gestalten kann, nur dort muss man
ein Screenshot des Bildschrims machen und das Bild des Char Sets ausschneiden.
Ich poste trotzdem den Link mal rein. Hier: http://him2.sakura.ne.jp/s_gousei/ oder du guckst hier:
http://www.rpgvx.net/index.php/topic,3565.0.html

MFG
DS
MEINE PAINT.NET SEITE GEHT WIEDER ONLINE :D
http://paintnetkreationen.jimdo.com/news/

Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline CaK

  • Database-Verunstalter
  • **
  • Beiträge: 104
  • Promenadenchamp
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #10 am: Juli 15, 2009, 00:25:13 »
Aber wie lange hast du dafür gebraucht? 2 Tage?
Also das Tutorium hab ich so an einem Nachmittag geschrieben, mit Screenshots und allem. Ist ja nicht das erste, das ich gemacht habe, deswegen kommt man eigentlich recht schnell voran... :)



Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline Vongarnichts

  • Animator
  • Event-Jongleur
  • **
  • Beiträge: 89
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #11 am: Oktober 31, 2009, 10:39:44 »
Also erstmal großes Lob von mir.
Das ist echt genial und sogar ich bekomme es mit dem Tutorial hin.

Mfg Vongarnichts

Re: Wie mache ich meinen eigenen Char? (Pixeln)

Offline timas

  • Der Meister
  • Database-Verunstalter
  • **
  • Beiträge: 133
  • Ich bin Tima!
Re: Wie mache ich meinen eigenen Char? (Pixeln)
« Antwort #12 am: November 07, 2009, 11:21:39 »
tolles Tutorial zum Pixel ich kann nichts dagegen sagen

mfG
Timas

 


 Bild des Monats

rooftop party

Views: 3614
By: papilion

 Umfrage

  • Wer soll das BdM gewinnen?
  • Dot Kandidat 1
  • 3 (25%)
  • Dot Kandidat 2
  • 1 (8%)
  • Dot Kandidat 3
  • 2 (16%)
  • Dot Kandidat 4
  • 0 (0%)
  • Dot Kandidat 5
  • 6 (50%)
  • Stimmen insgesamt: 12
  • View Topic

 Schnellsuche





SimplePortal 2.3.3 © 2008-2010, SimplePortal