Studentská tvůrčí a odborná činnost STOČ 2013

Studentská tvůrčí a odborná činnost STOČ 2013 VIRTUÁLNÍ PRŮVODCE II. ZÁKLADNÍ ŠKOLY BOŽENY NĚMCOVÉ V ZÁBŘEHU Nikol KOMENDOVÁ Univerzita Tomáše Bati ve Zlíně, Fakulta aplikované informatiky, Nad Stráněmi 4511, 760 05 Zlín 25. dubna 2013 FAI UTB ve Zlíně

Klíčová slova: virtuální prohlídka, fotografie, zpracování obrazu, počítačová grafika, propagace. Anotace: V příspěvku je popsána tvorba virtuálního průvodce II. základní školy Boženy Němcové v Zábřehu. Virtuální průvodce je tvořen virtuální prohlídkou této školy a 3D modelem. Jedná se o interaktivní aplikaci, pomocí níž je umožněno procházet prostory školy s neomezeným úhlem pohledu. Tato aplikace byla vytvořena na základě pořízených fotografií interiéru školy a jejich následného zpracování do výsledné podoby virtuální prohlídky. Součástí virtuálního průvodce je vyhotovený 3D model areálu školy. Virtuální průvodce je reálně použit uvedenou základní školou, a to za účelem její propagace. 2

Obsah 1. II. základní škola Boženy Němcové... 4 2. Virtuální průvodce... 4 3. Použitý software... 5 4. Tvorba virtuální prohlídky... 5 4.1 Technické vybavení... 5 4.1 Zmapování prostor... 6 4.2 Fotografování... 6 4.3 Úprava snímků... 7 4.4 Sférické projekce a jejich propojení... 7 4.5 Návrh prohlížeče... 8 5. 3D model školy... 9 6. Závěr... 10 Literatura... 10 3

1. II. základní škola Boženy Němcové Základní škola Boženy Němcové v Zábřehu patří mezi tři zábřežské základní školy a je umístěna v poklidné části města. Škola se skládá ze sedmi pavilonů, které jsou spojeny krytým spojovacím chodníkem. V areálu školy najdeme hřiště, atletickou dráhu a pozemky. Ve všech čtyřech pavilonech na levé straně spojovacího chodníku jsou umístěny kmenové třídy, učitelské kabinety a odborné učebny cizích jazyků a zeměpisu. Správním pavilonem je nazýván první pavilon na pravé straně. V tomto správním pavilonu jsou kanceláře ředitele školy a jeho zástupce, dále pak sborovna, učebny informatiky, hudební výchovy a školní družina. V přízemí tohoto pavilonu se nachází jídelna a knihovna. V dalším pavilonu se nachází učebny odborných předmětů. Poslední pavilon je sportovní se dvěmi velkými a jednou malou tělocvičnou. Od školního roku 2008 disponuje základní škola třemi interaktivními tabulemi. Ve školním roce 2012/2013 ji navštěvuje 465 žáků a působí zde 33 učitelů, mezi které patří i nynější ředitel školy Mgr. Pavel Nimrichtr. Ve škole se učí podle školního vzdělávacího programu Škola pro život, který nabízí pro žáky druhého stupně celou řadu volitelných předmětů. Ve škole také působí Školní klub složený ze zkušených pedagogů, který nabízí žákům volnočasové aktivity pod jejich dohledem.[8] 2. Virtuální průvodce Obrázek 1. Fotografie prostředí školy Virtuální průvodce je tvořen virtuální prohlídkou a 3D modelem výše zmiňované školy. V prvním případě se jedná o interaktivní aplikaci, pomocí níž je umožněno procházet vnitřními prostorami školy s neomezeným úhlem pohledu. Tato virtuální prohlídka je vytvořena na základě pořízených fotografií interiéru školy a jejich následného zpracování. 3D model poskytuje kompletní zobrazení venkovního areálu školy. V současné době nastal velký rozmach tvorby virtuálních prohlídek. Je to nový způsob, jakým je možné zachytit dům, pozemek či jinou nemovitost a předvést ji v co nejrealističtější podobě. Virtuální prohlídka je tvořena sférickou projekcí vytvořenou zachycením kompletní scény v rozměrech 360 horizontálně x 180 vertikálně nazývanou sférickým panoramatem. S pomocí vhodného softwaru jsou tyto sférické projekce propojeny, a to za použití navigačních bodů (tzv. hotspotů) a nástrojů dostupných v konkrétním programu pro tvorbu virtuální prohlídky. Pomocí hotspotů je docíleno přechodů mezi jednotlivými scénami, ale ne všechny typy virtuálních prohlídek obsahují tyto hotspoty. Můžeme říci, že základem virtuální prohlídky je panoramatická fotografie. Ta je složená z 4

několika snímků, které jsou pořízeny v určitém sledu pod určitým úhlem tak, aby byl zachycen celý prostor okolo pozorovatele. Tento postup vyžaduje poměrně velké množství práce, než se dosáhne finální podoby virtuální prohlídky. 3D modely jsou základem počítačové vizualizace a animace, které lze získat mnoha různými způsoby. 3D model lze vytvořit pomocí 3D skenování a digitalizace, až po samotné modelování pomocí různých nástrojů. 3D model areálu školy byl ve virtuálním průvodci vytvořen modelováním ve vybraném softwaru. 3. Použitý software K úpravě snímků byl použit volně šiřitelný grafický software Gimp. Tento software slouží pro úpravu zejména 2D rastrové grafiky a používá se například v oblastech webových stránek, při úpravě digitálních fotografií, nebo k vytváření vlastních obrázků. V této práci je Gimp použit pro vyvážení barev snímků, retuší snímků a při vytváření grafického návrhu prohlížeče virtuálního průvodce.[2][4] Dalším použitým softwarem je Hugin. Tento software se používá ke spojení snímků při vytváření panoramat. Pomocí softwaru Hugin jsou nalezeny kontrolní body na překrývajících se fotografiích. Tyto kontrolní body je možné přidat automaticky, ale pro bezchybné vytvoření panoramat je vhodné volit ruční přidávání kontrolních bodů na každé z těchto sousedních fotografií.[5] Software Pano2VR slouží k převodu sférického panoramata do formátu Adobe Flash 10, HTML 5 aj. Obsahuje funkce pro přizpůsobení vlastních vzhledů, přidání přístupových bodů a hudby. Pano2VR umožňuje export pro web a vytváření virtuálních prohlídek právě s přístupovými body pro přechod do dalších lokací projekce nebo odkaz na webové stránky.[7] Pro tvorbu 3D modelu bylo využito volně šiřitelného softwaru Blender. Tento software obsahuje funkce pro modelování, vytváření animací, interaktivních aplikací, práci s kamerou a světly. Součástí Blenderu jsou také rendering (s možností přidání velice rychlého ray tracingu), částicové systémy a kvalitní UV mapování.[3] 4. Tvorba virtuální prohlídky 4.1 Technické vybavení K úspěšnému vytvoření kvalitní panoramatické virtuální prohlídky a tedy vyfotografování 360 panoramat jsou potřeba tyto 4 základní věci: profesionální stativ panoramatická hlava digitální zrcadlovka objektiv Profesionální stativ zajistí oproti běžným stativům větší stabilitu při fotografování, nedochází tak k vibracím a roztřesení fotoaparátu. Z důvodu vysoké ceny panoramatické hlavy na trhu byla tato hlava vyrobena. Snímky byly pořízeny digitální zrcadlovkou typu Nikon D700 s obrazovým snímačem CMOS a formátem FX s rozlišením 12,1 Mpixelů. Pro fotografování 5

360 panoramat je vhodný širokoúhlý objektiv nebo objektiv typu rybí oko. Díky širokému záběru objektivu je potřeba méně snímků na zachycení celé scény. Objektiv typu rybí oko je schopen snímat scénu v zorném úhlu 180 a více. Byl použit tedy typ objektivu rybí oko Zenitar 16mm f/2.8, jelikož byl problém levně sehnat originální objektiv Nikkor. Pro vylepšení kvality pořízených snímků je vhodné použít k fotografování dálkovou spoušť a pro vyvážení fotoaparátu vodní váhu. Obrázek 2. Použité technické vybavení pro tvorbu virtuálních prohlídek Po vyrobení panoramatické hlavy je nutné najít optický střed soustavy fotoaparát objektiv a na tomto místě fotoaparát upevnit. Při pořizování snímků musíme otáčet fotoaparátem kolem jeho optického středu, nelze pořizovat snímky otáčením fotoaparátu kolem osy stativu. Při tomto chybném fotografování dochází ke vzniku paralaxy. Paralaxa je posunutí objektu v popředí vůči nějakému objektu v pozadí při pozorování objektu v popředí z více míst pod různým úhlem.[1] 4.1 Zmapování prostor Před zahájením fotografování bylo třeba projít všechny prostory školy a promyslet, jak bude vypadat výsledná prohlídka. Naplánovat záchytné body při fotografování, které v prohlídce určují přístupová místa pro další možnosti přemístění. Po naplánování tohoto postupu fotografování bylo vhodné klást důraz i na klimatické podmínky, především při pořizování snímků v exteriéru. 4.2 Fotografování Fotografování pomocí digitální zrcadlovky se provádělo nastavením manuálního režimu. Při použití automatického režimu totiž dochází k automatickému zaostření a tak ke změně zorného pole fotoaparátu. Dále byly při fotografování stanoveny následující pravidla: Bylo potřeba hlídat zachování kontrastu, expozice a clony mezi snímky. Snímky byly pořízeny ve formátu RAW. Při fotografování 360 panoramata se musely překrývat sousedící snímky přibližně z 30%. 6

Pro zachycení celé scény 360 x180 bylo pořízeno 6 snímků pod úhlem 90 a 4 snímky pod úhlem 45 vůči panoramatické hlavě. Z důvodu nepřesně vyrobené panoramatické hlavy bylo třeba provádět po každém snímku vyvážení fotoaparátu pomocí vodováhy. Ke zvýšení kvality pořízených snímků a tedy zabránění neroztřesení fotoaparátů byla použita dálková spoušť. Celkem bylo pořízeno 600 snímků a z toho vhodných pro další zpracování bylo vybráno 200. 4.3 Úprava snímků Ve formátu RAW bylo na všech snímcích provedeno vyvážení bílé barvy a poté byly snímky převedeny do formátu JPEG. Poté následovalo spojení snímků do jednoho panoramata pomocí softwaru Hugin. V tomto softwaru bylo nutné ručně přidat kontrolní body na sousedících fotografiích, aby došlo ke správnému zarovnání linií a tak spojení snímků. Až po spojení snímků mohly být provedeny další úpravy, jako jsou úpravy barev, jasu, kontrastu a celková retuš výsledného panoramatu. Barevné úpravy jednotlivých snímků by totiž narušily spojení výsledného panoramata (byly by viditelné přechody mezi snímky). Spojené panorama 360 x180 v jednom místě pozorování dosahuje rozlišení 12000 x 6000 pixelů. Obrázek 3. Ukázka panoramatické fotografie z jedné místnosti školy 4.4 Sférické projekce a jejich propojení Pomocí programu Pano2VR byly panoramata převedena na sférické projekce. Vytvořením sférické projekce bylo možné provést exportování do libovolného formátu vybrané plochy pro případné retušování. Jelikož byly snímky pořízeny objektivem typu rybí oko, na snímcích se projevuje deformování linií a retuš takových ploch je velice obtížná. Proto se retuš slepého místa vytvořeného stativem provádí až po vytvoření sférické projekce. Sférické projekce vytvoříme ze všech pořízených panoramat. Sférické projekce lze provázat pomocí navigačních bodů. V každé takto vytvořené projekci je třeba přidat navigační body, které odkazují na další projekci. Navigační body se musí přidávat ve všech projekcích samostatně a nesmíme zapomenout ani na zpětnou vazbu. Tedy když se odkážeme do jedné projekce, musíme pak v té samé projekci umístit navigační bod zpět na předcházející projekci. 7

Obrázek 4. Tvorba navigačních bodů v programu Pano2VR 4.5 Návrh prohlížeče Výstupem sférických projekcí je zkompilovaná Flash aplikace ve formátu.swf, která je vložena do html stránky. Spuštění virtuálního průvodce se provádí pomocí prohlížeče, jehož vzhled můžeme navrhnout sami pomocí programu Pano2VR. V prostředí editoru tohoto softwaru lze přidávat námi navrhnutá tlačítka, informační panely, loga aj. Těmto prvkům se následně přiřazují akce. Například tlačítku se znakem plus přiřadíme akci, že po kliknutí myší se provede přiblížení scény. U tlačítek a obrázků lze nastavovat velké množství akcí, ať už změnu velikosti, průhlednosti, přidávání URL adres a další. Záleží jen na nás, jaký vzhled prohlížeče vytvoříme. Obrázek 5. Uživatelské prostředí editoru Pano2VR K návrhu vzhledu prohlížeče virtuálního průvodce byl použit software Gimp. V tomto software byly vytvořeny všechny prvky prohlížeče. Virtuální průvodce obsahuje hlavní panel, na kterém jsou umístěná tlačítka pro ovládání scény (přiblížení, oddálení, pohyb do stran). Na tomto panelu je dále možnost zapnutí autorotace, tedy automatického otáčení scény a tlačítko 8

pro přepnutí zobrazení na celou obrazovku. Posledním tlačítkem na hlavním panelu je tlačítko informace, které je zobrazeno ihned po načtení virtuálního průvodce. V prohlížeči dále nalezneme ikonu s textem 3D, která slouží pro zobrazení 3D modelu areálu školy. Aplikace obsahuje mapu rozmístění učeben a panel s barevně rozlišenými pavilony pro spuštění projekce námi vybraného místa. Prohlížeč obsahuje i řadu dalších prvků, mezi které patří například i odkaz na domovské stránky školy. Obrázek 6. Snímek z virtuální prohlídky školy 5. 3D model školy Pro co nejpřesnější vytvoření 3D modelu areálu školy bylo potřeba nejprve získat stavební plány. Některé z nich byly získány od ředitele školy, ostatní byly nalezeny ve stavebním archívu města Zábřeh. Tyto plány byly načteny do Blenderu a na jejich základě byl s pomocí běžných modelovacích nástrojů [6] vytvořen zjednodušený model areálu školy. Tento model byl posléze pomocí programu Sketchfab převeden do verze pro www stránky. Obrázek 7. 3D model školy v programu Blender 9

6. Závěr Tato práce popisuje tvorbu virtuálního průvodce II. základní školy Boženy Němcové v Zábřehu. Její celý obsah je rozdělen do dvou částí. První část popisuje postup vytvoření interaktivní aplikace, která je založena na základě pořízených fotografií. S její pomocí je možné procházet prostorami školy s neomezeným úhlem pohledu. Druhá část práce se zabývá vytvořením zjednodušeného 3D modelu exteriérových prostor této školy. Tento model byl následně exportován pro prohlížeče www stránek. Obě části práce jsou vzájemně propojené a koncipované tak, aby mohly být použity uvedenou základní školou za účelem její propagace. Celá práce není dosud ještě ukončena v plánu je vytvořit několik úprav a rozšíření. U virtuální prohlídky je v plánu přidat další navigační body a tím rozšířit prohlídku interiérových prostor a dále se plánuje vylepšení uživatelského rozhraní prohlížeče. 3D model bude rozšířen o více detailů, dále budou přidané modely některých doplňků prostředí (sportovní hřiště, stromy apod.) a dále na všechny modely aplikovány vhodné textury. Literatura [1] FREEMAN, Michael. DSLR: naučte se fotografovat digitální zrcadlovkou. 1. vyd. Brno: Zoner Press, 2007, 256 s. ISBN 978-80-86815-79-4. [2] VYBÍRAL, Josef. GIMP: praktická uživatelská příručka. 2., aktualiz. vyd. Brno: Computer Press, 2008, 223 s. ISBN 978-80-251-1945-7. [3] BLENDER FOUNDATION. Blender.org - Home [online]. [cit. 2013-04-23]. Dostupné z: http://www.blender.org/ [4] GIMP - The GNU Image Manipulation Program [online]. 2001-2013 [cit. 2013-04-23]. Dostupné z: http://www.gimp.org/ [5] Hugin - Panorama photo stitcher [online]. 2012 [cit. 2013-04-23]. Dostupné z: http://hugin.sourceforge.net/ [6] Main Page - BlenderWiki [online]. 2006-2013 [cit. 2013-04-23]. Dostupné z: http://wiki.blender.org/ [7] Pano2VR. Garden Gnome Software [online]. 2013 [cit. 2013-04-23]. Dostupné z: http://gardengnomesoftware.com/pano2vr.php [8] Základní škola Zábřeh, Boženy Němcové 1503/15 [online]. 1999 [cit. 2013-04-23]. Dostupné z: http://bozenka.cz/ 10