Grafika

1. Vektor x bitmap Co to je rozlišení Co to znamená RGB a co CMYK Formát souborů s použitím vlastních fotek a encyklopedie cs.wikipedia.org copyleft VV Grafika

2. Vektor x bitmap • Vektorový obrázek se skládá z křivek a objektů, tím pádem se při zvětšování a zmenšování „neničí“, především při zvětšování se upravuje poměrně • Bitmapový obrázek se skládá z bodů o určité velikosti a barvě, při zvětšování se zvětšují tyto body a tím dochází k deformaci obrázku, podobně jako při pohledu na obrázek v novinách/časopisech přes lupu

3. Co je to rozlišení • Obrázek rozložený na jednotlivé pixely • Pixel (zkrácení anglických slov picture element, obrazový prvek; někdy též pel, dále zkracováno na px) je nejmenší jednotka digitální rastrové (bitmapové) grafiky. Představuje jeden svítící bod na monitoru, resp. jeden bod obrázku zadaný svou barvou, např. ve formátu RGB či CMYK. • Body na obrazovce tvoří čtvercovou síť a každý pixel je možné jednoznačně identifikovat podle jeho souřadnic. Vzhledem k omezenému množství pixelů a omezené frekvenci vykreslování obrazu dochází při zobrazovování na monitoru k celé řadě problémů. Dochází k mnoha nežádoucím efektům. Mezi ně patří např. aliasing, moaré, neostrosti, mozaikové zkreslení, ztráta informací při zmenšování, zvětšování nebo otáčení obrazu apod.

4. Co je to rozlišení • Velikost pixelu záleží na typu monitoru. U obvyklých analogových typů lze velikost pixelu měnit změnou rozlišení. LCD obrazovky naproti tomu mají počet fyzických pixelů (tzv. nativní rozlišení) zpravidla pevně vázaný na používané rozlišení (např. 1024×768) a zobrazování jiného rozlišení u takového monitoru vede k určité deformaci obrazu, neboť „počítačové pixely“ jsou přepočítávány a nerovnoměrně přerozdělovány na větší počet „fyzických pixelů“. • V běžných režimech má obrazovka rozlišení od zhruba 640×480 po 1600×1200, někdy i více. U patnáctipalcového monitoru při rozlišení 1024×768 představuje velikost jednoho pixelu sotva 0,3 mm. Maximální možné rozlišení monitoru se uvádí v jednotkách „pixel na palec“ (zkratka ppi z anglického pixel per inch).

5. DPI • Dots per inch (DPI) je údaj určující, kolik obrazových bodů (pixelů) se vejde do délky jednoho palce. Jeden palec, anglicky inch, je 2,54 cm, někdy se užívá zkratky PPI čili pixels per inch, pixely na palec. • Máme fotografii pořízenou 1Mpx fotoaparátem. Obrázek, který má 1280 bodů (pixelů) na výšku a 960 bodů (pixelů) na šířku, chceme vytisknout na tiskárně s rozlišením 300 DPI. Potom bude vytištěný obrázek vysokýa široký • V polygrafii je standardně používáno rozlišení 300 dpi.

6. Barevná hloubka • Barevná hloubka je termín používaný v počítačové grafice, který popisuje počet bitů použitých k popisu určité barvy nebo pixelu v bitmapovém obrázku nebo rámečku videa. Toto pojetí je také známé jako počet bitů na pixel, zejména je-li uvedeno spolu s počtem použitých pixelů. Větší barevná hloubka zvětšuje škálu různých barev a přirozeně také paměťovou náročnost obrázku či videa. • Používané barevné hloubky • 16bitová barva (216 = 65 536 barev) někdy také označováno jako High Color • 32 nebo 24bitová barva (232 = 4294967296, 224 = 16777216) někdy označováno jako True Color

7. Velikost fotografie na monitoru a tiskárně - úkol • Podívejte se do složky soubory/velikost a porovnejte rozlišení obrázku a velikost souboru, seřaďte soubory podle velikosti • Spočítejte pro každý obrázek, jaká bude jeho velikost tisku bez deformace na tiskárně s rozlišením 300 DPI

8. Barevné komponenty pixelu • Pro ukládání a zpracování obrazových dat se nejčastěji používá barevný model RGB nebo RGBA, kde jednotlivé komponenty značí R červená, G zelená, B modrá a A tzv. alfa kanál pro průhlednost.1 indexovaná barva s paletou 3-3-2 • 2 toto je nejčastější rozložení pro 16bitovou hloubku, možné jsou i jiné kombinace např. RGBA [5 5 5 1] • 3 nativní barevná hloubka grafické karty VGA

9. Základní rozdělení barevných modelů • Aditivní míchání barev - barevný model pracující se světelnými zdroji barev (např. monitor nebo projektor) • Subtraktivní míchání barev - barevný model pracující se odrazem světla - bílého (např. různé druhy tiskových technik, viz tiskárna)

10. Aditivní míchání barev • Aditivní míchání barev je takový způsob míchání barev, kdy se jednotlivé složky barev sčítají a vytváří světlo větší intenzity. Výsledná intenzita se rovná součtu intenzit jednotlivých složek. • Pracuje se se třemi základními barvami: červená, zelená a modrá. • Aditivní míchází barev odpovídá vzájemnému prolínání tří barevných kuželů světla ze tří reflektorů na bílém plátně. Každý reflektor má filtr odpovídající základní barvě. • Část plátna, která je osvětlená rovnoměrně všemi třemi reflektory, je bílá. Když smícháme jen dvě barvy světla, např. červené a zelené, dostaneme barvu žlutou. Budeme-li clonou měnit poměr intenzity obou světel, dostaneme různé barevné odstíny mezi těmito barvami. • Modrá a zelená barva ve stejném poměru dávají azurovou barvu, červená a modrá dávají barvu purpurovou. • Smícháním dvou základních barev vznikne třetí, základní barva, která je barvou komplementární (doplňkovou).

11. RGB • Barevný model RGB neboli červená-zelená-modrá je aditivní způsob míchání barev používaný ve všech monitorech a projektorech (jde o míchání vyzařovaného světla), tudíž nepotřebuje vnější světlo (monitor zobrazuje i v naprosté tmě) narozdíl např od CMYK modelu. • Každá barva je udána mohutností tří základních barev – komponent (červené - red, zelené – green a modré – blue, odtud RGB). Základní barvy mají vlnové délky 630, 530 a 450 nm. Mohutnost se udává buď v procentech (dekadický způsob) nebo podle použité barevné hloubky jako určitý počet bitů vyhrazených pro barevnou komponentnu (pro 8 bitů na komponentu je rozsah hodnot 0 – 255), přičemž čím větší je mohutnost, tím s vyšší intenzitou se barva komponenty zobrazuje.

12. RGB

13. Subtraktivní míchání barev • Subtraktivní míchání barev je způsob míchání barev, kdy se s každou další přidanou barvou ubírá část původního světla. Pokud například skládáme na sebe barevné filtry nebo mícháme pigmentové barvy, mícháme je subtraktivní metodou. • Světlo prochází jednotlivými barevnými vrstvami a je stále více pohlcováno. Výsledná barva se skládá z vlnových délek, které zbudou po odrazu nebo průchodu filtrem. • Základní barvy jsou: žlutá, azurová, purpurová. • Základní barvy subtraktivního míchání jsou komplementární (doplňkové) k základním barvám při jejich aditivním míchání. • Smícháním modrozelené a žluté barvy vznikne barva zelená, žluté a purpurové barva červená a purpurové a modrozelené barva modrá. Smícháním všech tří základních barev dostaneme barvu černou.

14. CMYK • CMYK je barevný model založený na subtraktivním míchání barev (mícháním od sebe barvy odčítáme, tedy omezujeme barevné spektrum, které se odráží od povrchu). CMYK se používá především u reprodukčních zařízení, která barvy tvoří mícháním pigmentů (např. inkoustová tiskárna). Model obsahuje čtyři základní barvy: • azurovou (Cyan); • purpurovou (Magenta); • žlutou (Yellow); • černou (black), označovanou také jako klíčovou (Key). • V ideálním případě by byly postačující pouze první tři barvy (model CMY), jejichž substraktivním složením dohromady by měla vzniknout černá barva. Ve skutečnosti však při použití běžných barviv vzniká barva tmavě šedivá, a zároveň je narozdíl od ostatních barev černá výrazně levnější, proto většina tiskových zařízení používá ještě čtvrtou černou barvu.

15. CMYK

16. Grafika – formáty souborů • Hlavním rozlišením je ztrátový/bezztrátový formát – barevný přechod se zjednoduší, oko nepostřehne • Nejčastější formáty bezztrátové: TIFF, BMP • Nejčastější formáty ztrátové: JPG, GIF, PNG

17. BMP • BMP nebo také .DIB (device-independent bitmap) je počítačový formát pro ukládaní rastrové grafiky. • Formát BMP byl poprvé představen v roce 1988 jako součást nového systému OS/2 verze 1.10 SE. O něco později firma Microsoft trochu rozšířila jeho definici a zahrnula ho do svého grafického operačního prostředí – Microsoft Windows 3.0. Na počátku roku 1992 firma IBM uvedla na trhu první 32bitový systém OS/2 verze 2.0, který obsahoval vylepšenou variantu BMP s novou strukturou pro uskladnění vícenásobných bitových map v jednom souboru. Tento typ souboru se často obecně označuje jako bitmapové pole.

18. BMP • Obrázky BMP jsou ukládány po jednotlivých pixelech, podle toho, kolik bitů je použito pro reprezentaci každého pixelu je možno rozlišit různé množství barev: 2 (1 bit), 16 (4 bity), 256 (8 bitů), 65 536 (16 bitů), nebo 16,7 miliónu (24 bitů). Osmibitové obrázky mohou místo barev používat šedou škálu. • Soubory ve formátu BMP většinou nepoužívají žádnou kompresi (přestože existují i varianty používající kompresi RLE). Z tohoto důvodu jsou obvykle BMP soubory mnohem větší než obrázky stejného rozměru, které kompresi používají. • Velikost nekomprimovaného obrázku v bytech lze přibližně vypočítat podle vzorce:(šířka v pixelech) * (výška v pixelech) * (bitů na pixel / 8)

19. BMP • K velikosti obrázku je třeba ještě připočítat velikost hlavičky souboru, která se liší dle jeho verze i dle použité barevné hloubky. • Výhodou tohoto formátu je jeho extrémní jednoduchost a dobrá dokumentovanost a že jeho volné použití není znemožněno patentovou ochranou. Díky tomu jej dokáže snadno číst i zapisovat drtivá většina grafických editorů v mnoha různých operačních systémech. X Window System používá podobný formát XBM pro jednobitové černobílé obrázky a XPM pro barevné obrázky. • V praxi se pro ukládání obrázků vyžadujících zachování všech informací používají spíše novější formáty PNG, GIF nebo také TIFF.

20. JPG • JPEG (vyslovováno džeipeg) je standardní metoda ztrátové komprese používané pro ukládání počítačových obrázku ve fotorealistické kvalitě. Formát souboru, který tuto kompresi používá, se také běžně nazývá JPEG. Nejrozšířenější připonou tohoto formátu je .jpg, .jpeg, .jfif, .jpe, nebo tato jména psána velkými písmeny. • Skutečným názvem typu souboru je JFIF, což znamená JPEG File Interchange Format. Zkratka JPEG znamená Joint Photographic Experts Group, což je vlastně konosorcium, které tuto kompresi navrhlo.

21. JPG • Když se běžně hovoří o souboru JPEG, míní se tím většinou soubor JFIF, nebo soubor Exif JPEG. Existuje však více formátů soborů založených na kompresi JPEG, například JNG. • JPEG/JFIF je nejčastější formát používaný pro přenášení a ukládání fotografií na World Wide Webu. Není však vhodný pro malé a jednoduhcé kresby, protože kompresní metoda JPEG vytváří v takovém obrazu viditelné a rušivé artefakty. Pro takové účely se většinou používájí soubory PNG a GIF. Protože má GIF pouze 8 bitů na pixel, není vhodný pro barevné fotografie, PNG je možné použít pro ukládání fotografií, ale výsledná velikost souboru je nevhodná pro publikování na webu.

22. GIF • GIF (Graphics Interchange Format) je grafický formát určený pro rastrovou grafiku. GIF používá bezeztrátovou kompresi LZW, narozdíl například od formátu JPEG, který používá ztrátovou kompresi. GIF je tedy vhodný pro uložení tzv. pérokresby (nápisy, plánky, loga). GIF umožňuje také jednoduché animace. • Formát GIF se stejně jako formáty PNG a JPEG používá pro WWW grafiku na Internetu.

23. GIF • GIF má jedno velké omezení — maximální počet současně použitých barev barevné palety je 256 (8 bitů) v jednom rámci (rámců ale může být v jednom obrázku neomezeně mnoho, takže není pravda, že obrázek ve formátu GIF může mít maximálně 256 barev). Toto omezení nemá formát PNG, který se hodí ke stejným účelům jako GIF a nabízí v některých případech i lepší kompresi. Formát PNG však neumožňuje animace (ty umožňuje až MNG).

24. PNG • PNG (Portable Network Graphics - anglicky přenosná síťová grafika; oficiální výslovnost zkratky je „ping“) je grafický formát určený pro bezeztrátovou kompresi rastrové grafiky. Byl vyvinut jako zdokonalení a náhrada formátu GIF, který je patentově chráněný. PNG nabízí podporu 24 bitové barevné hloubky, nemá tedy jako GIF omezení na maximální počet 256 barev současně. PNG tedy do jisté míry nahrazuje GIF, nabízí více barev a lepší kompresi. Navíc obsahuje osmibitovou průhlednost (tzv. alfa kanál), to znamená, že obrázek může být v různých částech různě průhledný (tzv. RGBA barevný model). PNG však neumí jednoduché animace, které naopak umožňuje formát GIF. PNG se stejně jako formáty GIF a JPEG používá na Internetu. • Formát PNG nepodporuje systém kladení barev CMYK.

25. TIFF • TIFF (zkratka Tag Image File Format) je jeden ze způsobů ukládání rastrové počítačové grafiky. Formát TIFF tvoří de facto standard pro ukládání snímků určených pro tisk. • Podporuje 24 bitové barevné rozlišení. Používají se různé specifikace. Formát lze bezeztrátově komprimovat při využití např. LZW komprese, ale i jinych metod.

26. SVG • SVG (z anglického Scalable Vector Graphics škálovatelná vektorová grafika) je značkovací jazyk a formát souboru, který popisuje dvojrozměrnou vektorovou grafiku pomocí XML. Formát SVG by se měl v budoucnu stát základním otevřeným formátem pro vektorovou grafiku na Internetu. Zatímco pro rastrovou grafiku je na internetu formátů dostatek (např. GIF, PNG a JPEG), otevřený vektorový formát zatím na Internetu chyběl. • SVG definuje tři základní typy grafických objektů: • vektorové tvary (vector graphic shapes - obdélník, kružnice, elipsa, úsečka, lomená čára, mnohoúhelník a křivka) • rastrové obrazy (raster images) • textové objekty

27. SVG • Tyto objekty mohou být různě seskupeny, formátovány pomocí atributů nebo stylů CSS a polohovány pomocí obecných prostorových transformací. SVG též podporuje ořezávání objektů, alpha masking, interaktivitu, filtrování obrazu (konvoluce, displacement mapping, atd…) a animaci. Ne všechny SVG prohlížeče však umí všechny tyto vlastnosti.

28. Formáty - úkol • Podívejte se do složky soubory/format a porovnejte typ souboru a velikost souboru, seřaďte soubory podle velikosti • Podívejte se do složky soubory/komprese, porovnejte soubory podle velikosti a podle zkreslení kompresí

29. Velikost fotografie na monitoru a tiskárně - úkol • Podívejte se do složky soubory/velikost a porovnejte rozlišení obrázku a velikost souboru, seřaďte soubory podle velikostiblatna-m.jpg 64 535 blatna-ms.jpg 48 736 blatna-sm.jpg 26 248 blatna1.jpg 1 292 538 • Spočítejte pro každý obrázek, jaká bude jeho velikost tisku bez deformaceblatna-m.jpg 5,4 x 4,1 blatna-ms.jpg 7,62 x 5,72 blatna-sm.jpg 8,67 x 6,5 blatna1.jpg 16,8 x 12,6

30. Formáty - úkol • Podívejte se do složky soubory/format a porovnejte typ souboru a velikost souboru, seřaďte soubory podle velikosti994 265 blatna.jpg1 292 538 blatna1.jpg1 989 587 blatna.gif3 695 267 blatna.png8 856 630 blatna.bmp8 869 333 blatna.tif • Podívejte se do složky soubory/komprese, porovnejte soubory podle velikosti a podle zkreslení kompresíblatna3.jpgblatna2.jpgblatna.jpgblatna1.jpg