ZŠ a MŠ Blatnice pod Svatým Antonínkem - web pro podporu výuky

Vítejte v sekci 9.tř. PRACOVNÍ ČINNOSTI

- Opakování základních pojmů z výpočetní techniky (pojmy hardware, software, rozdělení programového a technického vybavení počítače) - http://www.gvp.cz/local/new/ucebnice/Vyptech/

- Úvod do počítačové grafiky

Počítačovou grafikou rozumíme vše, co zpracovává počítač a co lze sledovat očima. Při práci s počítačovou grafikou řešíme několik okruhů problémů. Za prvé, jak získat zdrojová data. Za druhé, jak reprezentovat obraz. Za třetí, jak ukládat příslušné datové soubory a jaká je jejich velikost. Za čtvrté, jakým způsobem a na jakém zařízení grafiku zobrazit.

Co všechno lze považovat za počítačovou grafiku:

• technické výkresy
• digitální fotografie
• fonty, textová grafika
• 2D a 3D herní grafika
• prostředí operačního systému (plocha, ikony, pohyb oken)
• www stránky
• tiskové výstupy
• atd.

Podle způsobu uložení obrazové informace rozlišujeme dva základní typy počítačové grafiky: vektorovou a rastrovou.

Jaký je hlavní rozdíl mezi bitmapovou (rastrovou) a vektorovou grafikou?

Bitmapová (rastrová) grafika

Bitmapový (rastrový) obrázek se skládá z jednotlivých bodů, nebo-li pixelů. Body, pixely, jsou uspořádány do mřížky, kde každý jednotlivý bod má svoji přesnou polohu a barvu v barevném spektru (nejčastěji hovoříme o RGB).

Freeware pro bitmapovou grafiku

• Gimp

Placený program pro bitmapovou grafiku

• Corel Paintshop
• Adobe Photoshop

Využití bitmapové grafiky

• Tvorba a úprava obrázků (fotografií) a ilustrací (retuše, jasy, kontrasty, fotomontáže apod.)

Formáty bitmapové grafiky

• GIF
• JPEG
• PNG
• TIFF

Výhody

• Snadná úprava obrázků (fotografií)
• Jednoduché pořízení obrázků (fotografií)

Nevýhody

• Velké nároky na zdroje
• Při změně velikosti dochází ke zhoršení kvality obrázků (fotografií)
• Vyšší datová velikost obrázků (fotografií)

Vektorová grafika

Vektorový obrázek se zobrazuje pomocí křivek a různých nespecifických čar, tudíž to v praxi znamená, že je tvořen základními geometrickými útvary (body, přímky, křivky, mnohoúhelníky apod.).

Freeware pro vektorovou grafiku

• InkScape
• OpenOffice.org Draw

Placený program pro vektorovou grafiku

• Adobe Illustrator
• Corel Draw

Využití vektorové grafiky

• Tvorba propagačních reklamních materiálů (letáky, loga, plakáty, vizitky apod.)
• Tvorba animací a propagačních reklamních bannerů
• Tvorba schémat, diagramů, piktogramů, ornamentů, grafů a ilustrací

Formáty vektorové grafiky

• PDF (Portable Document Format)
• CDR (Corel Draw)
• PS (PostScript)
• AI (Adobe Illustrator Artwork)
• SVG (Scalable Vector Graphics)

Výhody

• Libovolné zmenšování a zvětšování obrázku beze ztráty kvality
• Práce s každým objektem v obrázku odděleně (zvláště, bez zásahu do jiného objektu)
• Menší datová velikost obrázku

Nevýhody

• Složitější pořízení obrázku
• Při větší složitosti vektorového obrázku, může nastat vyšší náročnost na procesor a paměť

Závěrečné hodnocení

Chcete-li vytvářet reklamní, či propagační materiály pro zviditelnění různých společností, pak pro tyto účely začněte využívat kvalitní grafické programy, které se specializují právě na tvorbu vektorové grafiky, jako například zdarma disponibilní InkScape, či placený** Adobe Illustrator**, který vám vřele doporučuji. Také jej při práci hojně využívám.

Naopak chcete-li upravovat, nebo jen lehce spravovat obrázky (fotografie) využijte příslušných grafických programů. Můžete využít placeného programu Adobe Photoshop, který je ve světě internetu nejrozšířenější, či využijte programu Gimp, který se poměrně lehce podobá programu Adobe Photoshop a přitom je zcela zdarma!

Příklady:

Vektorová grafika

Obrázek delfína vytvořený v Zoner Calisto

3x zvětšený detail téhož obrázku

Ukládá návod, jak obraz vytvořit. Základem jsou objekty (úsečky, kružnice, přímky). Můžeme si představit, že při vykreslování vektorového obrázku čte počítač zhruba toto: "Sestroj žlutou kružnici o poloměru 15 mm a šířce 1 mm, přes její střed veď zelenou přímku o tloušťce 2 mm." Typicky se využívá pro technické výkresy.

Výhody:

Možnost libovolné změny velikosti obrázku bez ztráty kvality

Malá velikost pro čárovou (kreslenou) grafiku

Nevýhody:

Pro většinu zobrazovacích zařízení je nutno ji převést na rastrový obrázek

Neexistuje jednotný formát -> problémy s otvíráním a přenosem souborů

Typické přípony souborů:

pdf, ps - soubory původně určené pro tiskárny, existují pro ně zdarma prohlížeče, zejména Adobe Reader

ttf - soubory obsahující definici fontů

zmf (soubory Zoner Calista), dwg (AutoCAD), cdr (Corel Draw!) a mnoho dalších

Rastrová grafika

Fotografie neonky černé

3x zvětšený detail téhož obrázku

Jinak také zvaná bitmapová. Ukládá mapu barev jednotlivých bodů obrazu. Můžeme si představit, že počítač při vykreslování čte zhruba toto: "Bílá, bílá, červená, červená, bílá, bílá, další řádek, bílá, červená, bílá, bílá, červená, bílá, další řádek ..." Typicky se používá pro fotografie.

Výhody

Malá velikost pro fotografie

Jednoduché zobrazení

Nevýhody

Problematická změna měřítka

Typické přípony souborů:

bmp, jpg, tiff, raw, gif, png

Rozlišení

Rozlišení je v počítačové grafice pojem s několika významy. U monitorů (běžných i LCD) se jím myslí rozměr obrazovky měřený počtem zobrazených bodů (pixel, px). Rozlišení 1024x768 px tedy znamená, že na obrazovce se zobrazuje rastrový obrázek, jehož delší strana má 1024 bodů a kratší 768 bodů.

U tiskáren se pojmem rozlišení rozumí hustota bodů při tisku. Měří se v jednotkách dpi(dots per inch, teček na palec - pro připomenutí, palec je 2,54 cm). Optimální rozlišení pro fotografii se udává 300 dpi, tj. 300 teček na 2,54 cm; pro text stačí 75dpi. U skenerů rozlišení v dpi říká, kolik bodů je vytvořeno ve vznikajícím souboru z obrázku dané velikosti. Při rozlišení 300 dpi bude obrázek o velikosti 2,54x2,54 cm převeden na bitmapu o rozměrech 300x300 px.

Rozlišení digitálních fotoaparátů říká, kolik bodů má výsledná fotografie (zhruba řečeno, kolik světlocitlivých buněk má snímač). Udává se v megapixelech (Mpx). Protože mají snímače poměr stran 4:3, je velikost fotografie 4d x 3d, kde d je odmocnina z výrazu (rozlišení v px)/12.

Barvové modely a barevná hloubka

Počítač je digitální zařízení. To znamená, že pracuje s čísly ve dvojkové soustavě. Je otázkou, jak převést barvu na čísla, a odpovědí jsou barvové modely (někdy nazývány barevné prostory).

Nejpoužívanější je model RGB, který jakoukoliv barvu vyjadřuje jako kombinaci tří světel - červeného (Red), zeleného (Green) a modrého (Blue) - různé intenzity. Intenzita je reprezentována celým číslem, obvykle v rozsahu 0 až 255. Jsou-li všechna světla zhasnuta, vnímáme černou barvu, svítí-li všechna na maximum, vidíme bílou barvu. Tento model se používá zařízení, která svítí (monitory, dataprojektory), a u digitálních fotoaparátů. RGB model je za pomoci spousty obrázků podrobněji vysvětlen na serveru Digimanie

Druhým používaným modelem je model CMY(K). Ten využívá kombinaci tří barev - azurové (Cyan), fialové (Magenta) a žluté (Yellow). Bez použití barev vidíme bílou (přesněji vidíme barvu podložky), při použití všech tří s maximální intenzitou vzniká černá. Tento model používají tiskárny. Z úsporných důvodů se do nich přidává ještě zásobník čené (blacK) barvy.

Výše uvedené modely odpovídají skutečnému způsobu vzniku barvy. Existují i modely určené zejména pro definování barev v prostředí grafických programů, např. HSL - barevný tón (Hue), sytost barvy (Saturation), světlost (Lightness). Na stránkách Mgr. Jiřího Doležala najdete více informací o barvových modelech.

Porovnání velikosti RGB a CMYK prostoru s gamutem lidského oka

Barevná hloubka je číslo, které udává kolik informací obsahuje jeden bod. Udává se v bitech. Nejčastěji používané soubory typu jpg pracují s 24 bitovou barevnou hloubkou. Na každou z barev RGB tak připadá 8 bitů (tj. jeden byte, čteno "bajt"). To stačí na reprezentaci 256 odstínů, celkem dostáváme asi 16,7 miliónů zobrazitelných barev.

Problémem barevných prostorů je jejich různost. Každý z nich totiž popisuje odlišnou množinu barev (tak zvaný gamut), která je navíc vždy menší než množina barev rozeznatelných okem. Na monitoru tedy lze zobrazit netisknutelnou barvu a naopak. Tento efekt je nejvýraznější v oblasti odstínů zelené a v oblastech jemných světlých přechodů (obloha).

Komprese

Obrázky se na disk ukládají ve formě souborů. Jelikož je velikost disků omezena, je třeba se zabývat velikostí těchto souborů. Ta může být poměrně značná, např. fotografie 10x15 cm skenovaná při rozlišení 300 dpi při 24 bitové barevné hloubce má datovou velikost (10/2,5)x300x(15/2,5)x300x(24/8) = 6,48 MB; běžná tapeta na plochu má datovou velikost 1024x768x(24/8) = 2,4 MB. Sto fotografií z 8 Mpx fotoaparátu má datovou velikost zhruba 2,5 GB.

Ke zmenšování velikosti se používá metoda zvaná komprese. Rozlišujeme u ní dva základní druhy: bezztrátovou a ztrátovou. Ztrátová komprese je podstatně účinnější (tedy zkomprimovaný soubor je menší), dochází při ní ke změnám v obrazu. Tyto změny nejsou za normálních okolností pozorovatelné.

Představme si následující rastr: "Bílá, bílá, světle šedá, bílá, bílá, bílá, další řádek, bílá, šedá, tmavě šedá, tmavě šedá, šedá, bílá, další řádek ..." Bezztrátová komprese jej zakóduje jako "2 bílá, světle šedá, 3 bílá, další, bílá, šedá, 2 tmavě šedá, šedá, bílá, další ..." Při dekompresi (opačný postup) tak získáme obraz zcela shodný s původním. Je vidět, že komprese je obvykle tím účinější, čím více se části souboru opakují.

Ztrátová komprese zakóduje náš rastr například takto: "6 bílá, další, bílá, 4 šedá, bílá, další ..." Tento velmi zjednodušený příklad vychází z předpokladu, že oko nerozliší zanedbaný světle šedý bod v dlouhé řadě bílé. Dekomprimovaný obraz je zřejmě odlišný od původního. Za tuto cenu získáme velmi malý komprimovaný soubor.

Na stránkách Mgr. Jiřího Doležala najdete podrobnější popis komprimace.

Typy rastrových souborů

BMP

Microsoft Windows BitMaP

Asi jediný program, který tyto soubory standardně využívá je Kreslení ve Windows

Jednoduchý formát. Jde o rastr v nejčistší možné podobě, tedy 3 čísla pro každý obrazový bod, jeden bod za druhým.

Barevná hloubka 24 bit

Nepoužívá kompresi => velké soubory

GIF

Graphics Interchange Format

Formát souborů vhodný pro jednoduché webové obrázky a ikonografiku

Barevná hloubka 8 bit, tj. 256 barev z libovolně definované palety

Používá bezztrátovou kompresi

Umožňuje ukládání více obrázků do jednoho souboru => animace

Jedné barvě lze nastavit průhlednost

PNG

Portable Network Graphics

Relativně nový formát, určený pro přenos souborů v síti

Obsahuje algoritmus pro opravu chyb vzniklých přenosem

Používá bezztrátovou kompresi, v porovnání s GIF je komprese účinnější

Neumí animace

Barevná hloubka až 48 bitů + až 16 bitů pro průhlednost

JP(E)G

Joint Photographic Experts Group

Barevná hloubka 24 bit

Určen pro ukládání fotografií, velmi nevhodný pro obrázky s ostrými hranami(text)

Používá ztrátovou kompresi nastavitelné kvality => velká datová úspora

Ke ztrátě kvality dochází při každém uložení JPG souboru

TIFF

Tag Image File Format

Existuje více verzí tohoto formátu

Používá se především pro archivaci obrázků k pozdějším úpravám

Zvolna ho nahrazuje formát PNG

Barevná hloubka až 24 bit

Může používat bezztrátovou kompresi

JPG, 90% kvalita, 96kB

JPG, 0% kvalita, 1,1kB

Pro konkrétnější představu o velikostech jednotlivých souborů může sloužit následující tabulka:

Na stránkách Fireworks - Jak psát web si o rastrových souborech přečtete více.

Zdroj: http://www.gvmyto.cz/internetmoravek/pg.html

Pozn.: Počítačová grafika je dost široký pojem, zahrnuje Malování přes SW typu Callistu, nástroje na 2D kreslení, 3D modelování a spostu dalšího.....Zkuste si nechat ve vyhledávači najít obrázky na zadání "2D CAD" a "3D CAD"... sposta SW je legálně zdarma, např. Google SketchUp.