Benachbarte Tiles teilen das selbe Material

[Thariel]

Hi

Es gibt verschiedene 2d Games die Tiles nutzen und die benachbarten Tiles teilen aber das selbe Material. Dazu kommt noch, dass die Ränder individuell (jedenfalls wirkt es so) geformt sind. Mich würde interessieren, wie das gemacht wird. Könnte es sein, dass die ganze Fläche des selben Materials (z.B. Sandstein) erkannt und ein individuelles "Mesh" generiert wird? Oder kann man mehrere Meshes die nebeneinander platziert sind, das Material teilen lassen?

[Sascha]

Moin!

Ich bin mir nicht ganz sicher mit "teilen sich dasselbe Material" meinst. Anhand der folgenden Fragen vermute ich, du meinst, dass da eine fortlaufende Textur zu sehen ist, die sich über mehrere Tiles erstreckt?

Der Ansatz mit dem Mesh könnte theoretisch funktionieren, aber ich stelle mir das schwierig vor, das performant zu halten. Ich denke, der bessere Weg sind World Space-Texturkoordinaten.

Shader haben ja Koordinaten, mit denen sie das Pixel der Textur finden, das sie an eine gegebene Stelle rendern wollen. Da das für die meisten Fälle Sinn ergibt, nehmen die meisten Shader dafür die UV-Map des 3D-Modells. Ein 2D-Objekt ist hierbei auch nur ein flaches 3D-Modell.

Jedenfalls muss man dabei aber nicht bleiben - man kann den Shader beliebige Zahlen verwenden, nachschauen oder ausrechnen lassen, um diese als Texturkoordinaten zu verwenden. So kannst du z.B. auch einfach die World Space-Koordinate eines Pixels nehmen und diese als Textur-Koordinate nutzen. Ist zwar 3D, aber hier kannst du dir das mal ansehen:

Wie du siehst, ist die Textur immer an derselben Stelle der Welt und nicht, wie sonst, des Objekts. Wenn er hier den Würfel kopiert und die Kopie neben das Original packt, dann passen die beiden Würfel direkt aneinander. Mit dieser Technik kannst du deine Tiles völlig beliebig in die Welt klatschen, und die Textur ist immer gleich.

Wenn du dir mal deinen zweiten Screenshot genauer ansiehst, siehst du auch, dass das so gemacht sein dürfte. Denn die Textur wiederholt sich nach 16-order-so Tiles:

Also, lange Rede, kurzer Sinn: Baue dir oder finde einen Sprite Shader mit World Space-Texturkoordinaten.

[Thariel]

Hi

Danke für den Beitrag. Es ist tatsächlich sehr einfach!

Jedoch ist jetzt immer noch unklar, wie man zum Beispiel auf einige Tiles, die nebeneinander liegen einen Shader Effekt (Inner Glow/Fresnel) anwenden kann, da es einzelne Objekte sind. Ich weiss nicht, ob das überhaupt möglich ist. Zum Beispiel gibt es Kohlevorkommen. Diese sind gruppiert über die ganze Map verteilt. Jetzt müsste man im Shader jeder dieser Gruppen als "einzelnes Objekt" behandeln können, damit man die Ränder und z.B. einen Fresnel Effekt hinzuzufügen. Aber Fresnel Funktioniert zum Beispiel gar nicht in 2d. Es gibt zwar Ansätze, wie man ein Glow Effekt auf ein Sprite wirken kann, aber da braucht man immer eine zusätzliche Textur dazu. Das funktioniert aber nicht, weil die Form der Kohlevorkommen zufällig sind und sich verändert.

Vielleicht könnte ich im Shader Graph einen Glow Effekt hinzufügen (mit einer Textur) und die Option schaffen, dass man den Effekt für jede Seite mit einem bool aktivieren/deaktivieren kann. Dann muss man das einfach nur noch per Script richtig erkennen und aktivieren...

Irgendwie so Tricks anwenden 😆

[Sascha]

Also... wenn du den Rand einfach nur etwas "wild" abschneiden willst, wie im zweiten Bild, dann könntest du eine globale Graustufen-Perlin-Noise-Textur haben, und dazu noch eine "lokale".

Die lokale müsste etwa so aussehen:

Die Idee ist jetzt die folgende:

Deine Tiles müssten etwas größer sein als ihr Grid. Wenn du ein 1x1-Grid hast, dann sollten die Tiles alle so 1.2x1.2 sein, sodass sie, wenn man sie mit dieser Textur nebeneinander packt, so aussehen:

Das ließe sich vermutlich am elegantesten mit einem Vertex Shader machen.

Der "Glow" außenrum wird dann die "kaputte" Kante, wenn man so will.

Du hast jetzt die Perlin-Noise-Textur und nimmst wieder die World Space-Koordinaten dafür. Dann vereinst du sie mit der lokalen Textur, die eben lokale Objektkoordinaten benutzt. Zum Vereinen musst du ein bisschen rumprobieren - die richtige Formel fällt mir dazu gerade nicht direkt ein. Aber die Idee wäre

  +    = 

Vermutlich irgendeine Kombination aus max() und Multiplikation oder so.

Das benutzt du dann als Alpha-Wert, oder für Alpha Clipping.

[Thariel]

Ich verstehe halt nicht wie man das so hinbekommt (dass die Tiles als eine einzige Form beim Shader berücksichtig wird):

 

Und nicht das passiert:

Bei mir ist es gerade umgekehrt (innen statt aussen), aber im Prinzip das selbe Problem.

[Sascha]

Öh... also... das war auch überhaupt nicht meine Idee? Ist vielleicht nicht so gut zu erkennen, aber in meinem Bild sind drei eigenständige Tiles zu sehen, die sich überlappen. Die blauen Kästchen sind das Grid, nicht die Tiles. Die Tiles sollen durch den Vertex Shader vergrößert werden, sodass sie überlappen.