Základní požadavky na tvorbu herního engine v HTML5/JavaScriptu

Transkript

1 Základní požadavky na tvorbu herního engine v HTML5/JavaScriptu Cílem je vytvoření herního enginu pro tvorbu adventure hry na PC, mobily a tablety. Z důvodu nejširší podpory byl vybrán programovací jazyk HTML5 + JavaScript (původně jsme chtěli využít technologii Flash, ale s tou to do budoucna nevypadá příliš růžově, např. Android od Flashe prakticky upustil). Hra by měla být z pohledu vlastních očí, hráč tedy nebude na displayi ovládat pohybující se postavu. Inspiraci jsme nalezli ve hrách jako je Přítmí, Okulděje 3, Jack French a prakticky všech hrách od společnosti G5 Games ( Vytvořený engine nemusí mít grafickou podobu, postačí kusy kódu, malé moduly (pečlivě popsané), ze kterých bychom pak byli schopní svépomocí postavit hru. Každý následující požadavek proto postačí dodat jako samostatnou ukázku. Každá lokace pak může mít podobu samostatné HMTL stránky. Výsledek by mělo být možné spustit na jednotlivých zařízeních (Android, WP,...) bez nutnosti internetového připojení, nejlépe jako nativní aplikace. K testování enginu a jeho funkčnosti můžeme využít například tato zařízení: 1) Nexus 7 2) HTC Sensation XE 3) Huawei Ascend P6 4) Nokia Lumia 520 5) Nokia Lumia 900 6) HTC 8S 7) Ainol Mars 8) ipad 3.generace 9) Blackberry Z10 10) iphone 4S... a asi 30 dalších Pokud ale po přečtení našich základních představ a požadavků na engine usoudíte, že by se pro tvorbu hodil jiný programovací jazyk, případně že by se některé věci daly udělat zcela jinak, určitě dejte vědět a celé to ještě zvážíme. Vše je o diskuzi. Grafika Pro lepší pochopení našich požadavků by bylo vhodné si stáhnout hru Okulděje 3 ( nebo si zahrát flashovou hru Jack French (

2 Klikací mapy Součástí každé herní lokace bude klikací mapa, tedy pro hráče neviditelné ohraničení částí obrazovky, na které se bude dát kliknout (pro sebrání předmětu, přesun na jinou lokaci, prozkoumání, atd.). U klasického HTML se klikací mapy dělají velmi jednoduše, například takto: <map name="lokace01"> <area href="lokace02.html" shape="rect" coords="80, 80, 130, 130"> <area href="auto_detail.html" shape="rect" coords="20, 20, 50, 50"> </map> Problémem ale je, že se souřadnice udávají napevno (v pixelech). Protože ale nevíme, jaké rozlišení displaye bude mít zařízení, na kterém bude hra spuštěna, je potřeba tuto klikací mapu vytvořit jiným způsobem (např. namísto px využít %). Stručně řečeno - ať už bude hra spuštěna na zařízení s rozlišením 480x360 či 1280x720, obrázek lokace by se tomu měl přizpůsobit, a to včetně klikacích map. Jako základní rozlišení by se dalo využívat 1280x720, protože to se postupně stává standardem (respektive než dokončíme engine a hru, tak bude toto rozlišení běžné i u telefonů za 3000,- a nepsaný standard bude už úplně někde jinde... postupně se tomu ale přizpůsobíme). Dalším požadavkem je grafické znázornění akce, která nastane po kliknutí na určité klikací pole. První klik na dané pole způsobí, že se uprostřed tohoto pole zobrazí malý obrázek znázorňující určitou akci (např. při kliknutí na auto se zobrazí lupa, při kliku na kraj lokace se zobrazí šipka upozorňující na možnost přechodu na jinou lokaci). Obrázky šipek, lupy, atd. bychom dodali (předpokládám, že ve formátu PNG s průhledným pozadím).

3 Teprve až druhý klik způsobí, že se daná akce skutečně stane. Občas se v lokacích budou nacházet předměty, které bude možné sebrat (tedy po kliknutí a následném komentáři zmizí z lokace a zobrazí se v inventáři). Můžeme to asi vytvořit více způsoby, např. buď bude obrázek lokace nakreslený bez těchto předmětů a ty tam budou dodány jako obrázky, napozicovány stejně jako klikací mapy, nebo můžeme vytvořit dvě rozdílné lokace, jednu s předmětem, druhou bez předmětu. Pak se ale bude muset vymyslet způsob, jak zabránit tomu, aby se hráč nevrátil do nesprávné lokace (pokud vezme předmět, odejde a vrátí se, musí se vrátit do lokace, kde už předmět není) Animace Pro doplnění či příběhový posun budou využívány animace. Není potřeba přehrávat video, v základní verzi bohatě postačí postupné změny příběhových obrázků. K nim pak bude patřit hudba, dabing a titulky. Mezi požadavky patří možnost časování změny obrázků, včetně přechodových efektů. Další typ animací by měl být přímo na herních lokacích. Aby nepůsobily neživým a strnulým dojmem, bylo by vhodné je doplnit alespoň pár animacemi/pohyblivými obrázky. Např. digitální hodiny po výpadku proudu -> bliká na nich pouze 00:00. Dalo by se to udělat velmi jednoduchou animací v GIFu a tu jen vložit přímo na herní lokaci. Není to těžké, zabírá to málo místa a celkově to oživí prostředí. Samozřejmě by tento obrázek také musel měnit svoji velikost v závislosti na rozlišení displaye zařízení. Efekty Aby animace nebyly jen sled obrázků poskládaných za sebou, chtěli bychom je vylepšit nejrůznějšími přechodovými efekty. Mezi ty by mělo patřit: - postupné stmívání - postupné zesvětlení (až do běla) - rychlé problikávání obrázků - posun širšího obrázku zleva doprava (případně obráceně). Buď automaticky, nebo pomocí myši/prstu

4 U všech efektů by měla být možnost časování. Titulky Titulky by se měly zobrazovat společně s dabovaným komentářem. Při určité akci a spuštění dabingu by se měl v dolní části obrazovky (případně horní, to se rozhodne později) zobrazit černý pruh s bílým textem. U toho bude ale potřeba mít možnost ho nějak "rozsekat" a zobrazovat pouze postupně. Například: po kliknutí na předmět se má ozvat a zobrazit komentář: "Na této fotce je moje tetička. Měl jsem jí moc rád, vždycky když k nám přišla, tak mi dala čokoládu. Škoda, že zemřela tak brzo." Nadabovaný komentář bude mít např. 21 sekund, ale celá věta se naráz nedá textově zobrazit (velikost fontu by měla být stále stejná). První věta bude řečena za 5 sekund, druhá za 15, třetí za 6. Věty by se proto měly zobrazovat postupně v těchto intervalech. U veškerých textů by bylo žádoucí, aby se získávaly z jednoho zdroje, např. souboru TXT, HTML, atd.. Výrazně by se tak zjednodušil případný překlad do cizího jazyka. Inventář Inventář bude asi nejtěžší věc na tvorbu. Základ bude jednoduchý, v levém horním rohu bude malý obrázek (např. nějaký box). Po kliknutí se ze shora vysune černá lišta, kde bude tlačítko pro zasunutí inventáře, tlačítko pro přechod do menu a kolonky pro sebrané předměty.

5 Jak bude nakonec inventář fungovat, to upřesníme později. Jsou dvě možnosti: 1) budeme se držet staré školy, tedy možnosti všechno-na-všechno. Předměty by tak hráč mohl uchopit a přenést nad objekt v lokaci, aby ho "použil". Příklad: v inventáři mám hudební CD a jsem v lokaci, kde se nachází CD přehrávač. Otevřu inventář, uchopím CD, přenesu ho až k přehrávači a kliknu... následně se něco stane. 2) vyzkoušíme nový a moderní styl vyprávění příběhu a používání inventáře. Ideální příklad je adventura The Walking Dead od Telltale Games. Tam sice předměty postava sbírá, ale nemá možnost s nimi jakkoliv manipulovat. Prostě je má, hráč vidí, které předměty vlastní, ale použít je může jen v předem určené situaci. To by bylo na tvorbu možná jednodušší. Audio Hudba - veškeré lokace by měly být podbarveny hudbou, případně nějakými zvuky. Při přechodu z jedné lokace do druhé bude potřeba nějakým způsobem určit (nejlépe nějakým příznakem), zda má pokračovat stávající skladba, či zda se má spustit něco jiného. - engine by měl být schopný spustit více zvuků najednou, např. v pozadí jede hudba a zároveň se ozývá mluvený komentář. - pokud to nebude složité, zamyslet se i nad různými zvukovými efekty, jako je zesílení/ztlumení hlasitosti hudby v určitý okamžik (příklad: lokace, kde se má něco stát. Hudba postupně utichne, aby se daný okamžik dal podbarvit jinou hudbou, zvuky, případně pouze tichem) Zvuky - při určité akci (např. kliknutí na interaktivní předmět) by se měl přehrát určitý zvuk Dabing - stejné jako u zvuků, při kliknutí na určitý objekt by se měl ozvat dabovaný komentář. Rozdíl by byl pouze v tom, že u komentáře by se měly objevovat i titulky Dialogy Po kliknutí na osobu, se kterou se má vést dialog, by se měl hráč dostat na speciální obrazovku, kde bude moct určovat, na co se má zeptat. Požadavky na dialogy jsou tyto: - u jednotlivých vět budeme moct určit, zda se už nikdy nemá zobrazit, nebo se má opakovat při každém rozhovoru s konkrétní postavou. Jde o to, aby ty postavy neříkaly pořád dokola to samé. - postava může při rozhovoru říct nějakou zajímavou informaci, což by se mělo projevit změnou na jiné obrazovce, např. hráč se během rozhovoru dozví o nové lokaci a na mapě se tato lokace zobrazí - postava nám také může dát nějaký předmět, který by se následně měl zobrazit v inventáři - u určitých voleb v dialogu by měla být možnost ovlivnění dalšího postupu v příběhu. Tím je na mysli to, že dostaneme dvě možnosti odpovědí a každá z nich nás přenese na

6 rozdílnou lokaci (např. odpovím "ano" - dostanu se na lokaci A, odpovím "ne" a budu přenesen do lokace B) Toto jsou první a základní požadavky na tvorbu herního enginu. Postupně se určitě budou objevovat nové požadavky, ale s tímto základem by mělo být možné už vytvořit alespoň základní adventuru.