So erstellen Sie gekippte (Höhen-) isometrische Kacheln

11

Dies lässt sich vielleicht am besten bildlich erklären. Ich versuche ein isometrisches 2.5D-Spiel zu erstellen. Meine Vision ist es, dass das Spiel ungefähr so aussieht wie mein Ziel:

isometrische Landschaft

Ich bin kein Grafiker, daher habe ich einige Probleme beim Erstellen der "geneigten" Kacheln, um Gelände unterschiedlicher Höhe zu simulieren. Das Erstellen der grundlegenden isometrischen Kachel war mit den folgenden Schritten einfach:

Erstellen Sie eine quadratische 64 x 64-Version der Kachel
Um 45 Grad drehen
Skalieren Sie die Höhe um den Faktor 2

Das Erstellen der "gekippten" Kacheln ist eher eine Herausforderung. Zu meiner Verfügung habe ich Photoshop, aber ich bin weit davon entfernt, ein Experte darin zu sein. Hier ist mein aktuelles Problem:

Geben Sie hier die Bildbeschreibung ein

Ich bin nicht sicher, wie ich Scheitelpunkte manipulieren kann, sonst wäre dies einfach, aber um eine "geneigte" Kachel von meiner isometrischen Grundkachel zu erhalten, muss ich lediglich den unteren und den rechten Scheitelpunkt um 16 Pixel nach unten verschieben , während die anderen beiden Eckpunkte fixiert werden. Dies würde die Kachel erzeugen, die ich will.

Was ist ein einfacher Weg, um dies zu erreichen. Ist Photoshop das richtige Werkzeug dafür? Irgendwelche Vorschläge?

tiles isometric

— Filip Jeremic
quelle

Welches Grafiksystem verwendet Ihr aktueller Build directX, openGL oder proprietär für die Engine? Die Basisantwort wäre, Scheitelpunkte zu speichern und dann die Scheitelpunkte nach Bedarf zu ändern (Sie können dies als Array von 8 Vektoren tun). Die Art und Weise, wie Sie sie auf den Bildschirm übertragen, erfolgt normalerweise mit einem Grafikdienstprogramm / einer Grafikbibliothek wie directX, openGL

— gardian06

Ich benutze SFML, um die Sprites auf dem Bildschirm zu rendern, das wäre also openGL. Ich speichere die Sprites als 64x64-Kacheln auf der Festplatte.

— Filip Jeremic

@FilipJeremic, Hmm .. Ist das ein Neopets-Spiel?

— Pacerier

3

Sie können die Kacheln erstellen, wenn Sie möchten - mit Photoshop oder etwas anderem. Ich würde ein Vektorzeichnungsprogramm empfehlen, kein Pixelzeichnungsprogramm (ich weiß nicht genug über Photoshop usw., um zu wissen, was es heutzutage bietet).

Persönlich würde ich vorschlagen, dass Sie sich nicht die Mühe machen, Kacheln zu erstellen, sondern dass das Spiel sie mithilfe Ihrer Zeichen-API zeichnet. Dies wird viel einfacher (insbesondere, wenn Sie erkennen, wie viele verschiedene schräge Kacheln Sie benötigen).

— MarkR
quelle

Ich bin mir nicht sicher, ob ich damit einverstanden bin, dass das Spiel Kacheln für Sie rendert, es sei denn, Ihre Engine / Ihr Framework lässt Sie dies problemlos tun (in 2D).

— John McDonald

3

Halten Sie das Quadrat 64x64 Bild als Quelle, um schräge Versionen zu erhalten würden Sie zuerst Skew das Bild nach unten auf der rechten Seite (auf Ihr Bild Beispiel entsprechen), dann drehen sich um 45 Grad und skaliert es in der Höhe nach unten. Das Ergebnis wäre die Steigung, nach der Sie gesucht haben (mit ein wenig Versuch und Irrtum, um wie viel man sich neigt).

Da alle Schritte (Ändern der Schattierung, Neigen, Drehen, Skalieren) neben dem Erstellen des Anfangsquadrats recht einfach sind, sollten Sie diese Schritte mit openGL entweder beim Start Ihres Spiels oder als automatisierten Schritt im Build ausführen Prozess (erstellen Sie einfach ein kleines Programm, das alle erforderlichen Schrägstellungen / Rotationen ausführen kann, und fügen Sie es dem Build-Skript hinzu).

Die Verwendung von Vektorgrafiken wäre wahrscheinlich eine Idee, wenn Sie weiterhin manuell jede geneigte Kachel erstellen möchten. Photoshop unterstützt Vektorebenen, sodass Sie kein neues Programm lernen müssen, um dies zu versuchen.

— Daniel Carlsson
quelle

Warum verwenden Sie Photoshop anstelle von Fireworks usw.?

— Pacerier

@ Pacerier Ich nicht, die ursprüngliche Frage erwähnte Photoshop. Ich persönlich habe vor kurzem angefangen, Krita zu verwenden, bevor Paint.net (das ich immer noch für schnellere Arbeiten verwende).

— Daniel Carlsson