So möchten Sie ein Pixel Künstler Photoshop Tutorials und Pixelart Tutorials sein, lächelt und pixelart
Sie wollen also ein PIXEL Künstler sein
Autor: Tsugumo
Teil 9: ein Kampfspiel Sprit zu machen
Aber lassen Sie mich zunächst darauf hinweisen, dass dies nicht nur für Kampfspiele ist. Ich verwende den Begriff die ganze Zeit, weil das ist, was ich auf die Pose / Haltung des Tutorials Sprite stützen. Diese Techniken und Konzepte können auf alle Arten von Spielen anwenden. Earthworm Jim verwendet wahrscheinlich die gleiche Art von Techniken. Denken Sie daran, lernen von allem können Sie, und passen sie an Ihre Bedürfnisse anzupassen. Nun, da das aus dem Weg ist, schauen wir uns ein paar Beispiele von Street Fighter Alpha 3 zuerst in die Nut zu bekommen:
Nun, das ist einige Pixel Geschick. Jeder Charakter hat seine eigenen einzigartigen Look. Zangief ist eine riesige Masse von Muskeln, während Sakura praktisch ein winzig kleines Strichmännchen im Vergleich ist. Beachten Sie auch den Unterschied in den Breiten zwischen den beiden. Dies sagt uns, dass der Sprites jeweils ihre eigene Größe hat, ohne wirkliche beschränkende Begrenzungsrahmen. Sakura ist 76x87 während Zangief 116x111 ist. Diese Messungen werden nur die Pixel basiert weg, jedoch. Wenn Zangief nach vorne stürmte und streckte horizontal, würde sein Sprite viel länger werden horizontal und vertikal viel kürzer. Wie auch immer, sind die Begrenzungskästen jetzt nicht wichtig. konzentrieren wir uns auf, wie man diese Dinge zu machen. Aber in meinem hält, dass der allgemeine „Standard“ ist eine Höhe von etwa 100 Pixeln. Die Breite wird in der Regel weniger, außer im Fall eines großen Charakters wie E.Honda, oder jemand, der eine Waffe trägt, die seitlich herausragt. Wie auch immer, lassen Sie uns mit 100 Pixel bleiben.
Das Verfahren nutzt Capcom ist ein Rätsel. Sie haben keine Anleitungen oder Erklärungen überall auf, wie sie ihr Sprites machen, die nicht allzu überraschend ist, weil sie bessere Dinge als Arbeit an Tutorials zu tun, heh. Ich aber nicht. Also hier ist, was mir das Sprites aus der Analyse herausgefunden und das Sammeln kleine Informationen aus dem ganzen Ort im Laufe der Jahre. Lassen Sie uns ein paar Bilder von Chun-Li aus drei (Street Fighter 3) aussehen:
(Bild klicken für Originalgröße)
Das Hauptbild von Bedeutung ist der große Chun-Li in der oberen rechten Ecke. Notieren Sie sich den Mangel an Details über sie. Wenn Sie einen Sprit machen, können Sie nur eine bestimmte Menge an Details, die nach oben zeigt. Wenn Sie ein kleines kleine 8x8 Gesicht zu tun, sind Sie nicht die Linien für die Nase zeigen, gehen zu können, warum also Zeit verschwenden zeichnen sie in? Beachten Sie die geschwungenen Linien auf ihrer Kleidung. wenn in Sprite-Form, sind die ein Pixel dicke gelbe Linien (Details auf dem Kostüme). Die Linie wird eine gewisse Dicke zu ihm haben, und wenn das Bild ein Porträt von einer Art waren, würden sie Breite gegeben werden. aber da das Sprite klein sein wird, gibt es keinen Punkt in der Linie mit einer Breite zu ziehen. Sie hat auch gelb „trimmen“ um das Tuch, das nach unten hängt. aber das wird hinzugefügt, wenn Sie die Pixel-Arbeit sind. Das erste, was Sie tun wollen, ist eine vereinfachte Art erhalten gehen, dass Sie verwenden können.
Weglaufen für einen Moment würde Ich mag zu erklären, dass viele verschiedene Arten tun Sprites sind. Die Methode, die Sie verwenden, hängt von Ihrer Spielstärke und der Größe des Sprites mit dem Sie arbeiten. Wenn Sie ein 16x16 RPG Charakter zu machen, gibt es keinen Punkt in Hand, um ihn zeichnen zunächst das Scannen ihn, dann zurückzuverfolgen. Nur mit Pixeln arbeiten. Wenn Sie keine Fähigkeit zur Hand Zeichnung haben, dann gibt es keinen Punkt in der Hand zuerst den Charakter zeichnen, weil Sie bessere Ergebnisse könnten durch nur mit Pixeln durcheinander. Zwei weitere Methoden, die Sie vielleicht ausprobieren möchten, wenn Sie nicht in Ihrer Zeichnung Fähigkeiten sicher fühlen, oder Sie haben keinen Zugriff auf einen Scanner. oder will einfach nicht die Mühe von Hand gehen jedem Rahmen zeichnen und das Scannen in (das ist ehrlich gesagt ein großer Schmerz im Hintern):
Auf der rechten Seite ist ein Scribble-Mann (heh, Fachausdruck dort). Ich benutze diese manchmal, weil sie ein wenig klarer als die Silhouette, und ein bisschen schneller zu machen sind. Es ist im Grunde kritzelt nur die allgemeine Form des Sprites aus, so dass Sie wissen, was Glieder gehen, wo und alles. Es dient dem gleichen Zweck wie die Silhouette, sondern ermöglicht es Ihnen ein wenig mehr Details zu zeigen, zu erhalten, die arm ist, ist vorne und wo Muskeln gehen würde und so. Es ist nicht besser als die Silhouette, natürlich. Es ist nur eine andere Methode, die Sie vielleicht ausprobieren möchten. Der Nachteil ist, dass, da dies im Grunde ist das, was Sie tun, wenn Sie Hand sind Zeichnung (Planung der Pose heraus zuerst), müssen Sie die Maus ein wenig besser zu handhaben zu können, weil Sie spezifische Details sind herausgezogen wird. Mit der Silhouette Methode können Sie mit einem Klecks beginnen und Pixel wegwischen oder einige in verschmieren. Wie auch immer, versuchen einige verschiedene Dinge und sehen, was gut für Sie arbeitet.
In diesem Tutorial werde ich 4.0 Photoshop benutzen, aber ich werde versuchen, nicht zu technisch schwer zu bekommen. Wenn ich spreche, Anti-Aliasing und andere Dinge, sind sie in der Regel Malprogrammen universal. Im Programm Sie verwenden, werden Sie wahrscheinlich die gleichen Dinge zu suchen haben zu finden, aber sie werden wahrscheinlich dort sein. Eine wichtige Sache zu beachten ist jedoch, dass Photoshop zu tun Sprites im Allgemeinen nicht gut ist. Der Grund dafür ist, dass viele Spiele Paletten für alles verwenden und Photoshop ziemlich Bissen für speziell zu verändern und die Palette zu organisieren. Dies ist rein, weil Photoshop ist nicht wirklich für diesen Zweck gebaut. in erster Linie ist es angeblich werden verwendet, um Fotos zu modifizieren und Illustrationen und so etwas zu machen. Palette Manipulation nicht wirklich in das Spiel, so ist es ziemlich mies zu tun Sprites in. Wenn das Spiel Sie machen keine Palette (die meisten PC-Spiele sind wie diese während Konsolen (Game Boy Advance, Game Boy, SuperNES, Genesis, etc.) verwenden Paletten), und Sie müssen nicht darum kümmern, wie viele Farben Sie verwenden und die Räume auf der Palette, die Sie verwenden müssen, dann ist Photoshop zu tun Sprites in Ordnung. Ich mag Photoshop verwendet für Sprites zu üben, weil ich zu der Einrichtung keine Sorgen über jede Farbe auf der Palette und alles, was ich würde, wenn ich ein Palette-Programm verwendet hat. Wie auch immer, wird das Sprite ich für dieses Tutorial tun, werde in Photoshop getan werden, weil eine Menge Leute es haben, und wir müssen nicht über Palette Einschränkungen oder nichts kümmern, die viel leichter machen wird erklärt. Ich werde auch eine Hand benutzt gezeichnete Bild mit zu beginnen, denn das ist, was Capcom tut und es ist eine schöne Methode:
(Bild klicken für Originalgröße)
"Nearest Neighbor" tut NO Anti-Aliasing auch immer. Dies ist sehr nützlich, wenn Sie Ihre Sprite Größe verändert werden soll, nachdem Sie eine Version machen 4x größer zu zeigen, die Menschen getan werden, damit sie ihre Nase nicht gegen den Bildschirm setzen müssen, um ihn zu sehen. Sie können auch mit ihm schrumpfen, so dass Sie einen Sprit sprengen können jemanden zu zeigen, ein Feedback zu bekommen, es dann mit ihm wieder und Chaos schrumpfen wieder, ohne überhaupt veränderten Ihre Pixel. Ich benutze diese viel für dieses Tutorial machen, heh.
„Bilinear“ und „Bicubic“ tun fast das Gleiche. Bicubic scheint mehr Anti-Aliasing zu tun. Das Bild, das ich begann mit relativ klein zu beginnen, so dass es nicht einen großen Unterschied mit diesem Sprit machen, aber wenn Sie nach unten von einem Bild schrumpfen, die wie 800 Pixel hoch ist (rechts, nachdem Sie es in scannen, können Sie bekommt ein Bild dieser Größe), wird es mehr bemerkbar sein. Das Problem mit bicubic ist, dass Sie zu viel Anti-Aliasing zu bekommen. Vergleichen Sie die shin auf ihr rechtes Bein (der im Hintergrund). Auf der bikubischen ein, ist es viel mehr verschwommen, als auf der bilinear ein. Das gleiche gilt für die Linien auf dem Arm und das Gesicht Details. Das kann lästig sein, wenn sie versuchen, um zu sehen, welche Zeilen gehen, wo für zurückzuverfolgen, so Ich mag bilinear verwenden, um ein wenig Anti-Aliasing zu bekommen, aber nicht zu viel. So, jetzt haben wir unseren Sprit (das Mädchen ist 95 Pixel hoch):
Der nette Teil über Photoshop (und einer der Hauptgründe, warum ich es für diese Technik verwenden) ist, dass Sie Schichten tun können. Die Schichten sind extrem wichtig, wenn Sie ein Bild sind zurückzuverfolgen, weil Sie Teile Ihrer Linien ohne Messing mit dem Hintergrundbild abhauen können. Wenn Sie ein paletted Programm verwenden, wird sie in der Regel nicht Schichten haben, die Sie mit verwenden können, dies zu tun, so dass Sie Art stecken, wenn Sie das paletted Programm verwenden müssen, um die Farben zu tun. Eine Idee könnte sein, die Linien in Photoshop zurückzuverfolgen, so dass Sie nur ein Schwarz-Weiß skizziert Sprite, und dann die in Ihrem paletted Programm nehmen die Farben dort hinzuzufügen. Es ist eine Menge Arbeit, aber Sie tun, was Sie zu tun haben.
Notieren Sie sich die Unterseite des Hemdes des Mädchens auf der geschrumpften Version des Bildes. In der Hand gezeichnete Version gab es eine doppelte Linie dort das Futter weiß zu zeigen, dass ich setzen werde. Aber geschrumpft wird es nur ein Blob. Der Arm ist die gleiche Art und Weise. die vertikalen Linien werden dünne weiße Linien sein, aber sie kamen als Blobs, weil sie zu dicht beieinander waren. Ich habe im Grunde es Flügel, um diese dünnen Linien jetzt tun, was ihnen eine Verschwendung von Zeit und nur vollgestopft das Bild für zurückzuverfolgen gemacht zeichnen. Aus diesem Grund Chun-Li Kleidung Details waren nur dünne Linien. Details finden Sie in der Pixelstufe hinzugefügt werden, wo es leichter zu sehen, was das Endergebnis aussehen wird.
Hier ist eine schnelle Art und Weise ich Photoshop einrichten für Bilder zurückzuverfolgen so alles ist relativ einfach. Mit dem Bild auf dem Hintergrund (stellen Sie sicher, dass Sie im RGB-Modus natürlich), um eine neue Ebene machen. Füllen Sie, dass die Schicht mit einer Farbe von einer Art (ich benutze blau). Stellen Sie die Ebene auf „Bildschirm“ (in der Drop-Down-Menü, das sagen sollte „normal“ in der Ebenen-Palette), die Sie geben das Sprite Sie zuvor, aber mit den schwarzen Linien auf Blau geändert. Dann die Schichten glätten. Der Zweck ist, so dass die schwarzen Linien, die Sie eindeutig auf dem blauen auftauchen ziehen, anstatt schwarze Pixel auf schwarze Pixel zeichnen. Sie nun eine weitere neue Ebene machen und es mit weiß füllen (was es macht, so dass Sie nicht die darunter liegende Schicht sehen). Setzen Sie diese zu „vermehren“, mit dem Sie Ihre Zeichnung wieder zeigen. Nun, wenn Sie Ihre Sprite zeichnen, verwenden diese Schicht. Sie könnten nur eine neue Ebene herzustellen und zu verwenden, dass sofort (also die Schicht transparent ist statt weiß), aber wenn Sie möchten, um ein Pixel löschen (die Sie immer wieder tun werden) Sie das Radiergummi-Werkzeug zu ändern, die eine sein kann Schmerz. Mit dieser Methode, während Sie den Weiß nicht sehen kann, ist der Hintergrund weiß. Wenn Sie die Standardfarbe Setup (klicken Sie auf die Schwarz / Weiß-Palette, was im Menü Werkzeug so die Vordergrundfarbe schwarz ist und Hintergrund ist weiß), können Sie einfach klicken Sie auf ‚X‘ und wechseln Sie zwischen den Vorder- / Hintergrundfarben. Da weiß jetzt, wie transparent erscheint, können Sie nur Pixel löschen, indem Sie ‚X‘ schlagen, setzen weiß auf sie, dann ‚X‘ trifft wieder zurück zu gehen schwarz zu verwenden. Das ist schön und schnell, wenn Sie Sprites machen. Wie auch immer, das ist die Grundeinstellung. Wenn Sie möchten, dass Ihr blau-gesäumt Bild löschen, so dass Sie Ihre Sprite allein sehen können, ändern Sie einfach die neue Ebene des Modus „normal“ statt „multiplizieren“ und die weißen wieder undurchsichtig werden. Jetzt beginnt die Verfolgung:
Der nette Teil über eine Hintergrund Zeichnung ist, dass es die Menge des Denkens reduziert was Sie tun müssen, die Dinge gehen schneller macht. Sie können nur die allgemeine Führung der Hintergrundlinien folgen und Teile reparieren, das Recht nicht aus. Denken Sie immer daran, Sie jedoch, dass das Hintergrundbild nur Referenz. Wenn etwas nicht richtig aussehen, fixieren Sie es, wenn Sie zurückzuverfolgen. Normalerweise sind die Gesichter kommen, die wie zufällige Pixel auf dem Hintergrundbild und so muss man es machen, wenn Sie zurückzuverfolgen. Man könnte sogar einen großen Teil der Pose ändern (wie ich mit dem Fuß werde Ich mag es nicht), weil es einfach nicht richtig in Pixelform sieht. Tun Sie, was am besten auf dem Sprite aussieht. Versuchen Sie auch, Blobs von Pixeln zu vermeiden. Wie in dem Arm, zog ich es einfach schnell und ohne Sie die Maustaste loslassen. Beachten Sie die Blobs von schwarzen Pixeln an allen Ecken und ein paar verirrten Pixel. Wirklich versuchen, diese Dinge zu bereinigen. Wenn Sie eine Gruppe von 4 schwarzen Pixeln haben, macht es einen wirklich visuell ablenkenden Punkt im Sprit. Man könnte sogar die Pose ändern müssen, um etwas los zu bekommen. wie wenn Sie einen Arm an einem Bein und die beiden Konturen sind neben einander richtig so, wo sie Sie eine Linie von schwarzen Pixeln 2 Pixel breit, bewegen Sie den Arm bekommen berühren oder das Bein bewegen, so dass Sie nur eine Zeile ein Pixel dick dort haben . Manchmal kann man einfach nicht vermeiden Blobs, aber die meiste Zeit können sie behoben werden. Bewegen Sie sich auf jetzt:
Hier habe ich beenden die Linien mit schwarzer zurückzuverfolgen. Es gibt Details, die ich hinzufügen werde, wenn ich die Farbe und das Gesicht ist ein wenig schwierig zu entziffern (speziell die Augen), aber sie werden besser aussehen, wenn Farbe hinzugefügt wird (und Sie das Weiß des Auges sehen. Es ‚ll wie‚oh, okay, so das schwarze Pixel links von dem weißen ist der Augapfel‘registriert geistig). Also lasst uns zuerst mit flachen Farben beginnen:
Hier habe ich in den flachen Farben gefüllt. Ich arbeite mit einem faden farbigen Hintergrund statt weiß, weil es einfacher ist, die Farben zu sehen, ich verwende. Wenn Sie an dem einen mit einem weißen Hintergrund aussehen, sehen die Farben dunkler (vor allem ihres T-Shirt), weil das Weiß im Vergleich so hell ist. Es ist ein Trick, um Ihre Augen auf Sie spielen. Durch die Verwendung einer dunkleren Farbe im Hintergrund, können Sie sehen, was die Farben tatsächlich aussehen. Lassen Sie uns also auf das Hinzufügen Schattierung verschieben:
Ich mag zunächst durch Beschattung der Haut zu starten. Es gibt keinen wirklichen Grund dafür, so beginnen, wo Sie wollen. Das Gesicht ist der schwierigste Teil einen Sprit zu tun, weil der Ausdruck lesbar sein muss, und Sie haben nur ein paar Pixel zu arbeiten. Ich benutzen einen etwas dunkleren Farbton der Hautfarbe (dunkler als die allgemeinen dunklen Schatten) für den Mund und Nase. Mit schwarz für sie macht sie ein wenig zu viel (schwarz für einen Mund es der Mund aussehen macht, ist offen) herausstehen, und die normalen dunkle Schatten unter Verwendung macht sich ein wenig zu leicht wahrnehmbar zu sein. Nun, da es für die Augäpfel weiße Pixel ist, können Sie sehen, dass sie auf der Seite suchen. So bewegen, ich Schatten, den Rest ihres:
Jetzt ist sie ein wenig mehr 3d mit der Schattierung suchen. Aber sie ist noch nicht fertig. Ich möchte ein paar Details wie Ordnung auf ihrem T-Shirt und Linien auf dem Ärmel hinzuzufügen, die wie ich schon sagte, ich an der Pixel Bühne tun, wo ich sehen kann, wie viel Platz ich habe zu arbeiten. Also hier füge ich alle Details und bekommen diese:
Ursprünglich wollte ich zwei weiße Linien ihren Ärmel hinunter haben, aber es war einfach nicht das Zimmer auf diesem Sprit, es zu tun. Es wäre zu viel weiß sein und es könnte statt wie schwarze Linien auf einem weißen Ärmel schauen, oder einfach nur zu viel von einem Klecks Farbe. Das weiße, ist reines Weiß, die hell ist, im Gegensatz viel mit der Dunkelheit ihres Hemd, so die weißen Art glüht. Es sieht fast aus wie die weiße Linie mehr als ein Pixel dick ist, aber es ist nicht. Es ist der Kontrast, den das Auge täuscht (wie ich schon erwähnt, über einen dunklen farbigen Hintergrund statt weiß zu verwenden, wenn Farbe auf das Sprit hinzufügen). Ich hätte es getönten ein wenig nach unten, aber es funktioniert, wie es ist, es ist so keine große Sache. Wenn ich auf zwei Linien auf der Hülse tot Satz war, konnte ich einfach die zweite Zeile zeigen, wenn sie sich die Kamera mehr ihre Seite hat, so ist es wie die andere Linie um die Biegung ihrer Hülse ist, wo kann der Betrachter nicht sehen es jetzt. Ich habe etwas Futter ihre Schuhe, sowie ihre Jacke und änderte die schwarzen Linien auf ihrer Hose gerade Linien dunkel schattierte für die gleichen allgemeinen Gründe dafür, dass ich die Mund / Nase einen Schatten statt schwarz. Schwarz zeichnet sich durch ein wenig zu viel. Das letzte, was Sie vielleicht zu tun ist, um die Umrisse machen gefärbt:
Persönlich mag ich nicht die farbigen Konturen. Capcom nutzt sie, und wenn sie sie benutzen, sie sehen toll aus, heh. Ich habe nicht ganz den Trick, um es herausgefunden (obwohl ich ziemlich sicher bin einfach viel viel dunkleren Farben für die Umrisse verwenden müssen) und Ich mag das Aussehen der schwarzen Linien. Mit den farbigen Linien wird, alles verschwommen Art aus, und es gibt nicht so viel Definition in welchem Kleidungsstücke, wo und alles beginnen. Plus, wenn Ihr Hintergrund ist rot und alle Ihre rote Kleidung ist rot umrandet, wird es ein wenig seltsam aussehen. Mit schwarz ist das einzige wirkliche Problem, wenn Ihr Sprit über einen schwarzen Bereich geht, und es ist leichter zu vermeiden als ein Bündel von verschiedenen Farben. Aber noch einmal, das ist nur eine persönliche Präferenz und ich weiß nicht recht, die Technik für farbige Konturen immer noch schön aussehen. Wie ich schon gesagt habe ein paar Mal jetzt, das zu tun, was für das Sprit am besten aussieht.
Autor dieser Seite hatte die Erlaubnis bekommt dieses Tutorial hier zu hosten. Um das Tutorial an Ihrer Seite, die Sie Erlaubnis von seinem Autor suchen müssen.