Impress.js
Impress.js je framework vytvořený Bartkem Szopkou v roce 2011[1] pro tvorbu webových prezentací. Jedná se o poměrně jednoduchý JavaScript, jehož zdrojový kód nepřesahuje 1000 řádků. Využívá vlastností kaskádových stylů css a jejich 3D transformací, značkovacího jazyka html5 a schopností moderních internetových prohlížečů. Inspirací pro vytvoření tohoto frameworku byla komerční platforma prezi "The zooming Presentation Editor." Výsledná prezentace je html stránka složená z jednotlivých snímků rozmístěných v prostoru nekonečného trojrozměrného plátna. [2]
Vlastnosti prezentací[editovat | editovat zdroj]
Všechny prezentace vytvořené v tomto frameworku spojuje několik základních rysů, díky kterým v mnoha ohledech překonávají klasické prezentace. Každá prezentace v impressu je stejně jako klasická prezentace tvořena jednotlivými snímky, mezi kterými se přechází pomocí šipek, tabulátoru, nebo myši. Snímky mohou vypadat naprosto shodně jako v PowerPointu, ale mohou mít i jakýkoliv jiný tvar, případně je mohou tvořit jen samotná slova. (Pozadí snímku může být průhledné.) Záleží jen na fantazii autora a jeho znalostech css. Snímky nejsou na rozdíl od klasických srovnány v jedné řadě, ale jsou rozmístěné v trojrozměrném prostoru. Jejich pozici určují souřadnice [x,y,z] středu každého snímku. Dalšími parametry snímků jsou jejich relativní velikost a míry pootočení kolem každé z os. Pomocí chytře zvolených parametrů je možné trojrozměrný prostor zaplnit snímky a vytvořit zajímavou strukturu prezentace. Přechody mezi snímky jsou tvořeny přeletem pomyslné kamery snímající prostor prezentace z jednoho snímky na druhý. Pro efekt přeletu je rozhodující rozdíl parametrů dvou sousedních snímků. Každá prezentace končí oddálením kamery a ukázáním celého prostoru se všemi snímky najednou. [3]
Časté motivy[editovat | editovat zdroj]
Možnosti pro vizuální podobu prezentací jsou téměř neomezené. Některé z nejčastěji používaných motivů jsou:
- Rozložení snímků v prostoru umožňuje použít ostatní snímky jako pozadí pro aktuální snímek.
- Pomocí oddálení kamery je možné zobrazit skupinu snímků najednou. Mezi snímky lze přecházet i mimo pořadí kliknutím myši na požadovaný snímek.
- Vložení velkého snímek s obrázkem (např. mapy, schématu) do prezentace umožňuje ostatní snímky lokalizovat v rámci obrázku. To je možné použít k zajímavým efektům, např. zobrazit mapu ČR na úvod prezentace, při přechodu na další snímek kamera najede na Prahu (přiblíží se obrázku), kde bude "schovaný" snímek o Praze, poté se kamera znovu oddálí na celou mapu a přejede na Liberec, kde bude "schovaný" snímek o Liberci.
Nástroje[editovat | editovat zdroj]
Pro vytvoření vlastní prezentace není potřeba žádná složitá instalace veřejně přístupných knihoven, ani nákup drahého softwaru. K tvorbě prezentace postačuje libovolný textový editor. Vhodný je však takový, který podporuje tvorbu html stránek, např. notepad++ a samotný skript impress.js. Posledním nezbytným nástrojem je schopný internetový prohlížeč, který dokáže prezentaci zobrazit. V tomto ohledu však definici "schopný prohlížeč" v současné době splňuje prakticky každý aktualizovaný browser. Alternativou jsou online GUI editory, např. Strut, ve kterých je možné vytvořit prezentaci online bez jakéhokoliv stahování a v omezené, ale mnohdy postačující, míře i bez jakékoliv znalosti html, či css. Další doplňkovou možností je použití různých generátorů kódu a vývojových nástrojů.[4]
Praktická doporučení[editovat | editovat zdroj]
- Jednou z největších nevýhod impressu je jeho silná závislost na internetovém prohlížeči použitém k zobrazení prezentace. Z tohoto důvodu není vhodné vytvářet celé volně přístupné internetové stránky v impressu. Obecně totiž není zaručena základní podpora všech nástrojů nezbytných pro správné zobrazení prezentace, nicméně v současné době všechny hlavní prohlížeče tuto podporu poskytují. Další problém spočívá v nejednotnosti zobrazení. Jednoduše nemáme zaručeno, že se daná prezentace zobrazí tak, jak si autor představuje na různých prohlížečích, v odlišných zařízeních s konkrétním operačním systémem.
- Pro vytváření prezentace, případně využití plného potenciálu impressu, je nutné mít alespoň základní znalosti css a html. Alternativou je použití jednoho z volně dostupných online GUI editorů, např. Strut, ale zde uživatel narazí na nepříjemná omezení, která zmenšují výhody impressu oproti standardním programům pro tvorbu prezentací.
- Vzhledem k povaze prezentací, kdy je možné zobrazit více snímků najednou, či použít ostatní snímky jako pozadí pro aktuální snímek a nepřeberné množství dalších možností, je velice jednoduché vytvořit nepřehlednou a nic neříkající prezentaci, čili prezentaci vizuálně zajímavou, ale jinak prakticky k ničemu. Pro vytvoření kvalitní prezentace je potřeba i cit pro grafickou stránku a to ve větší míře než v klasických programech.
- Dalším nebezpečím spojeným s nepřeberným množstvím možností grafické podoby prezentací je zanedbání obsahu, jehož předání by mělo být vždy hlavním smyslem každé prezentace.
Reference[editovat | editovat zdroj]
- ↑ SMITH, Devlin. Archivovaná kopie. , 2012 [cit. 2017-11-06]. . Rhodes University. . Dostupné online.
- ↑ RATNAYAKE, Rakhitha Nimesh. Building impressive presentations with impress.js : design stunning presentations with dynamic visuals and 3D transitions that will captivate your colleagues. Birmingham: Packt Pub., 2013. Dostupné online. ISBN 1849696489.
- ↑ Building Impressive Presentations with Impress.js | Demos. www.innovativephp.com [online]. [cit. 2017-11-06]. Dostupné online. (Angličtina)
- ↑ impress.js: Tools and demos [online]. [cit. 2017-11-06]. Dostupné online.