4 registered members (ozgur, Ayumi, VHX, monarch),
1,161
guests, and 4
spiders. |
Key:
Admin,
Global Mod,
Mod
|
|
|
How to implement a vignette effect?
#413340
12/12/12 12:24
12/12/12 12:24
|
Joined: Mar 2010
Posts: 20
KingdaKa
OP
Newbie
|
OP
Newbie
Joined: Mar 2010
Posts: 20
|
Hi everybody!
ENG:
Iam working on a FPS and would like to add some vignette effect to the players view (darken the border/cornes). I assume that a Post-Processing-Shader would be the easiest/best way to do it, but i dont have any experience with shaders. Maybe the effect could also be done with transparent panels (for example with video_border?). I dont really know where to start and i dont wanna waste my time if there is an easy solution. I appreciate for any advice/help!
GER:
Ich arbeite derzeit an einem FPS und möchte gerne einen Vignettierungs-Effekt für die Kamera erstellen (also die Ränder nach außen hin abdunkeln). Ich vermute das die beste/einfachte Lösung dafür ein Post-Processing-Shader wäre. Allerdings habe ich keinerlei Erfahrung mit Shadern. Alternativ könnte man eventuell ein transparentes Panel verwenden (würde sich video_border dafür eignen?). Ich weiß nicht so recht wie ich an die Sache rangehen soll und ich würde ungern viel Zeit verschwenden, wenn es bereits eine sehr einfache Möglichkeit für diesen Effekt gibt. Für jedwede Hilfe und Hinweise wäre ich euch dankbar!
Update: Testing if its possible to do with the new Shade-C Beta
Regards,
KingdaKa
Last edited by KingdaKa; 12/12/12 12:32.
|
|
|
Re: How to implement a vignette effect?
[Re: KingdaKa]
#413350
12/12/12 15:13
12/12/12 15:13
|
Joined: Oct 2011
Posts: 1,082 Germany
Ch40zzC0d3r
Serious User
|
Serious User
Joined: Oct 2011
Posts: 1,082
Germany
|
danke, habe den Effekt mit einem einfachen Panel hinbekommen, wäre aber trotzdem an einer Lösung mit Shader interessiert falls sich jemand damit auskennen sollte Shader machen doch alles nur langsamer, da jeder pixel neu berechnet wird. Außerdem ist das so doch viel individueller und leichter o_0
|
|
|
Re: How to implement a vignette effect?
[Re: Ch40zzC0d3r]
#413354
12/12/12 15:45
12/12/12 15:45
|
Joined: Jul 2001
Posts: 6,904
HeelX
Senior Expert
|
Senior Expert
Joined: Jul 2001
Posts: 6,904
|
Shader machen doch alles nur langsamer, da jeder pixel neu berechnet wird. Außerdem ist das so doch viel individueller und leichter Sagte der Mann, der offensichtlich keine Ahnung davon hat und mir mein ganzes Browserfenster auseinandergezogen hat, weil er nicht in der Lage war, eine URL, die 10km lang ist, in ein url-tag zu verpacken (zweites Icon von links, das neben dem Smiley). Ein Vignette-Effekt ist relativ einfach zu erzielen und kostet im Prinzip nix an Leistung - es kommt nur ein wenig darauf an zu wissen, wie du ihn machen willst. Beschreib doch mal kurz wie du die Grafik für das Panel erzeugt hast und wie du es auf den Bildschirm legst. Stretchedt du es auf die ganze Breite und Höhe? [EDIT] Im Gegensatz zu einer Shader-Lösung hat man mit einem Panel zusätzliche Speicherkosten! Vor allem weil man mit DDS ekelige Artefakte in die Textur reinbekommt, wenn man Gradienten hat (bei einer Vignette ist das der Alphakanal), muss man zwangsläufig auf TGA oder PNG setzen, sodass da je nach Auflösung wieder 2-4 MB flöten gehen an Videospeicher. [EDIT #2]Das Schöne einer Shaderlösung ist dann auch, dass man die Vignette zur Laufzeit ändern kann, wie z.B. einfärben (Rot für wenn getroffen), vergrößern, verkleinern (bei Geschwindigkeit) oder sowas!
Last edited by HeelX; 12/12/12 15:49.
|
|
|
Re: How to implement a vignette effect?
[Re: HeelX]
#413357
12/12/12 16:04
12/12/12 16:04
|
Joined: Mar 2010
Posts: 20
KingdaKa
OP
Newbie
|
OP
Newbie
Joined: Mar 2010
Posts: 20
|
Ich habe nen einfaches PNG erstellt, welches an den Rändern komplett schwarz ist und dann richtung Mitte nach Transparent verläuft und dieses einfach mit aktiviertem Translucent-Flag als Panel über die Camera gelegt. Erst wollte ich ein kleines PNG machen und dieses stretchen, allerdings wurden die Übergänge damit auch immer weicher und der Effekt war somit größer und anders als gewollt. Letztlich habe ich derzeit also einfach ein Bild in der gewünschten Auflösung erstellt, was nicht gerade flexibel ist. Bräuchte also zumindestens 1 Bild für jedes Seitenverhältnis in der maximalen Auflösung. Die Grafik selbst ist bei einer Abmessung von 1680x1050 aufgrund der überwiegenden Transparenz allerdings auch nur 71,7kb groß.
Mich würde einfach interessieren, wie man sowas auch mit nem Shader hinbekommt und sich dafür die ganzen Grafiken einfach sparen kann und sich nicht um die Auflösung und das Seitenverhältnis kümmern muss.
Zudem möchte ich wie du HeelX in deinem Edit angedeutet hast, auch zur Laufzeit den Effekt mal verändern, oder vergrößern, mal verkleinern oder die Farbe ändern, ohne das ich dafür jedes mal neue Grafiken brauche
Last edited by KingdaKa; 12/12/12 16:06.
|
|
|
Re: How to implement a vignette effect?
[Re: HeelX]
#413380
12/12/12 22:32
12/12/12 22:32
|
Joined: Jul 2002
Posts: 3,208 Germany
Error014
Expert
|
Expert
Joined: Jul 2002
Posts: 3,208
Germany
|
Das Schöne einer Shaderlösung ist dann auch, dass man die Vignette zur Laufzeit ändern kann, wie z.B. einfärben (Rot für wenn getroffen), vergrößern, verkleinern (bei Geschwindigkeit) oder sowas! Fairerweise muss man hier aber sagen, dass man auch Panels einfärben kann - LIGHT setzen und dann blue/green/red anpassen (Falls man das per Panel macht, oder aber man nimmt den entsprechenden Parameter von draw_quad) Je nach genauer Form der Vignette kann man da möglicherweise auch noch ein bisschen sparen (zb indem man nur eine ecke als eigentliche grafik lädt und dann das ganze dreht bzw teile in der mitte (die vermutlich kachelbar sind) eben per size_x kacheln lässt... Womit ich aber nicht sagen will, dass Panels die bessere Lösung sind (beim "Durchschnittslernvorgang" von Acknex aber vll. die, die man früher selbstständig coden und einbinden kann).
Perhaps this post will get me points for originality at least.
Check out Dungeon Deities! It's amazing and will make you happy, successful and almost certainly more attractive! It might be true!
|
|
|
|