2017-08-27

A víz elkészítése a tóhoz!

 

Ebben a részben, bemutatom hogyan készítettem el a vizet a tóhoz. Ez eléggé macerás és trükkös volt, ezért ez egy hosszabb poszt lesz és némileg techikai is, szóval kapaszkodjatok a sisakotokba!

Kattints a "tovább a bejegyzésre", hogy elindulhasson a nerd rage...


Ok, szóval a frissen kivájt tavunknak szüksége van némi vízre, ugyebár? A valóságban ilyenkor csak várnunk kéne amíg a csapadéktól feltöltődik. Sajnos ez itt nem opció, úgyhogy valamiféle illúzió kéne, hogy ott mégis víz van. 

Először is, készítettem egy síkot ami teljesen lefedte a lyukat. Ez lesz a víznek a felszíne. Erre a síkra fogom rátenni a materialt, ami majd mimikálja a vizet. De nagyon fontos, hogy egy oda megfelelőt találjak! Nagyon sok közül lehetett választani, és volt sok ami habár jól nézett ki, de nem igazán úgy viselkedett ahogy azt szerettem volna (és fordítva). 


Az első kísérletem az volt, hogy egyszerűen behúztam egyet a beépített alap víz materialok közül. Nem fűztem hozzá túl sok reményt, hogy tökéletesen működni fog, de látni akartam már valami víz szerűséget.


Ahogy gondoltam, nem voltam lenyűgözve. Közel se nézett ki úgy mint a filmben... Szóval, ismét keresgélni kezdtem egy alternatíva után a Google-ön. A szerencse ismét az én oldalamra állt és azt hiszem megtaláltam a lehető legtökéletesebb víz materialt! Nagyon komplex, rengeteg beállítással lehet játszadozni, azonban van egy kis bibi. Nem volt kompatibilis az Unreal Tournament Editorral, csak az Unreal Engine 4 Editorral (ahol akár játékokat és animációkat tudsz készíteni, de nem játszható pályát az Unreal Tournamenthez). Az indító/launcher (ahol elindítod a szerkesztőt) nem volt hajlandó letölteni a materialt a könyvtárból/library. Megvolt a legfrissebb UE4 szerkesztő, még régebbről, (mert amikor elkezdtem a projektet, azt hittem ezzel lehetett a pályát elkészíteni, de ez nem így volt) de úgy fest az én  szerkesztőm túlságosan új a materialhoz és ez lehet az oksa, hogy ki van szürkítve a letöltés gomb. Szóval megpróbáltam manuálisan letölteni. Órákon át keresgéltem egy szervert ahonnan le tudnám szedni a shadert, de semmi. Már csaknem feladtam a reményt és elkönyveltem, hogy túl szép volt, hogy igaz legyen, amikor eszembe jutott valami.

Lehet, hogy inkompatibilis az én verziómmal, de egy régebbi verzióval viszont működnie kell! Letöltöttem egy régebbi kiadását az UE4 szerkesztőnek és végre így már felajánlotta, hogy leszedjem a cuccot. De volt még egy félelmem. Ez csak az UE4 szerkesztővel kompatibilis, nem az UT szerkesztőjével! Gondoltam kompatibilisnek KÉNE, hogy legyen, alig különböznek egymástól (ugye?) Megnyitottam az UE4 szerkesztőjét, csináltam egy teszt környezetet csak, hogy megnézzem egyáltalán működik-e és szerencsére működött. Ok... jöjjön a aminek jönnie kell. Bemásoltam a materialt az UT szerkesztő fájl struktúrájába, megnyitottam a legújabb Medence pályát és... nincs hiba, (eddig...) aztán láttam, hogy felismerte a Tartalom/Content mappában, (ez szintén egy jó jel) majd keresztebe tettem az ujjaim, imádkoztam a régi és az új Istenekhez, miközben ráapplikáltam a materialt a síkra és... SIKER! Nincs hiba, nincs összeomlás, minden tökéletesen működik! (Ez ritka eben a szakmában).


Nagyszerű! Sokkal közelebb áll az elképzelésimhez! Bár még nem tökéletes, de ezen javíthatunk később, azonban még így is messze jobban néz ki, mint a beépített víz material. Szerencsére az új shaderen rengeteg paraméter állítható, így addig változtathatom a kinézetét, amíg olyanná nem válik amilyenre szeretném. (Ez mindig egy jó dolog).

Na most. Amikor már fellélegeztem és azt hittem minden megoldódott, egy igencsak durva problémával kellet szembesülnöm. Ez a hiba rengeteg fejfájást okozott! A víz felülről már úgy nézett ki, ahogy nagyjából szerettem volna, azonban amikor lementem alá és felnéztem, ez a borzalmas látvány fogadott.


Semmi... a víz eltűnt. Mivel a material nagyon komplex, nem igazán reménykedtem abban, hogy megfogom tudni érteni, miért is történik ez, de megpróbáltam utánajárni fórumokon vagy keresni olyan embereket, akik ugyancsak ezt a víz materialt használták és ugyanezt tapasztalták és szerették volna ha 2-oldalú lenne. Nem álltak túl jól a dolgok. Később megtudtam a választ a kérdésre, és nem voltam boldog...

(Ja amúgy, ez az a komplexitás amiről beszélek)


"A materialnak kell két oldalúnak lennie, nem a világításnak vagy a rácshálónak. Ez nem fog működni az áttetsző víz materiallal, mivel egy egyedi mélység buffert használ. Csak a "tó" és "óceán" materialok működnek, két oldalú módban." 

Igen, az áttetsző vizet használtam, mivel a másik kettő elég tré volt ehhez a jelenethez. Csak ez néz ki jól, semmi más! Megpróbáltan vakon állítani a paramétereken remélve, hogy valami jó sül ki belőle, de minden csak még rosszabb lett. Gondoltam, valahol a material legbelső magjában lehet a gond, vagy maga a technika amit használ akadályoz meg abban, hogy áttetsző legyen alulról, szóval nincs esély, hogy megoldjam.

De! Megint elkezdtem agyalni és eszembe jutott, mi van ha duplikálom a víz síkot, megfordítom 180 fokkal és a meglévő alá rakom? Így, most már 2 víz felszín volt. Miután eljátszogattam pár random paraméterrel, valahogy sikerült működésre bírnom, de glitches volt. Volt egy iszonyatos "tépődés" effekt a víz shaderen és a tükröződés is csak részben volt látható egy kis területen a játékos vagy a kamera körül. Ez a képhiba nagyon sokáig kísértett. De legalább már volt valami...


Szóval, volt hát egy tükröződő felszínű és egy nagyjából fénytörő víz felszínem. Nagyszerű! De ahogy azt láthatjátok, nincs semmi ami azt a benyomást keltené, hogy víz alatt vagyunk (azt leszámítva, hogy megtöri a felső világ képét). Hogy elérjem ezt a hatást, egy Post-Process Volume-t használtam. Lényegében ez egy régiót csinál (kockát) amibe ha belépsz, akkor különféle utó-effekteket aktivál amiket te állíthatsz be. (Mint tint, color correction, blur, depth of field, motion blur, bloom stb.) Nagyon pontosan, épp a víz felszín alá pozícionáltam a tetejét, hogy csak akkor aktiválódjon, amikor a víz alatt vagyok. Adtam hozzá color tint-et, hogy kékes árnyalatú legyen minden, color fringe-t, (hogy eltoljam a vörös, kék, zöld színcsatornákat egymástól, mint egy prizmánál) egy kis bloom-ot, (vagy glow-ot/ragyogást) hogy elsimítsam a dolgokat, lens flare-t, depth of field-et, (a távoli dolgok homályossá válnak) vignette-t (a kép szélei sötétebbek) és végül motion blur-t. Amikor mindezzel megvoltam, valahogy így nézett ki:


Sokkal jobb! Hozzáadtam egy Physics Volume-t is, ugyan oda ahol a Post-Process Volume is volt és beállítottam, water volume-ra/víz térfogatra, hogy a karakter fizikája is úgy viselkedjen, mintha víz alatt lenne (lebeg és lelassul).

Azonban, nem voltam teljesen megelégedve a tükröződésekkel. Igen, nagyon jól néztek ki már így is, de alapból egy előre elkészített textúrát használt, így nem tükrözte a környezetet. Van viszont, egy vizuális effekt bigyó amit Sphere Reflection Capture/Tükröződés Felvevő Gömbnek(?) hívnak és ez pont erre van kitalálva. Rakj egyet a víz felszín fölé, állítsd be a tükröződés sugarát akkorára, hogy lefedje az egész jelenetet és a tó már rendesen is tükröz mindent.

 Sphere Reflection Capture előtt

 
Sphere Reflection Capture után 

Ezután, a pálya más részleivel foglalkoztam, de annyira zavart ez a víz alatti glitch, hogy muszáj volt kitalálnom rá valami megoldást. Ismét játszogattam a paraméterekkel és találtam párat ami hatással volt a glitches részre, de nem tűntette el teljesen. Szóval valahol a materialban volt a baj. Arra emlékeztem, hogy módosítottam a materialon és be raktam egy "two-sided sign" operátort és egy "lerp"-et, hogy valahogy összemossam a két víz felületet, a sign operátor meg az alfa csatorna volt. (Nem tudom mit gondoltam, igazából csak kísérleteztem azzal ami eszembe jutott). Talán ez működött, vagy módosítottam valami egyéb paramétert vagy talán mindkettő, nem igazán tudom. De, hát ha glitches is volt, legalább volt némi fénytörés. Ja és nem kellett már a másik vízfelület se.

Ezután ismét elkezdtem játszogatni a paraméterekkel, és kipróbáltam a legegyszerűbb és legegyértelműbb változtatást. Fogtam a "two-sided sign" operátort és hozzákapcsoltam a refraction/fénytörés csatornához. Nyilván túl gyerekes és ostoba volt azt gondolni, hogy ilyen egyszerű lehet a megoldás és működni fog, de végül bevált! A glitch eltűnt és minden végre úgy működött, ahogy azt akartam! Hurrá! (Megcsináltam a lehetetlent kevesebb mint 5 perc alatt, anélkül, hogy értettem volna bármit az egészből)!

Eredeti beállítás

Módosított, de glitches beállítás

Módosított, javított beállítás

Némi ünneplés után, módosítottam a Post-Process Volume-t és az utóeffekteket is gyengébbre állítottam. Bevallom, direkt vittem túlzásba az intenzitásukat, hogy némileg elfedjem vele a glitchet. (Mivel, nem hittem volna, hogy megfogok tőle szabadulni és így talán valamelyest el tudom fedni a totális kudarcomat vele szemben). Szóval, most így néz ki:


Egyelőre minden okés. Egész jól néz ki, (egyelőre) de azért elmondanám, hogy elég nagy a valószínűsége, hogy még módosítani fogok rajta a jövőben. Vélhetőleg amikor az utolsó simításokat végzem majd.

Ugyanakkor sokkal sekélyebbre alakítottam a tó fenekét (ami szintén még nem végleges, de még mindig jobb mint az a kráter). Sajnos ez egyben el is vesz az egyik legmenőbb effektből amit ez a víz shader tud. Ahogy a víz egyre mélyül és mélyül, egyre inkább opálosabb és zavarosabb lesz, a mélység illúzióját keltve. Mivel a tófenék sokkal sekélyebb, ez az effekt sem olyan látványos már, de később lehet, hogy még mélyítek rajta anélkül hogy elrontaná az összeképet.

Azt hiszem ennyi elég lesz mára és sajnálom ha megfájdítottam a fejed, (az enyém is fájt, amikor előrukkoltam ezekkel az őrült ötletekkel, amik valahogy végül beváltak és végre hagytak érvényesülni. Talán ez egy jel, hogy ne adjam fel és talán azt is jelenti, hogy van egy nagyon enyhe valószínűség, hogy ebből a pálya ötletből még lehet valami a közeljövőben).

Mindenesetre, köszönöm, hogy elolvastad! Találkozzunk a következőnél! :)

Nincsenek megjegyzések:

Megjegyzés küldése