Wie kann ich Gliederungs-Shader wie "Life is Strange" erstellen?

13

Ich möchte Sketch Shader wie das Leben seltsam machen.

Shader besteht aus zwei Teilen:

1. animierte gestrichelte Linie

2. Milde Gliederung

Ich möchte wissen, wie ich laute Umrisse machen kann.

siehe Umriss der Objekte

record_2019_01_21_09_43_07_10

record_2019_01_21_09_51_00_896

record_2019_01_21_09_45_53_942

record_2019_01_21_11_37_27_699

Zuerst habe ich versucht , Kontur zu machen , indem eingehender Vertex - Daten zu kopieren und skaliert entsprechend der normalen Richtung dann Cull Back.but Ich denke , es ist so etwas wie Bildeffekt , weil Umriss manchmal innerhalb des Objekts bewegen. Trotzdem würde ich mich freuen, wenn mir jemand bei der Implementierung dieses Shaders hilft :)

Was ich versucht habe

Ich habe die Kantenerkennung verwendet und sie mit dem Vertex-Shader animiert, aber das ist nicht gut wie bei den obigen GIFs.

record_2019_01_21_18_16_43_440

record_2019_01_21_18_27_28_597

Seyed Morteza Kamali
quelle

Antworten:

1

Ich habe in Unreal Engine 4 etwas Ähnliches gemacht, daher erkläre ich nur die Konzepte. Sie können dies auf zwei Arten tun. Dabei handelt es sich um unterschiedliche Kompromissverläufe zwischen Leistung und einfacher Implementierung.

  1. Fügen Sie zunächst ein neues Netz über dem Hauptnetz hinzu, das nur ein wenig größer ist (genau wie ein physisches Kollidernetz). Erstellen Sie dann einen transparenten Material-Shader und aktivieren Sie den Shader / zeigen Sie das Netz an, da sich der Ansichts-Kegelstumpf des Spielers innerhalb von x Abstandseinheiten vom Objekt befindet. Dies ist aufgrund des Transparenz-Shaders sehr leistungsintensiv. Da jedoch nur wenige Objekte an einem bestimmten Punkt hervorgehoben werden, ist die Implementierung einfach und durchführbar.

  2. Erstellen Sie eine Basistextur mit den Raute-Linien, und verschieben Sie die Texturkoordinaten entsprechend einem festgelegten Satz von Matrizen. Dies erzeugt die Illusion von "animierten Texturen"; In der Industrie wird es auch als dynamisches Material bezeichnet (es steckt mehr dahinter, aber Sie können nachlesen, wenn Sie möchten). Was die Gliederung angeht, so finden Sie im Internet zahlreiche Tutorials. Die Implementierung dieser Technik nimmt erheblich mehr Zeit in Anspruch, da Sie an den Verschiebungsmatrizen und der Materialaktualisierungszeit basteln müssen, um ein ähnliches Ergebnis wie in den obigen Screenshots zu erzielen. Außerdem müssen Sie die Hash-Linien auf Winkeländerungen im Basisnetz ausrichten.

Wenn die Leistung kein Problem ist, fahren Sie mit 1 fort. Wenn jeder FPS zählt, verwenden Sie 2, aber erwarten Sie viele Probleme, deren Lösung einige Zeit in Anspruch nimmt.

neugieriger Student
quelle