So erstellen Sie einen isometrischen Pixel-Art-Baum in Adobe Photoshop

Was Sie erstellen werden

Wenn Sie Ihre eigene isometrische Pixelstadt oder kleinere Außenszenen erstellt haben oder daran interessiert sind, benötigen Sie eventuell Bäume. Sie sind ein ausgezeichnetes Dekorationsobjekt in Ihrem Pixel-Art-Inventar, da sie nahezu jede Szene aufhellen können. Sie sind einfach notwendig für größere Städte oder Stadtansichten, ganz zu schweigen von Parks und Naturszenen.

Für die Baumkrone besteht Ihr erster Instinkt darin, etwas gezacktes und unregelmäßiges Freihand zu geben, um ein "natürliches" Aussehen zu erzielen. Wir vermeiden jedoch, dass eine zufällige Form nicht immer und immer wieder gut aussehen wird.

Wir werden versuchen, mit unserem Baumdesign das Beste für unser Geld zu bekommen, mit einer relativ einfachen, symmetrischen, möglicherweise geometrischen Form, die organisch aussieht, aber bei mehrmaligem Duplizieren harmonisch bleibt.

Schauen Sie sich das Tutorial zu den Pixel-Kunst-Charakteren an, wenn Sie dies noch nicht getan haben. Hier finden Sie grundlegende Tipps und ästhetische Anleitungen sowie den immer nützlichen Charakter.

1. Abmessungen

Wir machen unseren Baum groß genug, um mehr als ein Strauch zu sein, aber nicht wirklich riesig.

Schritt 1

Weniger als die doppelte Höhe unseres Charakters sollte ausreichen. Hier habe ich die Höhen für den Kofferraum und die Baumkrone eingestellt.

Dies sind lose Richtlinien, und wir können die Größe später anpassen.

Schritt 2

Die Breite des Baumstamms sollte wahrscheinlich mehr als das Bein unseres Charakters sein. Dieser hat 4 px zwischen den Konturen.

Schritt 3

Und dies ist in etwa die Breite der Baumkrone.

2. Formen

Wir machen die Form unserer Baumkrone aus einer Gruppe von Ovalen. Es ist möglich, eine einfachere Form zu wählen, beispielsweise einen perfekten Kreis oder sogar ein Quadrat, wobei angenommen wird, dass der Baum beschnitten wurde, absolut realistisch ist. Die Cluster-Lösung sieht jedoch natürlicher aus und ergibt eine angenehme Komplexität.

Schritt 1

Hier ist das Basis-Oval, das wir verwenden werden. Das ist 24 x 18 px, Versuchen Sie es mit anderen Größen, wenn Sie möchten.

Sie könnten das Oval mit machen Elliptisches Laufschriftwerkzeug (Anti-Alias ​​aus). Dann könnten Sie es mit der Umrissfarbe füllen und die Auswahl zusammenziehen (Wählen Sie> Ändern> Vertrag… ) um ein Pixel zum Ausfüllen mit Grün. Aber ich zog es vor, mein eigenes Oval mit zu zeichnen Bleistift-Werkzeug eine etwas quadratischere und weniger gezackte Form haben.

Schritt 2

Wir werden dasselbe Oval erneut verwenden, um es unserem Cluster hinzuzufügen. Wir machen oben drei Ovale und unten fünf Ovale.

Schritt 3

Versuchen Sie so viele Alternativen wie Sie möchten, um die Ovale zu positionieren. Diese Reihe wird drei haben.

Schritt 4

Das dritte Oval in dieser Reihe wird etwas niedriger sein, um dem gesamten Cluster etwas mehr Dimension zu verleihen.

Schritt 5

Fügen Sie zum Schluss noch ein Paar für den unteren Teil hinzu. Sie können sie in eine neue Ebene einfügen, die Ebene unter die ursprüngliche Ebene verschieben und dann nach unten zusammenführen.

Schritt 6

Entfernen Sie die Richtlinien.

Schritt 7

Da der Boden ein recht breites, abgerundetes Rechteck bildet, wurde die Kurve etwas über dem Rumpf etwas aufgeweicht:

3. Schattierung

Wir haben die Grundformen unseres Baums heruntergefahren, also wollen wir jetzt an der Schattierung arbeiten, um die Volumen unseres Baumes zu vermitteln.

Schritt 1

Wir können die meisten inneren ovalen Linien loswerden; es ist leicht genug, sich daran zu erinnern, wie wir sie beschatten werden. Im Moment behalten wir nur die Zeilen für die Reihe mit drei Ovalen.

Schritt 2

Wie üblich wird die Spitze unserer Formen die am meisten beleuchteten Bereiche sein. Dieser Farbton ist 10% heller und hat einen etwas wärmeren Farbton.

Schritt 3

Wenden Sie den gleichen vorherigen Farbton an, aber auf kleinere Flächen an den Seiten der unteren beiden Ovale.

Schritt 4

Fügen Sie ein wenig mehr von diesem Schatten nur auf dem mittleren Oval der Reihe mit drei Ovalen hinzu.

Schritt 5

Jetzt fügen wir einen dunkleren Farbton hinzu, um mehr als die Hälfte der drei Ovale zu bedecken. Der Farbton ist 10% dunkler als die Farbe des Hauptbaums und hat einen etwas kühleren Farbton. Probieren Sie Variationen aus, wie Sie es für richtig halten.

Schritt 6

Der letzte Schatten für die Baumkrone wird im unteren Bereich liegen. Wieder ist der Farbton 10% dunkler als der vorherige und hat einen etwas kühleren Farbton.

Schritt 7

Fügen wir etwas Braun für den Baumstamm hinzu. Probieren Sie alternative Farben aus, wie Sie möchten, und denken Sie daran, dass Sie Farbvariationen mit dem einfach ausprobieren können Bild> Anpassungen> Farbton / Sättigung… Schieberegler.

Schritt 8

Fügen Sie zum Schluss noch etwas Schattierung hinzu. Unterhalb der Baumkrone sollte es dunkler sein, da der Schatten die Baumkrone werfen sollte. An den Rändern kann es je nach Wunsch dunkler oder heller sein. Hier ist es dunkler:

4. Dithering / Patterns

Beim Dithering werden Muster verwendet, um den Übergang von einer Farbe zur anderen zu erleichtern. In der Pixelkunst ist das ziemlich üblich, obwohl ich für den isometrischen Stil, den ich verwende, dazu neige, ihn auf ein Minimum zu beschränken. In diesem Fall verwenden wir es und machen es überdimensioniert, so dass unsere Schattierung nicht nur weicher wird, sondern auch unserem Baum eine grüne Textur verleiht. Das ist eine Win-Win-Situation für uns!

Schritt 1

Normalerweise verwenden Dithering-Muster einzelne Pixel, aber wie ich sagte, werden wir unsere Muster übergroß machen. Wie Sie hier beachten sollten, verwendet das Dithering Blöcke mit jeweils 4 Pixeln sowie Blöcke mit 2 Pixeln, die aneinander haften. Stellen Sie sich vor, dass Sie ein Checker-Raster respektieren müssen.

Arbeiten Sie, während Sie hineinzoomen, und überprüfen Sie Ihren Fortschritt durch Herauszoomen. Sind die Ergebnisse nach Ihren Wünschen?

Schritt 2

Hier habe ich mehr Dithering auf einen der unteren Lichtbereiche angewendet. Die Pixel dieses Musters sind zwar kleiner geworden, aber ich respektiere immer noch ein Checker-Raster, wie ich es im oberen Bereich getan habe.

Schritt 3

Wenn Sie mit dem Aussehen dieses Bereichs zufrieden sind, kopieren Sie ihn auf die andere Seite und wenden Sie denselben Vorgang auf das letzte Highlight an, das im mittleren Oval.

Schritt 4

Machen Sie mehr vom gleichen Dithering für den mittleren Abschnitt, wo wir vom Hauptgrün zum zweitdunkelsten Ton wechseln.

Schritt 5

Hier wird das Dithering auf eine der Seiten der Bäume angewendet, etwas höher als in der Mitte, um die Volumen zu trennen und dem Baum ein runderes, volleres Aussehen zu verleihen.

Schritt 6

Fügen Sie dann ein paar dunkle Pixel hinzu, um einen Bruch zwischen diesem Seitenbereich und dem mittleren Oval hervorzuheben. Dies wird dazu beitragen, dem Baum den Cluster-Look zu geben, den wir beabsichtigen.

Schritt 7

Wenn dieser Bereich fertig ist, können Sie ihn einfach duplizieren, umdrehen und auf die andere Seite legen.

Schritt 8

Zum Schluss ziehen Sie den gleichen Trick auf den dunkelsten Grünton.

Schritt 9

Um dem Baumstamm eine Textur hinzuzufügen, können Sie auf einer neuen Ebene ein einfaches, kleineres Gittermuster in Schwarz erstellen und die Deckkraft vor dem Zusammenfügen auf unter 20% senken.

Das sollte helfen, unserem Baumstamm eine Rindenstruktur zu verleihen.

Schritt 10

Als letzten Schritt, machen Sie die untere Kontur des Rumpfes etwas heller und fügen Sie einen runden Schatten von der Baumkrone hinzu, der schwarz sein sollte und auf etwa 10% Deckkraft eingestellt ist.

Baum fertig!

Unser Baum kann jetzt in jede Umgebung geklebt werden, wo er sich gut mischen und den Ort aufhellen kann!

Platzieren Sie eines vor jedem Haus, das Sie bauen, oder fügen Sie eine Gruppe ein, um einen Wald zu schaffen oder einen Park zu füllen. Ändern Sie den Farbton / die Farbsättigung der Baumkrone und geben Sie dem Baum Herbstfarben, oder nehmen Sie einfach eine Reihe von Farben für die Abwechslung. Hoffentlich finden Sie dieses Element in hohem Maße recycelbar und somit ein sehr wertvolles Element in Ihrem Pixel-Art-Inventar.

Viel Glück und weiter wachsen!