Prezentace se nahrává, počkejte prosím

Prezentace se nahrává, počkejte prosím

Multimédia v e-learningu Centrum distančního vzdělávání Univerzita Palackého v Olomouci.

Podobné prezentace


Prezentace na téma: "Multimédia v e-learningu Centrum distančního vzdělávání Univerzita Palackého v Olomouci."— Transkript prezentace:

1 Multimédia v e-learningu Centrum distančního vzdělávání Univerzita Palackého v Olomouci

2 Co jsou multimédia Odborně pojem Multimédia definujeme jako integraci textu, obrázků, grafiky, zvuku, animace a videa za účelem zprostředkování informací. Při jejich použití na počítači musí být uživateli umožněno, aby se zúčastnil tohoto zprostředkování interaktivně, tzn. Aby měl možnost zasáhnout do průběhu multimediálního programu.

3 Multimediální komponenty Vektorový obraz Rastrový obraz Počítačová animace Video Text Audio (zvuk, hudba…) Synchronizovaná multimédia

4 Nezapomeňte! Použití multimédií ve studijních oporách má své výhody a nevýhody. K výhodám patří atraktivnější a zajímavější studijní materiály, pohodlnější a účinnější vstřebávání informací. Mezi nevýhody se pak řadí náročnost na přenosovou kapacitu sítě, zvýšené nároky na výkon počítače, jsou finančně i časově náročné na vytváření, musíme najít vždy kompromis mezi množstvím přenesených dat a požadavky na estetiku opory.

5 MM komponenty na stránce element element

6 MM komponenty na stránce Pak nasledují elementy, které mohou mít své další atributy. Mohou existovat elementy se jménem: src – připojuje vlastní multimediální soubor autostart – při hodnotě „true“ se spouští automaticky controls – při hodnotě „ImageWindow“ nejsou žádná tlačítka k ovládání přehrávání, při hodnotě „All“ jsou k dispozici všechna a další Nakonec následuje vlastní verze objektu (obrázek, text, zvuk…) – umožňuje vnořování element element

7 ClassId a MIME type atribut CLASSID elementu OBJECT. Tento atribut jednoznačně identifikuje software, použitý na přehrání záznamu. Například classid="clsid:22D6F312-B0F6-11D0-94AB-0080C74C7E95" jednoznačně identifikuje WindowMediaPlayer 6.4. Tento kód vlastně identifikuje prvek ActiveX, který musí být nainstalován na PC předtím, než bude záznám přehráván. Pokud jej uživatel nemá ještě nainstalovaný, prohlížeč jej automaticky stáhne a nainstaluje. MIME (Multipurpose Internet Mail Extensions) je internetový standard, který popisuje druh obsahu (text, obrázky, audio, video…) Například: audio/mpeg očekává soubor *. mp3 MIME typy jsou uvedeny v dokumentu : RFC-2046:MIME Part2:Media Types …standard IETF(Internet Engineering Task Force) Různé aplikace podporují různé MIME typy.

8 Grafické formáty Rastrové – GIF, JPEG, PNG Vektorové – SVG Jaké výhody obecně přináší vektorová grafika oproti rastrové: je datově mnohem menší objekty nejsou rozměrově nijak limitovány (mohou být zvětšovány bez roztřepení a ztráty kvality) výplně a čáry mohou být průsvitné, nebo vybarvené přechodovou výplní s minimálním zvětšením souboru. Ale i vektorová grafika má své nevýhody: vektorová grafika se nehodí na příliš složité obrazce (velké množství barev, složitý tvar – třeba fotky)

9 Využití obrázků Jednoduchý obrázek Pozadí stránky Obrázek jako odkaz Klikací mapy Animovaný obrázek

10 Umístění obrázku na stránky Příkaz má parametry, které určují některé vlastnosti obrázku. Např.: Align="left" (right, center) - umístění obrázku na řádce v dokumentu (u levého, pravého okraje stránky nebo v jejím středu). Implicitně = left Width="číslo" - šířka obrázku v pixelech. Není-li uveden, obrázek se zobrazí v původní šířce Height="číslo" - výška obrázku v pixelech. Není-li uveden, obrázek se zobrazí v původní výšce Alt="text" - popisek, který se "objeví" při ukázání myší na obrázek. Nepovinný. Border="číslo" - rámeček okolo obrázku a jeho tloušťka v pixelech. Nepovinný, pokud obrázek není zároveň odkazem. Jestliže se jedná o odkaz, zobrazí se modrý rámeček o tloušťce 2 pixelů. Většinou se jedná o rušivý prvek stránky, proto se do parametru udává hodnota "0" - rámeček zmizí. Hspace="číslo" - velikost volného prostoru okolo obrázku v pixelech po jeho levé a pravé straně. Text není "nalepený" na okraj obrázku Vspace="číslo" - velikost volného prostoru nad a pod obrázkem v pixelech

11 Obrázek jako pozadí element …… atribut background Atribut background je složená vlastnost: bacground-image: definuje obrázek tvořící pozadí, hodnota je url bacground-repeat: udává, jak se má obrázek tvořící pozadí přes prvek body opakovat, hodnoty jsou: repeat, repeat-x(opakované vodorovně), repeat- y(opakované svisle), no-repeat (neopakuje se) bacground-position: nastavuje polohu obrázku tvořícího pozadí, hodnoty tvoří dvojici souřadnic x a y. bacground-attachment: udává, zda je obrázek na pozadí fixně nebo se posouvá s obsahem, hodnoty jsou scroll (posouvá se), fixed(neposouvá se). Platí pouze pro Internet Explorer.

12 Obrázek jako odkaz

13 Klikací mapy navigace.gif – plan.html, tisk.html, help.html, uvod.html

14 Animované obrázky

15 Programy pro tvorbu grafiky Rastrové programy na prohlížení, správu a úpravy fotografií Prohlížeč obrázků (Windows XP). Jen prohlížení a tisk, bez úprav obrázků. IrfanView - prohlížeč + základní úpravy - freeware. XnView - prohlížeč + základní úpravy - freeware. Adobe Photoshop Album 2.0 Starter Edition - základní verze zdarma Ulead Photo Express - existuje verze zdarma. Pouze v angličtině. Zoner Media Explorer licencován. Rastrové programy na úpravy fotografií a koláže Adobe Photoshop, stačí i LE nebo Elements - vynikající na úpravy a koláže. Corel Photo Paint 9 nebo 11 – Paint Shop Pro 8. -obsahuje i nástroj na tvorbu animovaných GIFů Animation Shop. GIMP - vynikající na úpravy a koláže, trochu svérázné, ale logické ovládání - Open Source Rastrové programy na tvorbu animovaných GIFů Zoner GIF animator. Animation Shop. Součást Paint Shop Pro 8. Editory vektorové grafiky: Open Office Draw 1.1- Open Source - legálně volně dostupný. Corel Draw 9.0 CZ nebo 11 CZ Zoner Callisto 4.0 Tvorba a čtení PDF souborů: OpenOffice verze Adobe Acrobat 6.0 CZ - komfortní profesionální nástroj na tvorbu PDF, vysoká cena. Adobe Acrobat Reader - čtení PDF souborů, volně dostupný program.

16 Videoklipy Nabízí se několik řešení ke snížení objemu dat, ale všechny snižují kvalitu zpracovávaného a zobrazovaného video signálu. A. Nejjednodušším řešením je zobrazení v menším okně, než je plná. B. Další možností je snížení rychlosti promítání snímků. Původní rychlost 30 obrázků za sekundu se sníží na obrázků. Toto se však projeví v trhaném pohybu, který je již okem viditelný. Ještě nižší rychlost se používá při videokonferencích. C. Třetí možností je komprese v kódování obrazu. Většina kompresních metod je ale ztrátová, takže při zpětné dekomprimaci obraz neobsahuje všechna původní data. Dochází tím ke zhoršení kvality obrazu. Formáty videa: MPEG (MovingPicturesExpertGroup) (*.mpg nebo *.mpeg ) AVI ( Audio Video Interleave) - (*.avi) QuickTime formát firmy Apple (*.mov) Real Video Format firmy RealMedia (*.rm nebo *.ram ) Shokwave (Flash) format firmy Macromedia ( *.swf

17 Vložení videa do stránky Použitím odkazu Název videa Použitím Parametry: Loop="číslo" – číslo udává počet opakování videoklipu. Je možné číselný údaj nahradit slovem "infinite", které určuje nekonečné opakování. Implicitně = 1; Controls - parametr zobrazí sadu ovládacích tlačítek (přehrávání, stop, pauza). Nepovinný Start="mouseover" - určuje, na jaký pokyn se začne soubor přehrávat. Uvedený příklad spouští přehrávání při přejetí myší nad klipem. Není-li uveden, spouští se přehrání po načtení stránky. Tento způsob nám ale nedovoluje přehrávání videa příliš ovlivňovat a hlavně funguje jen v Internet Exploreru.

18 Vložení videa do stránky Použitím - např. pro QuickTime formát Použitím

19 Odkazy Jiný dokument téže aplikace slovo Dokument na jiném počítači slovo nebo slovo Odkaz na jinou část téže stránky slovo Na uvedeném místě textu v dokumentu, kam je odkaz směřován, musí být "protějšek" odkazu ve tvaru : slovo

20 Zvuk a jeho formáty WAVE (*.wav) formát vyvinuly firmy IBM a Microsoft: Jedná se o formát používaný na zvukových CD. Jeho kvalita je velmi vysoká a také jeho pořízení je velmi náročné. Pořizuje se v nahrávacích studiích. MIDI (Musical Instrument Digital Interface)(*.mid nebo *.midi ), který slouží k výměně informací (dat) mezi elektronickým hudebním nástrojem a zvukovou kartou v počítači a umožňuje tak vytvářet a skládat hudbu na počítači. MIDI formát je velmi výhodný. Pro uložení jedné hodiny stereo záznamu použije cca 400 kB paměti, zatímco wav záznam potřebuje více než 600 MB. To je velmi výrazná úspora paměti a místa na archivačním médiu. MP3(MPEG) (*.mp3 nebo *.mpga). Tento formát je velmi rozšířený a byl původně vyvinut pro video. Dá se říct, že MP3 je zvuková část MPEG (MPG Audio). Velikost zvukového záznamu je téměř shodná s formátem MIDI, kvalita vynikající a pořízení jednoduché. Dnes je možné záznam v tomto formátu pořídit i pro laika. Program AudioGrabber toto zvládne během několika málo minut. Je to jen jeden zástupce z mnoha. Různá vydavatelství, např. Chip, PC World, aj., vydávají na svých nosičích podobné shareware programy nebo dokonce freeware. Zájemce jen program nainstaluje a už může "vyrábět" MP3.

21 Vložení zvuku do stránky Použití odkazu Název skladby Použití elementu Po spuštění této stránky v prohlížeči bude zvukový záznam automaticky přehrán tolikrát, kolikrát je uvedeno v parametru loop. Při hodnotě parametru „infinite“ bude přehráván donekonečna. Parametr balance ovlivňuje stereováhu ( … 10000). Parametr volume ovlivňuje hlasitost (10000 … 0). Použití elementu Parametry jsou analogické jako u videa. Podporován jen v Internet Exploreru!

22 Vložení zvuku do stránky Použití elementu

23 Vložení zvuku do stránky Použití elementu atributy:

24 Streaming multimédií Soubory, u kterých je možné tuto technologii používat, mají příponu ASF (Advanced Streaming Format). Kromě toho ještě může být přítomen soubor s příponou ASX (Advanced Stream Redirector), který specifikuje, jak se má soubor ASF přehrávat. To nám dovoluje jednoduše sladit přehrávání záznamu s ostatními ději na stránce. Příklad souboru ASX: Prázdniny 2005

25 Vkládání proudových MM do stránky Stránka s použitím proudových médií // Kód potřebný v NN if ( navigator.appName == "Netscape" ){ navigator.plugins.refresh(); document.write("\x3C" + "applet MAYSCRIPT Code=NPDS.npDSEvtObsProxy.class" ); document.writeln(" width=5 height=5 name=appObs\x3E \x3C/applet\x3E");}

26 Speciální efekty Běžící text TEXT

27 Synchronizovaná multimédia Skládají se z více typů multimediálních objektů, které spolupracují podle nějaké časové závislosti nebo na základě interakce s uživatelem. U jednotlivých objektů můžeme určit jejich umístění na obrazovce a čas spuštění. Synchronizovaná multimédia mají menší nároky na přenosovou kapacitu než třeba samotné video. Formáty: SMIL(Synchronized Multimedia Integration Language) FLASH

28 Příklad použití SMIL

29 Celé stránky ve Flash? Nedělejte všechno ve Flashi Flash je mocný nástroj, ale nehodí se na všechno. Zejména ne: 1. dlouhé texty 2. výtvory půjdou obtížněji aktualizovat, obtížněji tisknout a na starších počítačích vaši úchvatnou grafiku nahradí bílá plocha 3.celé stránky ve Flash jsou větší než HTML, i přes jeho úspornou grafiku. 4.vyhledávací služby neumějí flashové stránky indexovat 5.odkazy na jednotlivé části prezentace. Velké soubory jsou tabu! Hlavní předností vektorové grafiky je její malá datová velikost. Využívejte toho! Velikost animace zvětšují zvuky - někdy i desetkrát! Videosoubory snad není nutné ani komentovat. Myslete na zátěž procesoru Co šetří vektorové objekty na velikosti souboru, to užírají procesoru. Ten totiž musí obdržené informace vyhodnotit a správně zobrazit. Nejnáročnější je vykreslování průhledných objektů - nejhůř, když se jich několik překrývá a navzájem se pohybují. Myslete proto na pomalejší počítače - to co vám běží plynule, může způsobit nemalé problémy jinde. Žádné kýčovitosti Fonty Flash umožňuje přibalit použitý font do animace a zobrazit ho tak na všech počítačích správně. Přesto však nedoporučuji používat víc než 2 druhy písem a i tyto volit s rozmyslem. Zejména se vyvarujte exotickým písmům. Nikdo nebude číst texty napsané písmem ala "grafiti" nebo "matrix". Nesnažte se být chytřejší, než uživatel především jde o nekontrolovatelné přehrávání zvuků a podobné "znásilňování" uživatelů.

30 Vložení Flash do stránky

31 Vložení Flash do stránky Zde je alternativní obsah - často varianta s EMBED kvůli kompatibilitě se staršími prohlížeči.

32 Vlastní tvorba MM aplikace Příprava – ujasnění cílů Scénář- jako při nátáčení filmu musíme mít přesně jasno jak budou MM v prezentaci sesynchronizována Tvorba prvků- zvážit, které uděláme sami a které svěříme odborníkům Tvorba vlastní prezentace- tady uplatníte svůj vynikající výtvarný cit, který hlavně odlišuje prezentace amatérů od profesionálů Prezentace- synchronizace výkladu přednášejícího s obsahem prezentace

33 Na co nesmíme zapomenout „V jednoduchosti je síla“ Multimédia jsou velká a zpomalují práci Forma nenahrazuje obsah: sebelepší grafika a zvuk nezakryje to, že nezprostředkováváte zajímavé informace! Multimédia nesmí překážet: efektní klip možná upoutá při první návštěvě stránky, v budoucnu ale jen zdržuje přístup studenta k informacím!


Stáhnout ppt "Multimédia v e-learningu Centrum distančního vzdělávání Univerzita Palackého v Olomouci."

Podobné prezentace


Reklamy Google