Impress.js

Technology
12 hours ago
8
4
2
Avatar
Author
Albert Flores

Impress.js je framework vytvořený Bartkem Szopkou v roce 2011 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.

Vlastnosti prezentací

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. +more 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.

Časté motivy

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. +more * 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

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. +more 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ů.

Praktická doporučení

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. +more 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.

5 min read
Share this post:
Like it 8

Leave a Comment

Please, enter your name.
Please, provide a valid email address.
Please, enter your comment.
Enjoy this post? Join Cesko.wiki
Don’t forget to share it
Top