☰ Menu

Scene.hu

Magyar demoscene portál – grafikusok, zenészek, programozók alkotói közössége

Hogyan készülnek a demojoe intrók?

Posted by tifeco on 2020-12-21, 13:58

Sziasztok,

A felkérésnek [zargatás Discordon – a szerk.] eleget téve írnék egy kicsit demojoe 4kbyte intrók kulisszatitkairól.
Ha esetleg nincs meg hirtelen a legutóbbi demojoe prod, akkor innen letölthető:

Kezdjük is a legelején: az alapkoncepció az volt, hogy próbáljak egy vicces/rajzfilmszerű történetmesélést 4kbyte-ban összehozni, lehetőleg úgy hogy több epizódra is kitartson a dolog, valamint természetesen a történetek legyenek kapcsolatban a demoscene-nel. Mint általában a 4kbyte intrók többségében, el kell gondolkodni, hogy milyen trükköket/cseleket vessek be, és hogy hogyan tudnék belepasszírozni minél több tartalmat a produktumba.

Ebben az esetben a koncepció alapból megkívánta, hogy szükség lesz sok, lehetőleg minél több fajta alakzatra, amit egyszerűen lehet létrehozni és mozgatni: így jutottam el a fontok használatához. Szerencsére alap Windows-on is akad néhány olyan font, ami elég változatos, és az elemeket egymással kombinálva tulajdonképpen bármit fel lehet építeni: ezek a Webdings /  Wingdings font-családok. A legutóbbi demojoe intrókhoz pl. csak Webdings-et használtam – minden ami az intróban van, azzal van felépítve. Természetesen ezzel cseleztünk és külső adatot használunk az intróban – de talán ez a tény egy vicces entry és kombinált compo esetén megbocsátható ;)

Ezzel megvan tehát az alap tech-megközelítés: font-alakzatokból próbálok nagyon egyszerű történetet elmesélni rajzfilmszerűen.

Mivel a munka nagy része a jelenetek összerakása/igazgatása, szükség lesz valami editor-szerűségre: Annak idején (a legelső demojoe intróhoz kb ~5 éve) készítettem egy nagyon faék-egyszerűségű editort C#-ban (amit azért választottam, mert managed kódban reflection használatával könnyű az adatszerkezetek UI-ra való kirakása/szerkesztése, stb.)

Az editor így néz ki:

Itt pedig egy példa arról, hogy egy részlet körülbelül hogyan épül fel:

Az editor kimenete egy egyszerű bytestream, ami a karakter ASCII kód, pozició, nagyítás, forgatás, szín elemekből áll, amit egyszerűen be lehet include-olni az intróhoz. Itt szeretném megjegyezni hogy nézzétek meg Gargaj Function-ös demotool-előadását, mert teljesen egyetértek a véleményével: ahol tudjuk kerüljük a sok munkával járó toolok/editorok fejlesztését, manapság már nagyon sok ingyenes tool/megoldás elérhető, ne írjatok ilyet 0-ról, nem szabad és pont. (Mai fejjel valószínűleg én is máshogy oldanám már meg ezt.)

Ha megvannak a jelenetek, következő lépésként kellene valami leíró, ami az összerakott jelenetek egy adott részét mozgatja / animálja: Erre jó ötletnek tűnt egy “metacode” animációs leíró kód létrehozása, ahol természetesen a cél a lehető legkisebb byteméretben leírni egy-egy animációs lépést. Egy ilyen parancs általában parancs, elem index + count, mozgás paraméterek(x/y), mozgás típus leíróból áll, és talán egy példán keresztűl lehet legjobban bemutatni, hogy körülbelül miről is van szó:

Itt van például a Superjoe autósüldözéses jelenet az intróból:

A hozzá tartozó metakód-részlet (ez is egy sima bytestream, a szöveges elemek egyszerű #define-olt konstansok) pedig így néz ki:

CMD_RENDER, DATA_CAR_CHASE, 9, //autósüldözés jelenet statikus elemeinek kirendelése
CMD_TRSF, DATA_CAR_CHASE + 9, 3, 0, 0, MOVE_ROADSIDE, //az út melletti objektek mozgatása
CMD_TRSF, DATA_CAR_CHASE + 12, 5, 20, 0, MOVE_ZIGZAG, //az autó mozogjon random cikk-cakk ban
CMD_TRSF, DATA_CAR_CHASE + 17, 11, 5, 0, MOVE_ZIGZAG, //superjoe mozogjon hasonlóan (csak kisebb mértékben)
CMD_TRSF, DATA_CAR_CHASE + 29, 3, 0, 10, MOVE_WALK, //superjoe köpenye lebegjen
CMD_TRSF, DATA_CAR_CHASE + 32, 3, 0, 5, MOVE_WALK, //superjoe köpeny lebegés 2 - a köpeny másik részének més az offset
CMD_TRSF, DATA_CAR_CHASE + 35, 1, 0, -25, MOVE_FLOPPY_SHOOT, //floopy lemezek dobálása
CMD_END, 850, //ez a jelenet 8.5 másodperc hosszú - utána ugrunk a köv. parancsra

Ezzel a ~40 byte-nyi adattal definiáltam ezt a jelenetet. Ezt természetesen még lehetne tovább tömöríteni, de szerencsére a Crinkler megoldja ezt is, és ezt simán körülbelül a harmadára hozza a tömörítés. Úgy vettem észre, hogy bizonyos szint alatt már nem érdemes a bitműveletekkel varázsolni, mert a hozzá tartozó kód jobban növekszik (és általánosságban az ilyen adatot jobban lehet tömöríteni, mint az azt feldolgozó kódot). Ezt az adatleírót manuálisan rakom össze egyelőre, egy kicsit macerás, de nem vészes.

A transzformációk természetesen mátrix műveletekként kombinálhatóak egymással: Általában egy sima mozgás + random + sin stack bőven elég szokott lenni egy rajzfilm-szerű mozgatáshoz, illetve sose becsüljük alá a random mozgás erejét; a random segítségével könnyű “jónak tűnő” dolgot összehozni. Természetesen mivel 4k-ról van szó, a parancsértelmezőből csak az aktuális intróhoz tartozó parancsokat kell berakni: a lista folyamatosan bővül az újabb és újabb intrók esetében, de nyilván csak a szükségesek vannak a kódban. Érdekesség hogy az ehhez az intróhoz elég volt összesen 8db típus; tulajdonképpen nekem ennek a résznek a sakkozása tetszik legjobban a fejlesztés során, hogy hogyan lehet a legkevesebb paranccsal a lehető legváltozatosabb történetet összehozni.

Nem utolsósorban meg kell jegyezni a zenét is, ahol nem tudom eléggé megköszönni Teo munkáját! Ő az aki bármikor bármilyen helyzetben ki tud segíteni, mindenből ki tudja hozni a maximumot, legyen egy zenei betét, vagy hangeffekt, vagy akármi. Nincs olyan, hogy “az nem fog menni” :) Ezeknél az intróknál MIDI formátum mellett döntöttünk több okból is: könnyebb időzíteni egy storyboard-hoz, alapból adott sokfajta hangszer/hangeffekt van, és ha a végén csökkenteni kell az össz méreten, akkor sokkal egyszerűbb az eventeket mozgatni/törölni. A folyamat rendszerint úgy néz ki, hogy egyeztetünk egy storyboard-ot, Teo ez alapján elkezdi elkészíteni a MIDI-t, majd amikor már valami látszik az intróból, akkor kezdődhet az igazítás. Maga az intró tud különböző sebességben lejátszódni, bármelyik jelenettől lehet kezdeni, stb., és így könnyebb megcsinálni az igazításokat.

Végezetül néhány számszerű adat a prod-ról:

  • Általános dolgok (ablak nyitása / D3D / font készítése / MIDI-lejátszó): 2202 byte / 1494 byte tömörítve
  • Jelenetek adatai: 704 byte / 561 byte tömörítve
  • Animációs metakód: 2064 byte / 461 byte tömörítve
  • Animációs parancsértelmező / hozzá kapcsolódó render dolgok: 1325 byte / 760 byte tömörítve
  • MIDI zene és hangeffektek: 3197 byte / 814 byte tömörítve

Remélem tudtam egy-két érdekességgel szolgálni, és sikerült egy kis kedvet csinálnom az ilyesfajta fun intró készítéshez.

Csináljatok intrókat, mert az jó! :)

Categories: Háttér, Programozás, Tutorial | Tags

2 Responses so far.

  1. avatar teo says:

    remek kis iras, annyit tennek hozza, hogy ritkan dolgozom olyan koderrel, aki csinal storyboard/mockup-ot a demojahoz elöre, tehat ez mindig kicsit üditö dolog.

  2. avatar TomCat_ says:

    jó volt olvasni, köszi!

Leave a Reply

You must be logged in to post a comment.

Ugrás a lap tetejére Ugrás a lap aljára