Nápověda: Jak vytvořit hru

Tvorba hry krok za krokem

Několik důležitých rad

Grafika hry

Základní rady a postupy

Vkládání grafických objektů
a animací do hry

Co ještě musíte vědět
o grafice hry

Nepřehlédněte

Praktické rady: Jak udělat...

FAQ: Často kladené otázky

Fórum tvůrců her

Vkládání grafických objektů a animací do hry

Různé grafické objekty a animace se vkládají rovnou do těch scén (lokací), kde se ve hře vyskytují. Výjimkou jsou pouze animace hlavního hrdiny, které mohou být použity v celé hře, a proto se vkládají do zvláštní lokace nazvané Pro testování a společné animace.

Pokud již máte nahrány pozadí i obrázky tak, jak je popsáno v kapitole Grafika hry – základní rady a postupy, můžete zvolit v menu položku Lokace a zde si vybrat lokaci, tedy scénu hry, ve které se mají nacházet právě vkládané obrázky. Pokud ještě žádná lokace neexistuje, vytvořte ji tlačítkem Vložit novou lokaci a poté pro ni nastavte vhodné pozadí.

Grafika, která se nehýbe

Nejjednoduššími grafickými objekty ve hře jsou ty, které se nehýbou. Takovými objekty jsou třeba keř, stůl nebo sloup v popředí, za kterými má hrdina hry projít, případně třeba nůžky, stojan nebo květina, které má hrdina sebrat.

Jak vložit nepohyblivý obrázek

Vkládání nového grafického objektu - motýla - na scénu.Takové objekty vložíte do příslušné lokace z jejího menu, které se automaticky otevře, jakmile začnete upravovat lokaci. Použijte tlačítko Přidej objekty na scénu. Jakmile ho stisknete, nad obrázkem scény se objeví volby pro výběr obrázku a pod-obrázku. Stačí vybrat a poté kliknutím myší umístit obrázek na správné místo. Tlačítkem Pozice kurzoru můžete změnit pozici obrázku vůči ukazateli myši, a tak pak lze obrázek umístit opravdu kamkoli – třeba do levého horního rohu, kdy je část obrázku mimo displej – pokud je to pro hru potřebné.

Takto lze postupně vložit všechny potřebné nepohyblivé obrázky.

Tip: Pokud při vkládání (kliknutí) obrázku stisknete klávesu CTRL, obrázek se vloží a současně zůstane připraven pro další vložení (nebudete ho tedy muset volit znovu). To je užitečné, pokud chcete vkládat více stejných obrázků.

Jak upravit nepohyblivý obrázek

Potřebujete-li umístění obrázku změnit, otevřete si kliknutím na volbu Hlavní menu opět hlavní menu a klikněte na Upravuj objekty. Ještě předtím si ale všimněte tlačítka Ukaž/Skryj čísla objektů – díky němu lze snadno zjistit číslo jakéhokoli objektu na scéně.

Po stisknutí tlačítka Upravuj objekty si nahoře vyberte číslo objektu, který chcete upravovat, a potom ho šipkami posouvejte potřebným směrem. Použijete-li současně klávesu Shift, posun bude rychlejší.

Upravit můžete také velikost obrázku (100 % = plná velikost, 50 % = poloviční a podobně). Všechny takto provedené změny je třeba uložit tlačítkem Uložit! Tlačítkem s hvězdičkou (na horní liště) si skryjete (a zase ukážete) všechny ostatní objekty, mimo toho, který právě upravujete. Aby se vám nepletly do práce. Tlačítkem - (mínus) pak skryjete právě vybraný objekt - a můžete tak editovat scénu bez něj, pokud se vám plete do práce. Skrytí platí pouze pro úpravy, nikoli pro samotnou hru!

Tlačítko Uložit (nahoře) vždy ukládá změny polohy a velikosti provedené u všech nepohyblivých objektů v dané scéně.

Najedete-li ukazatelem myši nahoře nad slovo „více“, ukáží se doplňkové volby. Díky nim lze objekt také smazat ze scény. Další, pokročilé volby popíšeme později. Nyní si jen řekněme, že se jimi nastaví, který objekt je více vepředu či vzadu, nebo to, kdy má být který obrázek vidět a kdy ne (bez nastavování je prostě vidět vždy).

Animace: Grafika, která se hýbe

Pocit života dodávají hře animace; například letící pták, tekoucí voda nebo přicházející postava. Zvláštní animací je animace hlavního hrdiny, kterou si vysvětlíme o trochu později.

Jak vložit animaci

Animace se vkládají podobně, jako nepohyblivé obrázky, jen s několika drobnými rozdíly. Opět tedy začneme v hlavním menu lokace, tentokrát stiskneme tlačítko Přidej anim. objekty na scénu. Nahoře teď opět můžete vybrat obrázek a pod-obrázek. A myší jej kliknutím umístit na určité místo. Postupně umístěte všechny fáze (obrázky) jedné animace, a to aniž byste znovu otevírali hlavní menu. Jen dva příklady:

1) Letící šíp: Vyberte svůj obrázek šípu a umístěte ho kliknutím tam, odkud poletí. Pak obrázek šípu umístěte kliknutím o kus dál ve směru letu. A ještě. A ještě. Dokud nedosáhne cíle.

2) Letící pták: Postup bude podobný jako u letícího šípu, jen obrázek se vždy bude měnit (šíp vypadá stále stejně, ale pták přece musí mávat křídly). Takže budete postupně umisťovat na různá místa různé pod-obrázky stejné animace.

Jakmile přejdete do hlavního menu, zadávání této animace se ukončí. Pokud znovu zvolíte Přidej anim. objekty na scénu, začne se tvořit nová animace. Pokud by mělo jít o pokračování stejné animace, budete ji muset dodatečně upravit prostřednictvím úprav animace (více dále).

Tip: Pokud při vkládání (kliknutí) obrázku animace stisknete CTRL, objeví se automaticky další pod-obrázek v řadě. Pokud tedy máte jednotlivé fáze (pod-obrázky) animace pěkně za sebou, můžete animovat velmi snadno. Pokud stisknete SHIFT, neposune se krok animace – takže tento i následující obrázek v animaci se zobrazí současně v jednom kroku.

Jak upravit nebo přehrát animaci

Animaci upravíte podobně, jako nepohyblivý obrázek – tedy z hlavního menu tlačítkem Upravuj anim. objekty. Opět si lze předtím pro lepší přehled zapnout zobrazení čísel animovaných objektů.

Při úpravách jsou opět nahoře tlačítka pro posun objektů do různých stran (s klávesou SHIFT bude posun opět rychlejší), pro nastavení velikosti a uložení změn. Nezapomeňte vždy uložit provedené změny!

Tlačítko Uložit (nahoře) nyní vždy ukládá změny polohy a velikosti provedené u všech animovaných objektů v dané scéně.

Pokud vyberete jakýkoli obrázek a stisknete Krok, ukáže se další krok – obrázek – stejné animace. Pokud je to poslední krok animace, ukáže se znovu první. Přitom se vždy skryjí všechny ostatní objekty na scéně. (Chcete-li, aby nepohyblivé objekty zůstaly při úpravách viditelné, zrušte jejich skrývání v menu více... - tlačítkem Při krokování neskrývej objekty. Stejným tlačítkem lze skrývání zase kdykoli zapnout.) Kliknete-li na Běž, spustí se celá animace, do které patří vybraný obrázek. Poté, co animace jednou proběhne, se zastaví.

Animace v editoru je pouze orientační. Správné fungování animace je po přípravě hry vhodné ověřit v aplikaci GameStylus na mobilním zařízení. (Rovněž platí, že pokud se má v jednom kroku jedné animace zobrazit více obrázků, při použití tlačítka Krok se ukáže vždy jen ten první. Při použití Běž se zobrazí všechny. Použití tlačítka Krok rovněž skryje všechny animace/objekty, které nejsou součástí daného kroku. Tlačítko Běž lze použít jak s ostatními objekty/animacemi zobrazenými, tak se skrytými - dle potřeby.)

Tlačítkem s hvězdičkou (na horní liště) skryjete/ukážete všechny objekty kromě vybraného.

Tlačítkem - (mínus; na horní liště) skryjete právě vybraný objekt - a můžete tak editovat scénu bez něj, pokud se vám plete do práce. Skrytí platí pouze pro úpravy, nikoli pro samotnou hru!

Najetím myší na slovo „více“ se ukáží doplňkové funkce dovolující například smazání vybraného objektu ze scény. Změnit tu lze také číslo animace, do které vybraný obrázek patří, a jeho krok. Pokud tedy například zjistíte, že jste omylem vložili krok 2 animace jako krok 3, zde to můžete změnit. Rovněž zde můžete přesunout obrázek z jedné animace do druhé.

Užitečná je také možnost nastavení, jak dlouho má který obrázek (krok) animace trvat, a to v setinách sekundy. Zadáte-li tedy 100, bude zobrazen 1 sekundu a pak se ukáže další krok animace.

Nastavit tu také lze, že se animace opakuje stále dokola, případně že běží tam a zpět – a případně kolikrát.

Tip: Vpravo nahoře můžete vidět tlačítko se znakem +. Pokud ho stisknete a poté kliknete kamkoli na scénu, objeví se zde křížek, který bude stále viditelný (dokud znovu nekliknete na tlačítko +). Tak si můžete označit nějaké místo - například pokud potřebujete na jedno místo zarovnat více kroků jedné animace, zarovnat sem předměty apod.

Ostatní funkce jsou pro pokročilejší uživatele a my se jim budeme věnovat v některém z dalších návodů.

Animace hlavního hrdiny

Hlavního hrdinu můžete animovat stejně, jako jakoukoli jinou animaci, jen s několika rozdíly:

1) Jeho animace vždy vkládejte do lokace nazvané Pro testování a společné animace

2) Jeho animace lze pojmenovat

Příklad fází animace hrdiny při chůzi doprava a doleva.Nejjednodušší animace hlavního hrdiny vlastně ani nemusí být animací – může to být prostě jeden obrázek hlavního hrdiny. Potom ovšem hlavní hrdina nebude přirozeně chodit, ale bude se posouvat.

Hra by měla obsahovat několik animací hrdiny:

1) chůzi vlevo, vpravo, nahoru, dolů, šikmo vpravo dolů, šikmo vlevo dolů, šikmo vpravo nahoru, šikmo vlevo nahoru; někdy lze chůzi vpravo a vlevo nahradit některou ze šikmých chůzí; v některých 2D (plochých) hrách si vystačíte s chůzí vpravo a vlevo

2) stojícího hrdinu ve směru vpravo, vlevo, nahoru, dolů

Další animace záleží na ději hry. Můžete vytvořit třeba animace pro plazení hrdiny, skákání, šplhání... Nebo třeba hrdinu v převleku. Fantazii se meze nekladou.

Tipy pro animaci hlavního hrdiny

Každá animace chůze hlavního hrdiny musí začínat a končit stejnou fází (fází vykročení). Neměla by obsahovat hrdinu stojícího v klidu. Proč? Normálně bude hrdina v klidu stát. Jakmile má jít, ukáže se první fáze chůze hrdiny, pak druhá atd. Aby byla chůze plynulá, nesmí žádná z animačních fází chůze být stejná jako hrdina v klidu - pak by chůze vypadala nepřirozeně (pokud nevěříte, zkuste někam sami dojít přirozeně a pak tak, že se při chůzi po každém kroku na chvíli zastavíte). První obrázek je tedy vykročený hrdina v daném směru, poslední je pak stejný, jako ten první. Ve hře se pak při chůzi animace opakuje stále dokola, dokud hrdina nedojde do zvoleného cíle. Tam se sám zastaví.

Tip: Animace do všech směrů by měly začínat vykročením stejnou nohou a mít stejně fází - kroky by měly být stejně rozfázované. Proč? Protože když hrdina za chůze mění směr, může díky tomuto postupu být chůze plynulá - plynule totiž přejde třeba z fáze 3 animace směrem dopředu do fáze 4 animace směrem doprava.

Všimněte si: Na obrázku s animací jdoucího hrdiny na této stránce jsou fáze, kdy je hrdina v klidu, označeny červeným X - ty tam nemají být. Místo posledního kroku v klidu má být opět první - vykročený. Vhodné je hrdinu nakreslit tak, aby jak přechod z klidu do vykročení, tak vykročení uvnitř chůze vždy vypadalo přirozeně.

Všimněte si: Pokud animujete hrdinu například pro chůzi vpravo, postava se skutečně musí posouvat vpravo. Nesmí tedy být všechny obrázky (kroky) animace na stejném místě, jinak by chození ve hře nefungovalo. A podobně pro další směry.

Hrdina stojící na místě se samozřejmě posouvat nemusí. Ve směru dolů může hrdina předvádět nudu – animace se spouští, když hráč dlouho nic nedělá. Do ostatních směrů může předvádět pohled do dáli, animace se spouští, když hráč ťukne na displej v daném směru. Anebo to prostě může být jen o jeden obrázek – a pak hrdina prostě bude vždy, když nepůjde, jen klidně stát.

I animace hrdiny stojícího na místě se opakují stále dokola. Pokud se mají po posledním kroku/obrázku zastavit, dejte jako trvání posledního kroku číslo 1500000 nebo větší. Pak se animace po posledním kroku zastaví. Toto platí i tehdy, má-li animace jen jeden krok. Pozor: Pokud takto například neukončíte animaci hrdiny stojícího směrem doprava, nepřejde se později ani do animace typu "hrdina se nudí" - protože se má za to, že je hrdina stále animován animací stání doprava.

Zbývá dodat, že editor nabízí i nástroj pro jemné vyladění chůze hlavního hrdiny. Kde hledat další informace?

Doporučujeme: Ještě několik zásadních tipů pro grafiku, FAQ: Často kladené dotazyZákladní návod na tvorbu her