WebAppGames

Pro soutěž jsem napsal fyzikální kouzelnický sandbox. Jedná se o hru na webu, kterou si můžete zahrát hned bez jakékoliv instalace na https://hejny.github.io/webappgames/.

Koncept hry

• 3D first person hra.
• Kostičkový Sandbox s otevřeným světem.
• Věci v tomto světě můžeš měnit pomocí kouzel.
• Kostičky jen tak "nevysí" ve vzduch. Na pozadí běží Fyzikální engine, který zboří vše, co nestojí pevně.

Další důležitou věcí, která ještě není implementovaná, je to. Aby hra využívala všech výhod webu. Viz. moje série Vytvoř si vlastní webovou hru.

Ovládání

Hra se dá zatím hrát pouze s klávesnicí a myší. Nejdříve si musiš "zamknout myš". To uděláš tak, že po spuštění klikneš úplně kamkoliv do scény. Prohlížeč se tě následně zeptá, zda chceš zamknout myš.

• Chodíš pomocí kláves [W][A][S][D] nebo pomocí šipek.
• Kouzla vybíráš kolečkem myši.
• A kouzlíš pomocí kliknutí myší.

Kouzla

Jsou rozdělena do 5ti kategorií:

• Subjective - Manipulují přímo s hráčem.
• Kinetics - Mění objektu jeho kinetickou energii.
• Create - Vytváření nových objektů
• Hide - Ničení či jiné měnění objektů
• Transform - Přeměňování

Technologie

• TypeScript nadstavba nad JavaScriptem
• Babylon.js 3D engine
• Oimo.js fyzikální engine
• Hand.js polyfill pro pointer události
• React knihovna pro vykreslování uživatelského rozhraní
• MobX knihovna pro držení stavu aplikace

Kam dál?

Celá hra rozhodně není dokončená, jedná se spíše o koncept na kterém bych v budoucnu mohl postavit reálnou hru pro hráče. Mám pár věcí, která bych rád udělal. Budu velmi rád za nápady, připomínky a rady.

Blízká budoucnost

Tohle jsou spíše nedodělky a bugy, které jsem prostě nestihl odladit před 1.10.2017.

• Ukládání hry do LocalStorage či do cloudu.
• Survival mód
• Zvuky

Do Vánoc

• Lepší generátor prostředí hry
• Pohodlnější stavění vlastních budov
• Možnost ovládat i na dotykových obrazovkách

Dlouhodobější vize

• Vytvořit nad tímto sandboxem nějaký Příběh.
• Multiplayer

Odkazy

Hru lze stáhnout i přímo pod článkem. Jde však pouze o mrtvou kopii, pokud chceš vidět aktuální verzi, použij následující odkazy.

Zdrojové kódy: https://github.com/…/webappgames

Zahraj si přímo na webu: https://hejny.github.io/webappgames/

Hodnocení porotců

Aplikace byla vytvořena do soutěže ITnetwork summer 2017

• David Čápka (8.5 bodů) - Jako vždy pěkná webová hra od tebe. Hratelnost nějakou dobu drží, potom to začíná být stereotypní. V článku u hry píšeš o plánech se survival módem, ten by tento problém určitě vyřešil. Škoda chybějících zvuků, ty k čarování přímo patří. Celkově to na mne působí jako dobře odladěný prototyp, ale k plnohodnotné hře tomu ještě kousek zbývá. Nechám se překvapit jak to bude dále vypadat.
• Lucie Hartingerová (8 bodů) - Billboard na začátku je epický! Nepodařilo se nám shodit věž tím velkým dominem, ale podařilo se nám ji shodit na sebe... Slušně jsme se zasekli při zkoušení jednotlivých možností demolice a přestavby. Akorát při rychlejším klikání se sloupy i zvětšovaly, i kopírovaly.
• Tomáš Bitter (8 bodů) - Spíš jako hru to beru jako demonstraci fyziky, která funguje dobře. Člověk si v tom může docela vyhrát. Ale do budoucna to chce rozhodně nějakou gamifikaci.

V následujícím kvízu, Kvíz - WebGL a BabylonJS, si vyzkoušíme nabyté zkušenosti z kurzu.

Galerie

Program byl vytvořen v roce 2017.