top of page

Twine – program na tvorbu interaktivních scénářů

Během mých studií na fakultě nám vždy říkali, že učitelé by se měli vzdělávat celý život. Tehdy jsem doufal, že si dělají legraci. Pak jsem nastoupil na své první místo a vedení to po mně fakt chtělo. S postupem času jsem zjistil, jak málo kurzů k mému zaměření je, a tak jsem začal hledat alternativy, abych se nakonec propracoval až k hernímu designu. Zde jsem byl při studiu herní scenáristiky seznámen s programem Twine, který slouží k tvorbě interaktivních scénářů nebo-li textových (narativních) her, a jeho využití v hodinách informatiky ocení i učitelé, pro které je nadlidský úkol i přeposlání e-mailu kolegovi.



Jediné, co k úspěšnému programování v Twine potřebujeme, je totiž myš, klávesnice a toto: [ ] – hranatá závorka.


Program Twine je navržen tak, aby na něm byli schopni naprogramovat hru i úplní začátečníci. Aplikace se dá stáhnout do počítače, pokud má však škola zabezpečenou síť a její správce vám stažení nechce povolit z jakéhokoliv důvodu, je zde i možnost spustit program ve webovém prohlížeči, viz https://twinery.org/.


V následujícím odstavci budu promlouvat hlavně k začátečníkům, kteří třeba jen chtějí zpestřit hodinu IT nebo jazyka, posléze se budu věnovat pokročilejším programátorům.


Jak jsem již psal výše, Twine je velmi jednoduchý na ovládání. Začněte tím, že nejprve klinete na záložku + New, čímž vytvoříte formát, ve kterém lze hru vytvářet. Dále jediné co nám je k fungování Twine zapotřebí znát je klávesová kombinace AltGr+F a AltGr+G. Tyto dvě zkratky nám vytvoří hranaté závorky, které v programu fungují jako odkazující linky. Pokud tedy napíši do programu větu „Probudil ses uprostřed lesa a nevíš, kde ti hlava stojí. Vstaneš a rozhlédneš se. Ležíš uprostřed cesty a můžeš se tedy vydat [[vpravo]] nebo [[vlevo]].“, program nám vytvoří z hranatých závorek uzly, z nichž můžeme vyjít dále a scénář tak větvit, viz obr. 1.


Ukázka práce v Twine


Větvení scénáře se nám zobrazuje s krátkým náhledem textu vždy v rozhraní, každý uzel má v záhlaví své pojmenování (odkaz v hranatých závorkách), můžeme tedy vytvářet smyčky a mezi jednotlivými okny se vracet, pokud do hranatých závorek vždy napíšeme název jednotlivého uzlu. Aby scénář nebyl příliš komplikovaný, trval bych jako učitel na takovém psaní, aby se potenciální hráč mohl „rozhodnout“ třeba kterým směrem se vydá, ale výsledek byl stejný, programujícímu to šetří obrovské množství času, ukázka na obrázku 2.


Ukázka větvení v Twine


V liště nad příběhem najdete tlačítko „Test from here“, díky kterému můžete vyzkoušet, jestli vám daný uzel reaguje správně. V případě, že máte hru napsanou, je třeba ji ještě vyexportovat, abyste ji mohli poslat jiným lidem, ideálně kamarádům. V záložce „Build“ najdete tlačítko „Publish to file“, to by vám mělo hru vyexportovat do stažených souborů v .html formátu, měla by tedy být dvojklikem spustitelná v prohlížeči. Pokud se však hra spustit nechce, nebo se tváří jako nefunkční soubor, stačí na ikonu pouze kliknout pravým tlačítkem a za název souboru připojit ono kouzelné .html, čímž soubor přeměníme na hypertextový, a v tu chvíli by jej měly všechny prohlížeče spolehlivě přežvýkat.


Pokud jste následující instrukce vyzkoušeli, pochopili a navíc vám fungují, jste přesně jednu lekci před studenty; což vám stačí k tomu, abyste jim mohli veškeré moudro předat a začít s nimi programovat jejich první hru.


V případě, že se chcete pustit do složitějšího programování, ať už proto, že jste zkušenější vy, vaši studenti, nebo vám prostě jen postup výše připadá příliš banální, řeknu v následujících odstavcích jak na to. Twine je ve své podstatě velice obsáhlý program, byť se tak na první pohled nemusí jevit (a v tom tkví jeho nesporné kouzlo), a jeho hloubkové vysvětlení by si vysloužilo textu na drobnou knihu než na článek na učitelském portále. Podělím se tedy spíše o pár tipů a triků a zbytek vás nechám pomocí YouTube a twinery.org objevovat solitérně.


Ukázka finální profesionální hry ve Twine


Jestliže chcete do své hry vkládat obrázky, hudbu, zvuky nebo animace (ideálně gify), je nutné programovací jazyk přepnout na pohodlnější formát. V menu v horní liště rozklikněte záložku Twine a v ní „Story formats“, kde zvolte SugarCube a potvrďte tlačítkem v liště „Use as Default Format“. V tuto chvíli můžete do svého scénáře vkládat odkazy na hudbu z YouTube nebo obrázky z webu. Současná verze Twine neumožňuje implementovat vaše vlastní kresby nebo zvuky, jestliže nejsou nahrány na internetu (ano, jsou možnosti jak použít své vlastní věci, ale do toho nebudu zabředávat). Pokud se vyznáte v CSS nebo JavaScript, otevírají se vám v Twine úplně nové možnosti. Jste schopni do programu vkládat obrázky, na které lze klikat, a uzly tedy nejsou vázány jen na text. V rámci dlouhodobého školního projektu doporučuji zvolit tuto cestu, výsledkem může být plnohodnotná hra, která vaše studenty nakopne k další tvorbě.


Pro mnoho studentů může být právě tento program díky své jednoduchosti a postupnému nabalování informací dveřmi do světa programování či herního průmyslu, níže tedy přikládám i ukázku toho, jak může hra v programu Twine vypadat. Mnoho dalších ukázek můžete najít i na webu https://itch.io/games/made-with-twine, většina je však v angličtině (což by ale v jejich prozkoumání mladé generaci nemělo bránit).


Závěrem ještě přikládám níže svoji krátkou hru, kterou jsem vytvořil během kurzu za necelých 45 minut, můžete si ji zkusit zahrát – rád bych předem upozornil, že se ve hře projevila má Ostravská nátura a tudíž hra obsahuje vulgární či na její hranici se pohybující výrazy.


Děkuji za pozornost a brzy zase [[nashledanou]].


Ondřej Maslák


Ukázka finální profesionální hry ve Twine


Výtah_small game by Ondrej Maslak
.rar
Stáhnout RAR • 140KB

Ukázka autorovy hry Výtah


Související příspěvky

Zobrazit vše
bottom of page