Érdekes gyűjteményt dobott be nemrég a közösbe a pár cikkel előtti Guberniya-makingof készítője, CCE / Peisik: Mint kiderült ugyanis, egy jóideje gyűjtögeti a különböző democsapatok által kiadott screenshotokat amik a demotooljaikról készülnek, és ezekből rakott össze egy pofás kis gyűjteményt.
Maguk a toolok nagyrészt belső használatra készültek, így nem publikusan elérhetőek, és persze korántsem teljes a gyűjtemény, mégis vicces látni, hogy volt olyan (pl. a Spöntz toolja), ahol nemes egyszerűséggel nincs preview ablak, így a demó időzítése anélkül történik, hogy látná a készítő mit is csinál. A galéria erőssége, hogy nem csak az elmúlt évekből találhatók képek (manapság már nem újdonság, ugye), hanem egészen a 2000-es évek elejéig visszamenőleg, a Demopaja / Werkkzeug időkig, így kellemesen végigkövethető az UX fejlődése is az évek során.
Ezúttal se volt másképp: most a Cocoon grafikusa, NTSC, ragadott screengrabbert és rakott össze egy kis tízperces videót arról, hogy hogyan dob össze a Cocoon demótoolban egy viszonylag egyszerű de látványos scenet:
A videó nem sokat, de mégis rengeteget mutat: Először 3dsmax-ban dob össze egy primitív scenet, azt behúzza a toolba, majd rádob néhány effektet – ez eddig nyilván egyszerűen hangzik. A trükk a részletekben rejlik:
Ugyan pl. az object és a kameramozgatás 3dsmax-ban készül, utólag a toolban is tud kamerát beállítani – ezzel nagyon gyorsan tud több szögből megnézni egy jelenetet.
Bár ezt csak tippelem, de ha jól látom minden kiexportált adat utánszerkeszthető a toolban is.
Az effekteknek rengeteg paramétere ki van vezetve, így a kóder bármikor a grafikusra bízhatja, hogy mivel játszogat.
Ugyan aki használt már modern grafikai programot (3dsmax, After Effects, stb.) az ismeri, de mégis kiemelném mennyire fontos az a fajta numerikus input, amit használnak: minden számszerű érték klikkeléssel húzogatható fel-alá, de duplaklikk után manuálisan is beírható neki pontos érték. Ezzel nagyon könnyű mind “szemre” belőni valamit, de elkerülhető a klasszikus designeri frusztráció is ha valaminek egzakt érték kell lennie.
Szinte minden textúrából mappelhető: így nagyon könnyen tudja pl. a tüskés effekt formáit és színeit egyszerre úgy állítani, hogy tetszetős legyen.
Minden textúra helyére betölhető videó(!) is
Egészen elképesztő overlay- / textúra- / layer-gyűjtemény látható a vinyóján, ránézésre minden effektre azonnal ki tud próbálni 15-20 változatot. Ez a legjobban a colorgrading és a lensflare overlay állítgatásánál látszik, ahol gyakorlatilag másodpercek alatt kipróbál 5-6 variációt; mindezt azért teheti meg, mert az évek alatt összegyűjtögette tulajdonképp presetnek a rengeteg LUT-ot.
Érdemes összevetni a scenet a postprocessing előtt és után: az alapvetően egyszerű jelenetnek hirtelen mélysége lesz a hozzáadott (szintén egyszerű) effektektől. Rengeteget számít itt is, hogy pillanatok alatt tudja összedobálni a végleges comp-ot, és azonnal látja, hogy mit csinál. Nyilván ez nem azt jelenti, hogy minden effekt azonnal jól kezd el kinézni mihelyst belefojtjuk megfelelő mennyiségű postprocessingbe, de pl. a végén rárakott kis noise layer egyszerű, olcsó, és mégis sokat ad a végeredményhez.
Szintén apróságnak tűnhet, de csak a használat során derül ki az, hogy mennyire fontos az átrendezhető GUI: függően attól, hogy min dolgozik éppen, folyamatosan rendezi át a tool GUIját, hogy többet lásson abból amit épp csinál, amit meg már nem használ, azt bezárja. Ezzel rengeteg fejfájástól menti meg magát.
Egy ilyen demotool elkészítése persze nyilván évekbe telhet, folyamatos iteráció mellett, és mindenkinek gusztusa válogatja, hogy egyáltalán szüksége van rá (vagy van-e valaki aki használni is fogja), mert nyilván demót írni jobb, mint tool-t írni. Ettől függetlenül viszont nagyon fontos lecke tanulható meg pl. abból, hogy mennyire hasznos, ha az ember egy effektre azonnal rá tud dobni 3-4 textúrát is, mert sose lehet tudni, hogy melyik lesz jó, vagy melyiktől jön meg a következő ötlet.
Ez pedig nyilván így uszkve 3 hónappal Function előtt nem haszontalan.
Az előző részben létrehozott alkotás két okból sem számít demónak. Először is, nincs benne animáció, másrészt Esc gombra nem lép ki. Ezért ebben a részben kódolni fogunk és animálni.
Hozzunk létre egy új projektet. Nem kell semmilyen csomagot hozzáadnunk. Egy kameránk lesz mindössze. Adjunk hozzá a jelenethez egy csomó kockát. GameObject -> Create Other -> Cube. Ha már három kocka kész, jelöljük ki mindegyiket, majd az Edit -> Duplicate segítségével duplázzuk meg a számukat. Az új kockák a régiekkel megegyező pozícióban lesznek, ezért forgassuk/mozgassuk őket tetszőleges helyre. Rövid idő alatt nagy mennyiségű kockánk lesz, ha ezt a pár lépés ismételgetjük. A kockák mindhárom koordinátája legyen a -2, +2 tartományban.
Adjunk hozzá három fényforrást. GameObject -> Create Other -> Point Light. Nevezzük el őket Red, Green, Blue-nak. Mivel ebben a fejezetben kódolni fogunk, coder color sémát használunk :-) Állítsuk be mindhárom fényforrás pozícióját: Red: X=0, Y=0, Z=3. Green: X=3, Y=0, Z=0. Blue: X=0, Y=3, Z=0.
A kamerának a korábban megismert módon adjunk egy Audio Source komponenst, és adjunk hozzá zenét.
Egészen a közelmúltig abban a tudatban éltünk, hogy még megjelenésekor írtunk a ShaderToy-ról, IQ/RGBA webes shaderfejlesztő tooljáról. Mint kiderült ez elmaradt, úgyhogy most pótlom. Időközben a ShaderToy nagyon kinőte magát. Egész kis scene fejlődött ki a tool köré, és a kezdeti fraktál – blob – tunnel háromszögből kitörve, elképesztő effektek születnek hétrő-hétre.
Az effektek sharelhetőek, sőt embedelhetőek is, így kedvedre lassíthatod vele a weboldalaidat.
Mivel elképesztő effektek vannak fent forrással, sokszor kommentekkel, probléma nélkül össze lehetne innen ollózni az év demóját. De nem én adtam az ötletet. https://www.shadertoy.com/
